相关疑难解决方法(0)

使用鼠标事件在HTML5画布上绘制圆/椭圆

我想在画布上画椭圆选项,以便在画布上绘画.我已经部分实现了这一点.问题是我无法获得圆的半径,目前我已将其硬编码为15.此外,我想绘制椭圆(与油漆相同)不是精确的圆.这是我使用鼠标事件在画布上绘制圆圈的代码.请帮助我使用代码来实现我上面提到的要求.

 function tool_circle() {
        var tool = this;
        this.started = false;

        this.mousedown = function (ev) {
            tool.started = true;
            tool.x0 = ev._x;
            tool.y0 = ev._y;
        };

        this.mousemove = function (ev) {
            if (!tool.started) {
                return;
            }

            context.fillStyle = 'red';

            var distance = Math.sqrt(Math.pow(tool.x0 - ev._x, 2) + Math.pow(tool.y0 - ev._y));
            context.beginPath();

            context.arc(tool.x0, tool.y0,15, 0, Math.PI * 2, false);
            context.stroke();
            context.fill();
        };

        this.mouseup = function (ev) {
            if (tool.started) {
                tool.mousemove(ev);
                tool.started = false;
                img_update();
            }
        };
    }
Run Code Online (Sandbox Code Playgroud)

javascript canvas

2
推荐指数
1
解决办法
1万
查看次数

标签 统计

canvas ×1

javascript ×1