Replicate class breaks for polyline layer

278
1
Jump to solution
03-06-2023 02:30 PM
julian_svcs
Occasional Contributor

I have a polyline feature layer and I would like to represent this layer using the equivalent of Standard Deviation in ArcGIS Pro.

julian_svcs_0-1678141593569.png

 

I tried using class breaks as the renderer but this does not seem to work for line features. 

Is there a way I can replicate this symbology in my JSAPI code?

Thanks very much for any assistance.

0 Kudos
1 Solution

Accepted Solutions
julian_svcs
Occasional Contributor

I was able to do this using the visualVariables property in a SimpleRenderer (I even threw in an offset for the lines):

var linkRenderer = new SimpleRenderer({
  symbol: {
    type: "cim",
    // CIM Line Symbol
    data: {
      type: "CIMSymbolReference",
      symbol: {
        type: "CIMLineSymbol",
        symbolLayers: [{
          type: "CIMSolidStroke",
          enable: true,
          color: [213,157,30,255],
          effects: [{
            type: "CIMGeometricEffectOffset",
            offset: 3.0,
            method: "Rounded",
            option: "Fast"
          }]
        }]
      }
    }
  }, visualVariables: [
    {
      type: "color",
      valueExpression: "$feature.voltr_"+ comparison_year + " - $feature.voltr_" + reference_year,
      stops: [
        {value: 3000,color: "#ffa500"},
        {value: 1,color: "#ffe3af"},
        {value: 0,color: "white"},
        {value: -1,color: "#e0e9f1"},
        {value: -4400,color: "#4b6791"},
        {value: -9900,color: "#1d1e22"}
      ]
    }
  ]
});

 

View solution in original post

0 Kudos
1 Reply
julian_svcs
Occasional Contributor

I was able to do this using the visualVariables property in a SimpleRenderer (I even threw in an offset for the lines):

var linkRenderer = new SimpleRenderer({
  symbol: {
    type: "cim",
    // CIM Line Symbol
    data: {
      type: "CIMSymbolReference",
      symbol: {
        type: "CIMLineSymbol",
        symbolLayers: [{
          type: "CIMSolidStroke",
          enable: true,
          color: [213,157,30,255],
          effects: [{
            type: "CIMGeometricEffectOffset",
            offset: 3.0,
            method: "Rounded",
            option: "Fast"
          }]
        }]
      }
    }
  }, visualVariables: [
    {
      type: "color",
      valueExpression: "$feature.voltr_"+ comparison_year + " - $feature.voltr_" + reference_year,
      stops: [
        {value: 3000,color: "#ffa500"},
        {value: 1,color: "#ffe3af"},
        {value: 0,color: "white"},
        {value: -1,color: "#e0e9f1"},
        {value: -4400,color: "#4b6791"},
        {value: -9900,color: "#1d1e22"}
      ]
    }
  ]
});

 

0 Kudos