Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

JS error when calling 'cancel', 'stop' or 'clean' on a polygon with no point #55

Open
fterrani opened this issue Dec 1, 2019 · 0 comments

Comments

@fterrani
Copy link

fterrani commented Dec 1, 2019

I encountered this problem while using svg.draw.js 2.0.3 in a project several months ago. I quickly checked the commits up to 2.0.4 but I think the problem might still exist, in lineable.js. I was showing different tools to the user allowing to draw polygons. Switching from one tool to another required to abort the started drawing operation, potentially when no point was drawn yet.

svg.draw.js allows to use these methods:

  • polygon.draw('cancel') calls stop, then removes the polygon
  • polygon.draw('stop') calls clean then removes listeners
  • polygon.draw('clean') removes the circles above polygon points

The problem is that if the polygon being drawn still has no point in the SVG.js model, calling polygon.draw('clean') (or stop or cancel) will trigger an error in lineable.js's clean method because it tries to empty/clear this.set, a property containing the circles drawn above points that doesn't exist if init wasn't called yet.

The same bug exists potentially in lineable.js's drawCircles method.

Due to time and project workflow constraints, I wrote the following code as a patch so that element.draw('cancel') and element.draw('drawCircles') behave properly for the following SVG.js elements: line, polyline, polygon. I'm providing it here as an indication to help with bugfixing (definitely not as a pull request, I unfortunately don't have time to write a decent one):

(function()
{
    var elements = ['line','polyline','polygon'];
    elements.forEach(function(elementName)
    {
        var methods = ['clean', 'drawCircles'];
        methods.forEach(function(methodName)
        {
            var originalFunc = SVG.Element.prototype.draw.plugins[elementName][methodName];
            SVG.Element.prototype.draw.plugins[elementName][methodName] = function()
            {
                if (this.set)
                    originalFunc.call(this, arguments);
            };
        });
    });
})();
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant