当我单击粗画笔按钮时，如何使用 javascript 在 html 中删除画布中的线宽

Question

我想在单击粗画笔按钮时删除线宽，但它不起作用，根据您单击的按钮，此绘制条件中有不同的条件，我正在删除擦除画布中的模糊和阴影颜色，但它不起作用。我正在根据按钮更改绘图设计。我正在根据按钮更改绘图设计

        var spray = false;

        var glowwrite = false;

        var eraseCnavas = false;

        var newLineWidth;

        var newColor = 'black';

        thickbrush.addEventListener('click', function () {

            spray = true;

            eraseCnavas = false;

            glowwrite = false;

        });

        glow.addEventListener('click', function () {

            spray = false;

            eraseCnavas = false;

            glowwrite = true;

            erase.classList.remove('glowbrush');

        })

        erase.addEventListener('click', function () {

            eraseCnavas = true;

            spray = false;

            eraseCnavas = false;

            brushname.innerHTML = 'Eraser';

        })

        var clientX, clientY, timeout;

        function draw(e) {

            if (painting) {

                previous = {

                    x: mouse.x,

                    y: mouse.y

                };

                mouse = oMousePos(canvas, e);

                // saving the points in the points array

                points.push({

                    x: mouse.x,

                    y: mouse.y,

                    color: newColor,

                    lineWidth: newLineWidth

                })

                console.log('pushing to pints length = ' + points.length);

                if (eraseCnavas) {

                    c.strokeStyle = '#ffffff';

                    c.shadowBlur = 0;

                    c.shadowColor = none;

                }

                if (glowwrite) {

                    c.shadowBlur = 10;

                    c.shadowColor = 'rgb(0, 0, 0)';

                }

                if (spray) {

                    c.lineCap = 'round';

                    newColor = 'none';

                    newLineWidth= 0;

                    timeout = setTimeout(spraying, 50);

                }

我想当你点击喷雾按钮时，应该被移除，只有喷雾会显示，当你点击擦除时，它应该从线条本身移除阴影颜色和阴影模糊我正在移除但它不起作用

Answer 1

你在款式组合成一个终端效应（尝试spray，glow，erase，等），导致您所遇到的问题。你的伪代码是这样说的：如果 eraseCnavas是true 那么改变风格和如果 glowwrite是true，那么更改样式（可能会取消擦除任何内容的能力）和如果 spray是true 那么更改样式（删除擦除能力，但永远不会删除glow）画一个喷雾图案最后，在所有情况下用这些样式绘制线条（为什么不管工具如何绘制线条）通常，选择一个工具会产生一个switch声明或一个if/else if/else结构，以确保使用正确的工具。我建议您重构您的draw()函数，使其：无论是画线 或画一个发光的线 或喷洒一行而不是试图将效果结合起来以获得正确的结果。