小编Nil*_*hra的帖子

使用铅笔在画布上绘制的像素不居中

我正在使用 p5.js 用铅笔在画布上绘制像素。问题是,在这种情况下,当铅笔尺寸为 1 或更小时,其位置不居中。它向左向右不居中。

我在我们的代码中注意到一个有趣的现象。看起来,当鼠标的 x 和 y 位置接近 0.5 时,绘制的像素显示为居中;然而,在其他情况下,像素似乎稍微偏离中心。为了解决这个问题,我正在考虑改进我们的渲染逻辑。我将确保将像素密度设置为 1 以防止任何自动缩放问题。此外,我可能会尝试通过合并校正因子来调整像素位置,也许从 x 和 y 坐标中减去 0.5。仔细检查代码中可能影响像素精确位置的任何转换或缩放操作至关重要。

我注意到 P5.image.set 方法似乎不接受浮点数;它四舍五入到最接近的整数。有没有人找到此问题的解决方法,或者我在文档中遗漏了某些内容?

是代码。 是部署的应用程序。

生成问题的步骤:-

  1. 打开链接
  2. 变焦(鼠标+滚轮)
  3. 选择铅笔
  4. 鼠标在画布上按下

提前致谢。如果有任何疑问评论,我会补充得更清楚。

下面是我们在 for 循环中设置像素值的 mousepressed 方法的代码

mousePressed(mouseX, mouseY) {
      if (this.menuSelection === 'drawPencil') {
        this.mapImage.loadPixels()
        let size = 1
        let y = mouseY
        for (let i = mouseX - size / 2; i < mouseX + size / 2; i++) {
          for (let j = y - size / …
Run Code Online (Sandbox Code Playgroud)

javascript vue.js p5.js

7
推荐指数
1
解决办法
544
查看次数

将数据变量作为 vue2 样式部分的参数传递

让我们有一个数据变量,我想使用这个数据变量来实现我的风格。

data() 
{
 return{
        selected:{
         index: 2
        }
     }
}
<style>
.parent-table >>> .table-row:nth-child(/* here i want to pass selected.index */) {
   background: red;
}
</style>


Run Code Online (Sandbox Code Playgroud)

我的用例是我的登陆页面中使用了一个表格组件。我想更改登陆页面中所选表格行的背景。

javascript css jquery vuejs2 vuetify.js

4
推荐指数
2
解决办法
501
查看次数

标签 统计

javascript ×2

css ×1

jquery ×1

p5.js ×1

vue.js ×1

vuejs2 ×1

vuetify.js ×1