createjs:单击时形状神秘地移动

WKS

我是HTML5和JavaScript的新手。我正在一个非常简单的“画布”项目中工作,其中有两个试管,单击其中一个会降低其水平,并增加另一个的水平。

我已经编写了代码来执行此操作,并且它起作用了,唯一的麻烦是,当我单击试管时-它在屏幕上沿对角线移动,我不知道是什么原因造成的。

如果您可以遍历代码并告诉我问题出在哪里,那将是很好的:

TestTube.js

TestTube.prototype.render = function(){


    this.graphics.clear();

    this.graphics.setStrokeStyle(2,1,1);
    //set stroke color black.
    this.graphics.beginStroke("#000000");
    //set fill color 
    this.graphics.beginFill(this.color);


    //START DRAWING------------------------------------

    //move to origin.
    this.graphics.moveTo(this.x,this.y);

    //draw line down to point of liquid in test tube [liquid start point]

    _level = (100 - this.level)/100;
    this.graphics.lineTo(this.x,this.y+_level*this.height);

    //draw line uptil bottom of test tube.
    this.graphics.lineTo(this.x,this.y+(this.height-this.width/2));

    //draw the round part of test tube.
    //graphics.arc(centerX,centerY,radius,startAngle,endAngle,anticlockwise);
    this.graphics.arc(this.x + this.width/2,this.y+(this.height-this.width/2),this.width/2,Math.PI,0,true);

    //go back to upto level of liquid in tube [liquid end point]
    this.graphics.lineTo(this.x+this.width,this.y+_level*this.height);

    //connect liquid start point with liquid end point to fill in liquid colour.
    this.graphics.lineTo(this.x,this.y+_level*this.height);
    this.graphics.endFill();

    //go back to liquid end point
    this.graphics.moveTo(this.x+this.width,this.y+_level*this.height);

    //draw the rest of the test tube.
    this.graphics.lineTo(this.x+this.width,this.y);

    //stop drawing.
    this.graphics.endStroke();

}

index.js

chemical.addEventListener('click',function(e){
            e.target.level--;
            e.target.render();
            solution.level++;
            solution.render();
            stage.update();
        });
多美

这是因为您首先移至(x,y):

this.graphics.moveTo(this.x,this.y);

然后再次将(x,y)添加到您的绘图调用中:

 this.graphics.lineTo(this.x,this.y+(this.height-this.width/2)); // etc

您只想添加一次(x,y)。

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

硬盘神秘地移动文件夹

来自分类Dev

向后滑动太快时,UIButton的标题会神秘地消失

来自分类Dev

timerfd 在 read() 时神秘地将 int 设置为 0

来自分类Dev

乌龟形状的图像处理后,Python乌龟印章神秘地消失了

来自分类Dev

缩放时传单形状会移动

来自分类Dev

用户滑动时的矩形形状移动

来自分类Dev

fork() 神秘地包含

来自分类Dev

移动形状时如何让线或路径跟随形状

来自分类Dev

使形状出现并在单击时消失

来自分类Dev

单击内部区域时删除形状

来自分类Dev

使用CreateJS移除点击形状

来自分类Dev

如何防止单击时按钮移动?

来自分类Dev

引导选项卡在单击时移动

来自分类Dev

单击<a href=> </a>时,防止屏幕移动

来自分类Dev

如何防止单击时按钮移动?

来自分类Dev

如何在单击时垂直移动div

来自分类Dev

单击thead时停止移动文本

来自分类Dev

单击箭头图像时仅移动图像

来自分类Dev

单击时不会显示移动导航栏

来自分类Dev

移动iOS后单击时按钮消失

来自分类Dev

财产神秘地设为零

来自分类Dev

JSON文档神秘地“清空”

来自分类Dev

JPA @ElementCollection神秘地缓存

来自分类Dev

clearInterval 函数神秘地工作

来自分类Dev

X刻度转换为log10时,Y轴的密度刻度神秘地改变

来自分类Dev

Xfce4登录时神秘地启动文件浏览器

来自分类Dev

C-使用char数组时,fgets神秘地导致段错误

来自分类Dev

OpenGL- C ++,使用鼠标单击将形状移动到单击位置

来自分类Dev

OpenGL- C ++,使用鼠标单击将形状移动到单击位置