Select to view content in your preferred language

The size attribute on SimpleMarkerSymbol is not working

2154
4
Jump to solution
01-12-2017 07:05 AM
SethPatrich2
Deactivated User

I am setting the size on a SimpleMarkerSymbol using the 4.2 JavaScript API, but it is not having any effect on the resulting symbols.  I have been assigning the value according to these examples.

In this case, I'm getting the shape of the symbol from an SVG string.

 

Here is a sample app to replicate the issue:

<!DOCTYPE html>
<html>
<head>
 <title>Resize SimpleMarkerSymbols</title>
 <style>
 html,
 body,
 #viewDiv {
 padding: 0;
 margin: 0;
 height: 100%;
 width: 100%;
 }
 </style>

 <link rel="stylesheet" href="https://js.arcgis.com/4.2/esri/css/main.css">
 <script src="https://js.arcgis.com/4.2/"></script>

 <script>
 require([
 "esri/Map",
 "esri/views/MapView",
 "esri/symbols/SimpleMarkerSymbol",
 "esri/geometry/Point",
 "esri/Graphic",
 "dojo/domReady!"
 ], function (Map, MapView, SimpleMarkerSymbol, Point, Graphic) {

 var map = new Map({
 basemap: 'hybrid'
 });

 var view = new MapView({
 center: [-84.3852995, 33.7678835],
 container: "viewDiv",
 map: map,
 zoom: 13

 });

 //Create SVG Icon
 var iconPath = "M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2z";

 var markerSymbol = new SimpleMarkerSymbol(
 {
 path: iconPath,
 size: "50px",
 color: "#3F51B5",
 outline: {
 color: [255, 255, 255],
 width: 1
 }
 }
 );

 var point = new Point({
 longitude: -84.3852995,
 latitude: 33.7678835
 });

 var pointGraphic = new Graphic({
 geometry: point,
 symbol: markerSymbol
 });

 view.graphics.add(pointGraphic);

 });
 </script>
</head>

<body>
 <div id="viewDiv"></div>
</body>
</html>
0 Kudos
1 Solution

Accepted Solutions
RobertScheitlin__GISP
MVP Emeritus

Seth,

   This seems to be a bug in 4.2 as your code works fine in 4.1. You should call esri tech support and report this issue.

View solution in original post

4 Replies
TimWitt2
MVP Alum

The size property does work, but I think SVG items have a set size that can't be changed within your SimpleMarkerSymobols.

0 Kudos
SethPatrich2
Deactivated User

It can according to the Esri sample (this one is on v3.19, so it may only be affecting v4.2):

ArcGIS API for JavaScript Sandbox 

You can add this line within the createSymbol method:


markerSymbol.size = "48px";

and it will adjust the size of the SVG graphics.

TimWitt2
MVP Alum

I see, so it is wonky with SVGs.

RobertScheitlin__GISP
MVP Emeritus

Seth,

   This seems to be a bug in 4.2 as your code works fine in 4.1. You should call esri tech support and report this issue.