Search code examples
javascriptsvgfirebug

Drawing a rectangle with dashed lines using Rafael.js

I am using Rafael.js to draw rectangles on an image. My problem with setting the stroke color is that the background may be dark or light or any color. I thought that the best way to deal with that would be using dashed lines. However this call

circle = Canvas.paper.rect(left, topCoord, width, height).attr({stroke-dasharray:"---"});

does not work. Firebug (on FireFox 20.0) returns an error message saying that an existing function in my .js file does not exist. It appears that stroke-dasharray is not valid for rectangles.

Solution

  • Basic JavaScript error:

    {stroke-dasharray:"---"}

    Should be:

    {"stroke-dasharray":"---"}

    Also: "---" isn't a supported value for stroke-dasharray; it should be:

    {"stroke-dasharray":"--"}