RetroSearch Browse

Home - News ( United States | United Kingdom | Italy | Germany ) - Football scores

Showing content from https://developers.arcgis.com/javascript/3/jsapi/simplemarkersymbol-amd.html below:

SimpleMarkerSymbol | API Reference | ArcGIS API for JavaScript 3.46

require(["esri/symbols/SimpleMarkerSymbol"], function(SimpleMarkerSymbol) { /* code goes here */ });

Description

(Added at v1.0)

Marker symbols are used to draw points and multipoints on the graphics layer. SimpleMarkerSymbol is used to display points as a simple shape, for example, a circle. In addition, the symbol can have an optional outline, which is defined by a line symbol.

The color property does not apply to marker symbols defined with the cross or x style. Since these styles are wholly comprised of outlines, you must set the color of symbols with those styles via the setOutline() method.

Explore the SimpleMarkerSymbol in the

ArcGIS Symbol Playground

. This is a place to explore and learn how to work with various properties and methods before implementing it into custom code. Try out new features, customize them, and copy the generated code into your own application. This sample provides a starting point so as to allow use of these features as quickly as possible.

Samples

Search for

samples

that use this class.

Class hierarchy

esri/symbols/Symbol
|_esri/symbols/MarkerSymbol
  |_esri/symbols/SimpleMarkerSymbol

Constructors Constants STYLE_CIRCLE The marker is a circle. STYLE_CROSS The marker is a cross. STYLE_DIAMOND The marker is a diamond. STYLE_PATH The marker is a shape defined using an SVG Path string. See also the setPath method. STYLE_SQUARE The marker is a square. STYLE_TRIANGLE The marker is a triangle. STYLE_X The marker is a diagonal cross. Properties Methods

Constructor Details

Creates a new empty SimpleMarkerSymbol object.

Sample:

require([
  "esri/symbols/SimpleMarkerSymbol", ... 
], function(SimpleMarkerSymbol, ... ) {
  var sms = new SimpleMarkerSymbol();
  ...
});

Creates a new SimpleMarkerSymbol object with parameters.

Sample:

require([
  "esri/symbols/SimpleMarkerSymbol", "esri/symbols/SimpleLineSymbol", "esri/Color", ... 
], function(SimpleMarkerSymbol, SimpleLineSymbol, Color, ... ) {
  new SimpleMarkerSymbol(SimpleMarkerSymbol.STYLE_SQUARE, 10,
    new SimpleLineSymbol(SimpleLineSymbol.STYLE_SOLID,
    new Color([255,0,0]), 1),
    new Color([0,255,0,0.25]));
  ...
});

Creates a new SimpleMarkerSymbol object using a JSON object.

When you create a MarkerSymbol, SimpleMarkerSymbol or PictureMarkerSymbol from a JSON object, you may specify a property angle to rotate the symbol. Be aware that the angle in the JSON is different from MarkerSymbol.angle. The angle in the JSON follows the traditional ArcGIS specification and is rotated counter-clockwise, whereas the angle in the symbol is rotated clockwise.

For example, the following code with angle=-30 in the JSON will create a symbol rotated -30 degrees counter-clockwise; that is, 30 degrees clockwise, which symbol.angle=30 would also produce.

var symbol = new SimpleMarkerSymbol({
  "color": [255,255,255,64],
  "size": 12,
  "angle": -30,
  "xoffset": 0,
  "yoffset": 0,
  "type": "esriSMS",
  "style": "esriSMSCircle",
  "outline": {
    "color": [0,0,0,255],
    "width": 1,
    "type": "esriSLS",
    "style": "esriSLSSolid"
  }
});

Parameters: <Object> json Required JSON object representing the SimpleMarkerSymbol. View the Symbol Objects (Common data types in ArcGIS) for details on creating a JSON symbol. Note that when specifying symbol width and height using JSON the values should be entered in points, the JavaScript API then converts the point values to pixels.

Property Details

The angle of the marker.

Default value: 0

Size of the marker in pixels. The default value is 16 pixels. For marker symbols defined using SVG paths use "auto" to render the SVG path at its original size. (Added at v3.7)

The marker style. See the Constants table for valid values.

Default value: STYLE_CIRCLE

The type of symbol.

The offset on the x-axis in pixels.

Default value: 0

The offset on the y-axis in pixels.

Default value: 0

Method Details

Rotates the symbol clockwise around its center by the specified angle.

Parameters: <Number> angle Required The angle value. 0 is pointing right and values progress clockwise.

Sets the symbol color.

Parameters: <Color> color Required Symbol color. Sample:

require([
  "esri/Color", ... 
], function(Color, ... ) {
  symbol.setColor(new Color([255,255,0,0.5]));
  ...
});

Sets the x and y offset of a marker in screen units.

Parameters: <Number> x Required The X offset value in pixels. <Number> y Required The Y offset value in pixels.

Sets the outline of the marker symbol. The color property of the SimpleLineSymbol directly modifies the overall color of marker symbols defined with the cross or x style.

Sets the marker shape to the given path string and switches the marker style to STYLE_PATH. (Added at v3.4)

Parameters: <String> path Required SVG path of the icon.

Sets the size of a marker in pixels.

Parameters: <Number> size Required The width of the symbol in pixels. Sample:

          var markerSymbol = new SimpleMarkerSymbol();
          markerSymbol.setPath(path);
       
          markerSymbol.setColor(new Color(color));
          markerSymbol.setOutline(null);
          markerSymbol.setSize("32");

Sets the marker symbol style.

Parameters: <String> style Required Marker style. See the Constants table for valid values.

Converts object to its ArcGIS Server JSON representation.

Be aware that the angle in the JSON is different from MarkerSymbol.angle. The angle in the JSON follows the traditional ArcGIS specification and is rotated counter-clockwise, whereas the angle in the symbol is rotated clockwise. For example, if your MarkerSymbol has angle=30 (clockwise), this method will return a JSON object where angle=-30 (counter-clockwise):

{
  "color": [255,255,255,64],
  "size": 12,
  "angle": -30,
  "xoffset": 0,
  "yoffset": 0,
  "type": "esriSMS",
  "style": "esriSMSCross",
  "outline": {"color":[0,0,0,255],"width":1,"type":"esriSLS","style":"esriSLSSolid"}
}

RetroSearch is an open source project built by @garambo | Open a GitHub Issue

Search and Browse the WWW like it's 1997 | Search results from DuckDuckGo

HTML: 3.2 | Encoding: UTF-8 | Version: 0.7.4