AnsweredAssumed Answered

SimpleMarkerSymbol SVG Javascript Error

Question asked by ConroyByron on Apr 14, 2016
Latest reply on Apr 18, 2016 by rscheitlin

Hi, I am having trouble creating a SimpleMarkerSymbol based on an SVG shape string.

 

This is the code I am using to create my SimpleMarkerSymbol, (the actual path was copied directly from https://www.w3.org/TR/SVG/paths.html#PathElement which the API documentation pointed me towards):

 

    var symbol = null;

    require([

            "esri/Color",

            "esri/symbols/SimpleLineSymbol",

            "esri/symbols/SimpleMarkerSymbol"

        ],

        function(Color, SimpleLineSymbol, SimpleMarkerSymbol){

            var line = new SimpleLineSymbol();

            line.setColor(new Color([230, 0, 0, 1]));

            line.setWidth(2);

            symbol = new SimpleMarkerSymbol();

            symbol.setPath("M 100 100 L 300 100 L 200 300 z");

            symbol.setOutline(line);

            symbol.setColor(new Color([255, 0, 0, 0.50]));

        }

    );

    return symbol;

 

 

However after the symbol is turned into a graphic and added to the map the symbol is drawn incorrectly or not at all.

I also get the following error in the Chrome Console:

svg.js:55 Error: Invalid value for <path> attribute transform = "matrix(0.00001396,0.08000000,-0.08000000,0.00001396,NaN,NaN)"

 

I have changed the Symbol style to to one of the standard shapes (STYLE_DIAMOND) and everything works correctly.

 

 

Is this a known problem or have I done something wrong?

 

 

Extra information:

Google Chrome Version Version 50.0.2661.75 m

Error occurs in version 3.15 and 3.16 of the Javascript API, have not tried other verisons.

Outcomes