SimpleLineSymbol
require(["esri/symbols/SimpleLineSymbol"], function(SimpleLineSymbol) { /* code goes here */ });esri/symbols/SimpleLineSymbolSimpleLineSymbol is used for rendering 2D polyline geometries in a 2D MapView. SimpleLineSymbol is also used for rendering outlines for marker symbols and fill symbols.
SimpleLineSymbol may also be used to symbolize 2D polyline features in a SceneView. However, it is recommended you use LineSymbol3D instead.
The image below depicts a FeatureLayer whose graphics are styled with SimpleLineSymbols.
- See also:
// this symbol can be used to visualize polyline
// features or the outline of a fill symbol
var symbol = {
type: "simple-line", // autocasts as new SimpleLineSymbol()
color: "lightblue",
width: "2px",
style: "short-dot"
};Constructors
- new SimpleLineSymbol(properties)
- Parameter:properties Objectoptional
See the properties for a list of all the properties that may be passed into the constructor.
Property Overview
| Name | Type | Summary | Class | |
|---|---|---|---|---|
| String | Specifies the cap style. more details | more details | SimpleLineSymbol | |
| Color | The color of the symbol. more details | more details | Symbol | |
| String | The name of the class. more details | more details | Accessor | |
| String | Specifies the join style. more details | more details | SimpleLineSymbol | |
| LineSymbolMarker | Specifies the color, style, and placement of a symbol marker on the line. more details | more details | SimpleLineSymbol | |
| Number | Maximum allowed ratio of the width of a miter join to the line width. more details | more details | SimpleLineSymbol | |
| String | Specifies the line style. more details | more details | SimpleLineSymbol | |
| String | The symbol type. more details | more details | SimpleLineSymbol | |
| Number | The width of the symbol in points. more details | more details | LineSymbol |
Property Details
- cap String
Specifies the cap style. The cap is the end node of a polyline, or the end of a line segment that does not connect with another segment of the same polyline.
See the table below for possible values.
Possible Value Example butt 
round 
square 
Known Limitations
- This property does not persist when applied to a symbol used in a layer saved to a web map or portal item. See the web map specification for more details about properties that persist when a SimpleLineSymbol is saved to an ArcGIS Online or Portal item.
Possible Values:"butt"|"round"|"square"
- Default Value:round
Example:symbol.cap = "square";
The color of the symbol. This can be autocast with an array of rgb(a) values, named string, hex string or an hsl(a) string, an object with
r,g,b, andaproperties, or a Color object.- Default Value:black
Examples:// CSS color string symbol.color = "dodgerblue";// HEX string symbol.color = "#33cc33";// array of RGBA values symbol.color = [51, 204, 51, 0.3];// object with rgba properties symbol.color = { r: 51, g: 51, b: 204, a: 0.7 };
- Since: ArcGIS API for JavaScript 4.7
The name of the class. The declared class name is formatted as
esri.folder.className.
- join String
Specifies the join style. A
joinrefers to the joint of a polyline, or the end of a line segment that connects to another segment of the same polyline. See the table below for possible values.Possible Value Example bevel 
miter 
round 
Possible Values:"miter"|"round"|"bevel"
- Default Value:round
Example:symbol.join = "bevel";
- marker LineSymbolMarkerautocastSince: ArcGIS API for JavaScript 4.16
Specifies the color, style, and placement of a symbol marker on the line.
Known Limitations
- This is not currently supported within a 3D SceneView.
Example:// Places a blue diamond marker at the beginning of the line symbol simpleLineSymbol.marker = { color: "blue", placement: "begin", style: "diamond" }
- miterLimit Number
Maximum allowed ratio of the width of a miter join to the line width. Miter joins can get very wide at sharp line angles; this can be visually unpleasant or interfere with cartography. In the example below, the width of the miter join is about 3.6 times the width of the line.

A miter limit of
Xmeans that a miter join can be at mostXtimes as wide as the line itself. Beyond that threshold, it is replaced with a bevel join. Referring to the previous example, setting the miter limit to 3.6 or greater has no effect on the generated visuals; setting the miter limit to 3.5 or smaller causes the replacement with a bevel join.
Known Limitations
This property is currently not supported in 3D SceneViews.
- Default Value:2
Example:// Miter joins that would be twice as wide as the line itself are // replaced by bevel joins. symbol.miterLimit = 2;
- style String
Specifies the line style. Possible values are listed in the table below:
Value Description dash 
dash-dot 
dot 
long-dash 
long-dash-dot 
long-dash-dot-dot 
none The line has no symbol. short-dash 
short-dash-dot 
short-dash-dot-dot 
short-dot 
solid 
Known Limitations
This property is currently not supported in 3D SceneViews.
Possible Values:"dash"|"dash-dot"|"dot"|"long-dash"|"long-dash-dot"|"long-dash-dot-dot"|"none"|"short-dash"|"short-dash-dot"|"short-dash-dot-dot"|"short-dot"|"solid"
- Default Value:solid
Example:symbol.style = "short-dash-dot";
- type Stringreadonly
The symbol type.
For SimpleLineSymbol the type is always "simple-line".
The width of the symbol in points. This value may be autocast with a string expressing size in points or pixels (e.g.
12px).- Default Value:0.75
Examples:// width in points symbol.width = 4;// width in pixels symbol.width = "2px";// width in points symbol.width = "4pt";
Method Overview
| Name | Return Type | Summary | Class | |
|---|---|---|---|---|
| SimpleLineSymbol | Creates a deep clone of the symbol. more details | more details | SimpleLineSymbol | |
| * | Creates a new instance of this class and initializes it with values from a JSON object generated from a product in the ArcGIS platform. more details | more details | Symbol | |
| Object | Converts an instance of this class to its ArcGIS portal JSON representation. more details | more details | Symbol |
Method Details
- clone(){SimpleLineSymbol}
Creates a deep clone of the symbol.
Returns:Type Description SimpleLineSymbol A deep clone of the object that invoked this method. Example:// Creates a deep clone of the graphic's symbol var symLyr = graphic.symbol.clone();
- fromJSON(json){*}static
Creates a new instance of this class and initializes it with values from a JSON object generated from a product in the ArcGIS platform. The object passed into the input
jsonparameter often comes from a response to a query operation in the REST API or a toJSON() method from another ArcGIS product. See the Using fromJSON() topic in the Guide for details and examples of when and how to use this function.Parameter:json ObjectA JSON representation of the instance in the ArcGIS format. See the ArcGIS REST API documentation for examples of the structure of various input JSON objects.
Returns:Type Description * Returns a new instance of this class.
Converts an instance of this class to its ArcGIS portal JSON representation. See the Using fromJSON() guide topic for more information.
Returns:Type Description Object The ArcGIS portal JSON representation of an instance of this class.
