在画布上移动两个以上的箭头线答案

【问题标题】：moving more than two arrow lines on canvas在画布上移动两个以上的箭头线
【发布时间】：2012-05-09 23:47:33
【问题描述】：

这是我使用 kinetic.js 的代码我画了三条线并用鼠标移动。

$(document).ready(function(){   

 var y1=50;
 var stage = new Kinetic.Stage({
          container: "container",
          width: 578,
          height: 200
    });

 var layer = new Kinetic.Layer();

 var group=new Kinetic.Group({
          draggable: true,
          dragConstraint : 'horizontal'
    });


var lineme =function(pts){
var line1 = new Kinetic.Line({
      points: pts,
      stroke: "black",
      strokeWidth: 4,
      lineCap: 'round',
      lineJoin: 'round',
    });
    group.add(line1);
   }
 for(a=0;a<=2;a++)
 {
     var points1 = [{
          x: 73,
          y: y1
        }, {
          x: 300,
          y: y1
        }];

      lineme(points1);
      y1=y1+50;
  }

   group.on("mouseover", function(){
          document.body.style.cursor = "pointer";
        });
   group.on("mouseout", function() {
      document.body.style.cursor = "default";
    });

    // add the shape to the layer       
    layer.add(group);
    // add the layer to the stage
    stage.add(layer);

 });

我想画箭头线我尝试了更多时间，但我找不到正确的解决方案。他们在动力学 js 中是否有任何箭头功能，任何人都可以帮助我

【问题讨论】：

标签： javascript jquery html5-canvas kineticjs

【解决方案1】：

您必须创建一个组并将两条线都添加到该组中。

检查以下示例： http://www.html5canvastutorials.com/kineticjs/html5-canvas-drag-and-drop-a-group-with-kineticjs/

希望对你有帮助！

【讨论】：

【解决方案2】：

var line2 = .....
// add another line to the layer before adding it to the stage
layer.add(line2);

确定吗？

【讨论】：

感谢您的回复我在图层中添加了线条，线条已绘制，但我想添加两条宽度相同且一次可拖动的线条（意味着同时拖动）