小编Nic*_*den的帖子

我正在尝试在矩形的四个角上放置调整大小的手柄,可以拖动它来调整矩形的大小.我遇到的麻烦是在拖动其中一个矩形点后计算矩形的新宽度,新高度和新点.

如果矩形没有旋转,这显然是非常容易的,因为宽度和高度将改变与鼠标的offsetX和offsetY相同的大小.但是,此矩形可以旋转,因此offsetX和offsetY与宽度/高度的变化不匹配.

在上图中,我已经用纯黑色表示了我已经拥有的信息,以及我想要用浅灰色找到的信息.我试图展示如果我将a1角向上拖动到右边,矩形应该如何变化.

谁能帮我弄清楚如何计算缺失的信息？

谢谢你的帮助!非常感谢.

-

编辑:我有拖动开始,拖动移动,并拖动每个句柄上的结束回调.我当前的代码只是得到了新的点(在这个例子中,a2).不幸的是,这只是移动我们当前拖动到新位置的手柄,但显然对矩形的宽度/高度以及其他点的位置没有影响.我希望帮助找出的是如何根据这种阻力计算新的宽度和高度,以及其他点的新位置.

处理坐标(拖动前)

handles: { 
  a: { x: 11, y: 31 },
  b: { x: 44, y: 12 }, 
  c: { x: 39, y: 2 }, 
  d: { x: 6, y: 21 }
};

回调:

// Save the original x and original y coordinates
// of the handle, before dragging
onDragStart: function(x, y, handle) {
  handle.data({
   ox: x,
   oy: y
  });
}

// While dragging the handle, update it's coordinates to 
// reflect its new …

我建立了一个数据库,其中包含一个自动递增列,该列是一个ID.问题是我忘了在phpMyAdmin中创建表时检查自动增量...并且直到现在才注意到!所以我拥有的是:

ID   |   column one   |   column two
------------------------------------
0    |   some value   |   some value
0    |   other value  |   something else
0    |   example val. |   something
0    |   my example   |   something

基本上,我的"自动递增"列显示全面的零.如何修改此表以显示所有先前和所有未来行的自动增量？

我正在尝试在单个SVG过滤器中实现多个投影,但我相信我的问题比这更通用:如何将多个效果添加到单个SVG过滤器中？就我而言,这是我正在努力做的事情.

我有一个当前包含单个路径元素的SVG文档,并且我已经对此路径元素应用了单个阴影效果.

我的SVG文件

<svg xmlns:xlink="http://www.w3.org/1999/xlink" width="1440" height="1750">
  <defs>
    <filter id="dropshadow">
      <feGaussianBlur in="SourceAlpha" stdDeviation="2.2"></feGaussianBlur>
      <feOffset dx="12" dy="12" result="offsetblur"></feOffset>
      <feFlood flood-color="rgba(0,0,0,0.5)"></feFlood>
      <feComposite in2="offsetblur" operator="in"></feComposite>
      <feMerge>
        <feMergeNode></feMergeNode>
        <feMergeNode in="SourceGraphic"></feMergeNode>
      </feMerge>
    </filter>
  </defs>

  <path xmlns:xlink="http://www.w3.org/1999/xlink" d="M 100 100 L 300 100 L 200 300 z z" fill="#2DA9D6" filter="url(#dropshadow)"></path>
</svg>

这给了我一个看起来像这样的SVG:

现在,我想为这个相同的路径元素添加第二个(完全不同的)阴影.例如,假设一个上升到元素左侧的阴影.在CSS中,我的整个阴影可能看起来像:

box-shadow: 5px 5px 5px rgba(0,0,0,0.5), -5px -5px 5px rgba(0,0,0,0.5);

如何使用SVG过滤器执行这些多重阴影？我已经看过这个问题,建议将多个效果放到一个过滤器中,但我不确定如何将多个效果合并到一个过滤器中.

谢谢你的帮助!