如何正确绘制椭圆[KineticJs]

我怎么能创建一个绘图画布，可以创建一个基于鼠标坐标的椭圆？这里是我上的jsfiddle代码（我还是新来此一）：如何正确绘制椭圆[KineticJs]

这里是我的代码来绘制椭圆（59行）：

var x, y, width, height; 
     //var rect; 

     //Math.min untuk mencari nilai terkecil dari 2 parameternya 
     x = Math.min(event.clientX, lastX); 
     y = Math.min(event.clientY, lastY); 

     //Math.abs buat bikin nilai negatif jadi positif 
     width = event.clientX - lastX; 
     height = event.clientY - lastY; 

     if(rect_drawed == 0){ 
      rect = new Kinetic.Ellipse({ 
       x: x, 
       y: y, 
       radius:{ 
        x: width, 
        y: height 
       }, 
       stroke: 'black', 
       strokeWidth: 4, 
       fill: 'blue', 
       name: 'rect'+rect_counter 
      }); 
      layer.add(rect); 
      layer.draw(); 
      rect_drawed = 1; 
      //stage.add(rect); 

      /*rect.on('click', function(){ 
       rect.setFill('RED'); 
      });*/ 
     } 
     rect.setAttrs({ 
      x: width/2, 
      y: height/2 
     }); 
     layer.draw();

所以，当我执行代码，它会导致错误.. Chrome的控制台说：未捕获的错误：INDEX_SIZE_ERR：kinetic.js上的DOM异常1：29

我的代码出了什么问题？

最好的问候，

卢基[R Rompis

来源

2013-01-22 thekucays

看你的代码，

width = event.clientX - lastX; 
    height = event.clientY - lastY;

您允许的宽度和高度为负，这将引发你的DOM异常。

让它：

width = Math.abs(event.clientX - lastX); 
    height = Math.abs(event.clientY - lastY);

http://jsfiddle.net/HSdgT/3/此链接复制你的错误。

http://jsfiddle.net/HSdgT/4/此链接与错误消失。

来源

2013-01-22 15:31:43 SoluableNonagon

如何正确绘制椭圆[KineticJs]

回答

相关问题