nav[aria-label="Primary Navigation"] { padding: 0; & ul { list-style: none; width: 100%; display: flex; flex-direction: row; justify-content: start; align-items: start; gap: 30px; padding: 0; & li { margin: 0; } & ul li { list-style: none; } } }

Using a Local .png File For a PictureMarkerSymbol

MichaelCollinsGIS

Hi All:

I am making a map and would like to use a picturemarkersymbol with a local png to symbolize a mapimagelayer's sublayer. I have tried what is in the documentation to the tune of:

renderer: {
   type: "simple",
   symbol: {
      type: "picture-marker",
      url: 'img/busStop.png',
      width: 22,
      height: 22
   }
}

Now, if I put a png from another source in there (say from a google image search), it will show up on the map fine. This way, not so much. Could somebody lead me in the right direction?

Thanks!

タグ付きの投稿をもっと見る

Accepted answers

RobertScheitlin__GISP

Michael,

OK I have verified that there seems to be a bug where locally hosted images do not work. This is something you will have to report to esri tech support. Here is a sample that demos the issue. The Picturemarker symbol works if you have a directory called images and a image named search-pointer.png as it will work when adding it to the view as a graphic but will not work if used as a sublayers renderer symbol:

<SPAN class="operator token"><</SPAN><SPAN class="operator token">!</SPAN>DOCTYPE html<SPAN class="operator token">></SPAN>
<SPAN class="operator token"><</SPAN>html<SPAN class="operator token">></SPAN>

<SPAN class="operator token"><</SPAN>head<SPAN class="operator token">></SPAN>
  <SPAN class="operator token"><</SPAN>meta charset<SPAN class="operator token">=</SPAN><SPAN class="string token">"utf-8"</SPAN> <SPAN class="operator token">/</SPAN><SPAN class="operator token">></SPAN>
  <SPAN class="operator token"><</SPAN>meta name<SPAN class="operator token">=</SPAN><SPAN class="string token">"viewport"</SPAN> content<SPAN class="operator token">=</SPAN><SPAN class="string token">"initial-scale=1,maximum-scale=1,user-scalable=no"</SPAN> <SPAN class="operator token">/</SPAN><SPAN class="operator token">></SPAN>
  <SPAN class="operator token"><</SPAN>title<SPAN class="operator token">></SPAN>MapImageLayer <SPAN class="operator token">-</SPAN> Toggle sublayer visibility <SPAN class="operator token">-</SPAN> <SPAN class="number token">4.11</SPAN><SPAN class="operator token"><</SPAN><SPAN class="operator token">/</SPAN>title<SPAN class="operator token">></SPAN>

  <SPAN class="operator token"><</SPAN>link rel<SPAN class="operator token">=</SPAN><SPAN class="string token">"stylesheet"</SPAN> href<SPAN class="operator token">=</SPAN><SPAN class="string token">"http://js.arcgis.com/4.11/esri/themes/light/main.css"</SPAN> <SPAN class="operator token">/</SPAN><SPAN class="operator token">></SPAN>
  <SPAN class="operator token"><</SPAN>script src<SPAN class="operator token">=</SPAN><SPAN class="string token">"http://js.arcgis.com/4.11/"</SPAN><SPAN class="operator token">></SPAN><SPAN class="operator token"><</SPAN><SPAN class="operator token">/</SPAN>script<SPAN class="operator token">></SPAN>

  <SPAN class="operator token"><</SPAN>script<SPAN class="operator token">></SPAN>
    <SPAN class="token function">require</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">[</SPAN>
      <SPAN class="string token">"esri/Map"</SPAN><SPAN class="punctuation token">,</SPAN>
      <SPAN class="string token">"esri/views/MapView"</SPAN><SPAN class="punctuation token">,</SPAN>
      <SPAN class="string token">"esri/layers/MapImageLayer"</SPAN><SPAN class="punctuation token">,</SPAN>
      <SPAN class="string token">"esri/symbols/PictureMarkerSymbol"</SPAN><SPAN class="punctuation token">,</SPAN>
      <SPAN class="string token">"esri/Graphic"</SPAN>
    <SPAN class="punctuation token">]</SPAN><SPAN class="punctuation token">,</SPAN> <SPAN class="keyword token">function</SPAN> <SPAN class="punctuation token">(</SPAN>Map<SPAN class="punctuation token">,</SPAN> MapView<SPAN class="punctuation token">,</SPAN> MapImageLayer<SPAN class="punctuation token">,</SPAN> PictureMarkerSymbol<SPAN class="punctuation token">,</SPAN> Graphic<SPAN class="punctuation token">)</SPAN> <SPAN class="punctuation token">{</SPAN>
      <SPAN class="comment token">/*****************************************************************
       * Create a renderer for the dynamic data layer (table).
       *****************************************************************/</SPAN>

      <SPAN class="keyword token">var</SPAN> renderer <SPAN class="operator token">=</SPAN> <SPAN class="punctuation token">{</SPAN>
        type<SPAN class="punctuation token">:</SPAN> <SPAN class="string token">"simple"</SPAN><SPAN class="punctuation token">,</SPAN> <SPAN class="comment token">// autocasts as new SimpleRenderer()</SPAN>
        symbol<SPAN class="punctuation token">:</SPAN> <SPAN class="punctuation token">{</SPAN>
          type<SPAN class="punctuation token">:</SPAN> <SPAN class="string token">"simple-line"</SPAN><SPAN class="punctuation token">,</SPAN> <SPAN class="comment token">// autocasts as new SimpleLineSymbol()</SPAN>
          color<SPAN class="punctuation token">:</SPAN> <SPAN class="punctuation token">[</SPAN><SPAN class="number token">255</SPAN><SPAN class="punctuation token">,</SPAN> <SPAN class="number token">255</SPAN><SPAN class="punctuation token">,</SPAN> <SPAN class="number token">255</SPAN><SPAN class="punctuation token">,</SPAN> <SPAN class="number token">0.5</SPAN><SPAN class="punctuation token">]</SPAN><SPAN class="punctuation token">,</SPAN>
          width<SPAN class="punctuation token">:</SPAN> <SPAN class="number token">0.75</SPAN><SPAN class="punctuation token">,</SPAN>
          style<SPAN class="punctuation token">:</SPAN> <SPAN class="string token">"long-dash-dot-dot"</SPAN>
        <SPAN class="punctuation token">}</SPAN>
      <SPAN class="punctuation token">}</SPAN><SPAN class="punctuation token">;</SPAN>

      <SPAN class="keyword token">var</SPAN> pms <SPAN class="operator token">=</SPAN> <SPAN class="keyword token">new</SPAN> <SPAN class="token class-name">PictureMarkerSymbol</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">{</SPAN>
        url<SPAN class="punctuation token">:</SPAN> <SPAN class="string token">'images/search-pointer.png'</SPAN><SPAN class="punctuation token">,</SPAN> <SPAN class="comment token">//this does not for a sublayer symbol</SPAN>
        <SPAN class="comment token">//url: 'https://js.arcgis.com/3.28/esri/dijit/Search/images/search-pointer.png', //this works</SPAN>
        width<SPAN class="punctuation token">:</SPAN> <SPAN class="string token">"22px"</SPAN><SPAN class="punctuation token">,</SPAN>
        height<SPAN class="punctuation token">:</SPAN> <SPAN class="string token">"22px"</SPAN>
      <SPAN class="punctuation token">}</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>

      <SPAN class="comment token">/*****************************************************************
       * Create a MapImageLayer instance pointing to a Map Service
       * containing data about US Cities, Counties, States and Highways.
       * Define sublayers with visibility for each layer in Map Service.
       *****************************************************************/</SPAN>
      <SPAN class="keyword token">var</SPAN> layer <SPAN class="operator token">=</SPAN> <SPAN class="keyword token">new</SPAN> <SPAN class="token class-name">MapImageLayer</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">{</SPAN>
        url<SPAN class="punctuation token">:</SPAN> <SPAN class="string token">"http://sampleserver6.arcgisonline.com/arcgis/rest/services/USA/MapServer"</SPAN><SPAN class="punctuation token">,</SPAN>
        sublayers<SPAN class="punctuation token">:</SPAN> <SPAN class="punctuation token">[</SPAN><SPAN class="punctuation token">{</SPAN>
            id<SPAN class="punctuation token">:</SPAN> <SPAN class="number token">2</SPAN><SPAN class="punctuation token">,</SPAN>
            visible<SPAN class="punctuation token">:</SPAN> <SPAN class="keyword token">true</SPAN>
          <SPAN class="punctuation token">}</SPAN><SPAN class="punctuation token">,</SPAN>
          <SPAN class="punctuation token">{</SPAN>
            id<SPAN class="punctuation token">:</SPAN> <SPAN class="number token">4</SPAN><SPAN class="punctuation token">,</SPAN>
            visible<SPAN class="punctuation token">:</SPAN> <SPAN class="keyword token">false</SPAN><SPAN class="punctuation token">,</SPAN>
            title<SPAN class="punctuation token">:</SPAN> <SPAN class="string token">"Railroads"</SPAN><SPAN class="punctuation token">,</SPAN>
            renderer<SPAN class="punctuation token">:</SPAN> renderer<SPAN class="punctuation token">,</SPAN>
            source<SPAN class="punctuation token">:</SPAN> <SPAN class="punctuation token">{</SPAN>
              <SPAN class="comment token">// indicates the source of the sublayer is a dynamic data layer</SPAN>
              type<SPAN class="punctuation token">:</SPAN> <SPAN class="string token">"data-layer"</SPAN><SPAN class="punctuation token">,</SPAN>
              <SPAN class="comment token">// this object defines the data source of the layer</SPAN>
              <SPAN class="comment token">// in this case it's a feature class table from a file geodatabase</SPAN>
              dataSource<SPAN class="punctuation token">:</SPAN> <SPAN class="punctuation token">{</SPAN>
                type<SPAN class="punctuation token">:</SPAN> <SPAN class="string token">"table"</SPAN><SPAN class="punctuation token">,</SPAN>
                <SPAN class="comment token">// workspace name</SPAN>
                workspaceId<SPAN class="punctuation token">:</SPAN> <SPAN class="string token">"MyDatabaseWorkspaceIDSSR2"</SPAN><SPAN class="punctuation token">,</SPAN>
                <SPAN class="comment token">// table name</SPAN>
                dataSourceName<SPAN class="punctuation token">:</SPAN> <SPAN class="string token">"ss6.gdb.Railroads"</SPAN>
              <SPAN class="punctuation token">}</SPAN>
            <SPAN class="punctuation token">}</SPAN>
          <SPAN class="punctuation token">}</SPAN><SPAN class="punctuation token">,</SPAN>
          <SPAN class="punctuation token">{</SPAN>
            id<SPAN class="punctuation token">:</SPAN> <SPAN class="number token">1</SPAN><SPAN class="punctuation token">,</SPAN>
            visible<SPAN class="punctuation token">:</SPAN> <SPAN class="keyword token">true</SPAN>
          <SPAN class="punctuation token">}</SPAN><SPAN class="punctuation token">,</SPAN>
          <SPAN class="punctuation token">{</SPAN>
            id<SPAN class="punctuation token">:</SPAN> <SPAN class="number token">0</SPAN><SPAN class="punctuation token">,</SPAN>
            renderer<SPAN class="punctuation token">:</SPAN> <SPAN class="punctuation token">{</SPAN>
              type<SPAN class="punctuation token">:</SPAN> <SPAN class="string token">'simple'</SPAN><SPAN class="punctuation token">,</SPAN>
              symbol<SPAN class="punctuation token">:</SPAN> pms
            <SPAN class="punctuation token">}</SPAN><SPAN class="punctuation token">,</SPAN>
            visible<SPAN class="punctuation token">:</SPAN> <SPAN class="keyword token">true</SPAN>
          <SPAN class="punctuation token">}</SPAN>
        <SPAN class="punctuation token">]</SPAN>
      <SPAN class="punctuation token">}</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>

      <SPAN class="comment token">/*****************************************************************
       * Add the layer to a map
       *****************************************************************/</SPAN>
      <SPAN class="keyword token">var</SPAN> map <SPAN class="operator token">=</SPAN> <SPAN class="keyword token">new</SPAN> <SPAN class="token class-name">Map</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">{</SPAN>
        basemap<SPAN class="punctuation token">:</SPAN> <SPAN class="string token">"dark-gray"</SPAN><SPAN class="punctuation token">,</SPAN>
        layers<SPAN class="punctuation token">:</SPAN> <SPAN class="punctuation token">[</SPAN>layer<SPAN class="punctuation token">]</SPAN>
      <SPAN class="punctuation token">}</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>

      <SPAN class="keyword token">var</SPAN> view <SPAN class="operator token">=</SPAN> <SPAN class="keyword token">new</SPAN> <SPAN class="token class-name">MapView</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">{</SPAN>
        container<SPAN class="punctuation token">:</SPAN> <SPAN class="string token">"viewDiv"</SPAN><SPAN class="punctuation token">,</SPAN>
        map<SPAN class="punctuation token">:</SPAN> map<SPAN class="punctuation token">,</SPAN>
        zoom<SPAN class="punctuation token">:</SPAN> <SPAN class="number token">4</SPAN><SPAN class="punctuation token">,</SPAN>
        center<SPAN class="punctuation token">:</SPAN> <SPAN class="punctuation token">[</SPAN><SPAN class="operator token">-</SPAN><SPAN class="number token">99</SPAN><SPAN class="punctuation token">,</SPAN> <SPAN class="number token">39</SPAN><SPAN class="punctuation token">]</SPAN>
      <SPAN class="punctuation token">}</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>

      view<SPAN class="punctuation token">.</SPAN><SPAN class="token function">when</SPAN><SPAN class="punctuation token">(</SPAN> <SPAN class="keyword token">function</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">{</SPAN>
        <SPAN class="keyword token">var</SPAN> gra <SPAN class="operator token">=</SPAN> <SPAN class="keyword token">new</SPAN> <SPAN class="token class-name">Graphic</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">{</SPAN>
          geometry<SPAN class="punctuation token">:</SPAN> view<SPAN class="punctuation token">.</SPAN>center<SPAN class="punctuation token">,</SPAN>
          symbol<SPAN class="punctuation token">:</SPAN> pms
        <SPAN class="punctuation token">}</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>
        view<SPAN class="punctuation token">.</SPAN>graphics<SPAN class="punctuation token">.</SPAN><SPAN class="token function">add</SPAN><SPAN class="punctuation token">(</SPAN>gra<SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>
      <SPAN class="punctuation token">}</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>

      <SPAN class="comment token">/*****************************************************************
       * Wait for Layer to load and update the page to refelect which
       * layers are visible in the Map Service.
       *****************************************************************/</SPAN>
      layer<SPAN class="punctuation token">.</SPAN><SPAN class="token function">when</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="keyword token">function</SPAN> <SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">)</SPAN> <SPAN class="punctuation token">{</SPAN>
        layer<SPAN class="punctuation token">.</SPAN>sublayers<SPAN class="punctuation token">.</SPAN><SPAN class="token function">map</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="keyword token">function</SPAN> <SPAN class="punctuation token">(</SPAN>sublayer<SPAN class="punctuation token">)</SPAN> <SPAN class="punctuation token">{</SPAN>
          <SPAN class="keyword token">var</SPAN> id <SPAN class="operator token">=</SPAN> sublayer<SPAN class="punctuation token">.</SPAN>id<SPAN class="punctuation token">;</SPAN>
          <SPAN class="keyword token">var</SPAN> visible <SPAN class="operator token">=</SPAN> sublayer<SPAN class="punctuation token">.</SPAN>visible<SPAN class="punctuation token">;</SPAN>
          <SPAN class="keyword token">var</SPAN> node <SPAN class="operator token">=</SPAN> document<SPAN class="punctuation token">.</SPAN><SPAN class="token function">querySelector</SPAN><SPAN class="punctuation token">(</SPAN>
            <SPAN class="string token">".sublayers-item[data-id='"</SPAN> <SPAN class="operator token">+</SPAN> id <SPAN class="operator token">+</SPAN> <SPAN class="string token">"']"</SPAN>
          <SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>
          <SPAN class="keyword token">if</SPAN> <SPAN class="punctuation token">(</SPAN>visible<SPAN class="punctuation token">)</SPAN> <SPAN class="punctuation token">{</SPAN>
            node<SPAN class="punctuation token">.</SPAN>classList<SPAN class="punctuation token">.</SPAN><SPAN class="token function">add</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="string token">"visible-layer"</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>
          <SPAN class="punctuation token">}</SPAN>
        <SPAN class="punctuation token">}</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>
      <SPAN class="punctuation token">}</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>

      <SPAN class="comment token">/*****************************************************************
       * Listen for when buttons on the page have been clicked to turn
       * layers on and off in the Map Service.
       *****************************************************************/</SPAN>
      <SPAN class="keyword token">var</SPAN> sublayersElement <SPAN class="operator token">=</SPAN> document<SPAN class="punctuation token">.</SPAN><SPAN class="token function">querySelector</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="string token">".sublayers"</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>
      sublayersElement<SPAN class="punctuation token">.</SPAN><SPAN class="token function">addEventListener</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="string token">"click"</SPAN><SPAN class="punctuation token">,</SPAN> <SPAN class="keyword token">function</SPAN> <SPAN class="punctuation token">(</SPAN>event<SPAN class="punctuation token">)</SPAN> <SPAN class="punctuation token">{</SPAN>
        <SPAN class="keyword token">var</SPAN> id <SPAN class="operator token">=</SPAN> event<SPAN class="punctuation token">.</SPAN>target<SPAN class="punctuation token">.</SPAN><SPAN class="token function">getAttribute</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="string token">"data-id"</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>
        <SPAN class="keyword token">if</SPAN> <SPAN class="punctuation token">(</SPAN>id<SPAN class="punctuation token">)</SPAN> <SPAN class="punctuation token">{</SPAN>
          <SPAN class="keyword token">var</SPAN> sublayer <SPAN class="operator token">=</SPAN> layer<SPAN class="punctuation token">.</SPAN><SPAN class="token function">findSublayerById</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="token function">parseInt</SPAN><SPAN class="punctuation token">(</SPAN>id<SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>
          <SPAN class="keyword token">var</SPAN> node <SPAN class="operator token">=</SPAN> document<SPAN class="punctuation token">.</SPAN><SPAN class="token function">querySelector</SPAN><SPAN class="punctuation token">(</SPAN>
            <SPAN class="string token">".sublayers-item[data-id='"</SPAN> <SPAN class="operator token">+</SPAN> id <SPAN class="operator token">+</SPAN> <SPAN class="string token">"']"</SPAN>
          <SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>
          sublayer<SPAN class="punctuation token">.</SPAN>visible <SPAN class="operator token">=</SPAN> <SPAN class="operator token">!</SPAN>sublayer<SPAN class="punctuation token">.</SPAN>visible<SPAN class="punctuation token">;</SPAN>
          node<SPAN class="punctuation token">.</SPAN>classList<SPAN class="punctuation token">.</SPAN><SPAN class="token function">toggle</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="string token">"visible-layer"</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>
        <SPAN class="punctuation token">}</SPAN>
      <SPAN class="punctuation token">}</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>
    <SPAN class="punctuation token">}</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>
  <SPAN class="operator token"><</SPAN><SPAN class="operator token">/</SPAN>script<SPAN class="operator token">></SPAN>

  <SPAN class="operator token"><</SPAN>style<SPAN class="operator token">></SPAN>
    html<SPAN class="punctuation token">,</SPAN>
    body <SPAN class="punctuation token">{</SPAN>
      font<SPAN class="operator token">-</SPAN>family<SPAN class="punctuation token">:</SPAN> sans<SPAN class="operator token">-</SPAN>serif<SPAN class="punctuation token">;</SPAN>
      padding<SPAN class="punctuation token">:</SPAN> <SPAN class="number token">0</SPAN><SPAN class="punctuation token">;</SPAN>
      margin<SPAN class="punctuation token">:</SPAN> <SPAN class="number token">0</SPAN><SPAN class="punctuation token">;</SPAN>
      height<SPAN class="punctuation token">:</SPAN> <SPAN class="number token">100</SPAN><SPAN class="operator token">%</SPAN><SPAN class="punctuation token">;</SPAN>
      width<SPAN class="punctuation token">:</SPAN> <SPAN class="number token">100</SPAN><SPAN class="operator token">%</SPAN><SPAN class="punctuation token">;</SPAN>
    <SPAN class="punctuation token">}</SPAN>

    #viewDiv <SPAN class="punctuation token">{</SPAN>
      position<SPAN class="punctuation token">:</SPAN> absolute<SPAN class="punctuation token">;</SPAN>
      right<SPAN class="punctuation token">:</SPAN> <SPAN class="number token">0</SPAN><SPAN class="punctuation token">;</SPAN>
      left<SPAN class="punctuation token">:</SPAN> <SPAN class="number token">0</SPAN><SPAN class="punctuation token">;</SPAN>
      top<SPAN class="punctuation token">:</SPAN> <SPAN class="number token">0</SPAN><SPAN class="punctuation token">;</SPAN>
      bottom<SPAN class="punctuation token">:</SPAN> 60px<SPAN class="punctuation token">;</SPAN>
    <SPAN class="punctuation token">}</SPAN>

    <SPAN class="punctuation token">.</SPAN>footer <SPAN class="punctuation token">{</SPAN>
      position<SPAN class="punctuation token">:</SPAN> absolute<SPAN class="punctuation token">;</SPAN>
      bottom<SPAN class="punctuation token">:</SPAN> <SPAN class="number token">0</SPAN><SPAN class="punctuation token">;</SPAN>
      height<SPAN class="punctuation token">:</SPAN> 60px<SPAN class="punctuation token">;</SPAN>
      width<SPAN class="punctuation token">:</SPAN> <SPAN class="number token">100</SPAN><SPAN class="operator token">%</SPAN><SPAN class="punctuation token">;</SPAN>
    <SPAN class="punctuation token">}</SPAN>

    <SPAN class="punctuation token">.</SPAN>sublayers <SPAN class="punctuation token">{</SPAN>
      margin<SPAN class="punctuation token">:</SPAN> <SPAN class="number token">0</SPAN> auto<SPAN class="punctuation token">;</SPAN>
      display<SPAN class="punctuation token">:</SPAN> flex<SPAN class="punctuation token">;</SPAN>
      flex<SPAN class="operator token">-</SPAN>direction<SPAN class="punctuation token">:</SPAN> row<SPAN class="punctuation token">;</SPAN>
      justify<SPAN class="operator token">-</SPAN>content<SPAN class="punctuation token">:</SPAN> center<SPAN class="punctuation token">;</SPAN>
      align<SPAN class="operator token">-</SPAN>items<SPAN class="punctuation token">:</SPAN> center<SPAN class="punctuation token">;</SPAN>
      overflow<SPAN class="punctuation token">:</SPAN> auto<SPAN class="punctuation token">;</SPAN>
    <SPAN class="punctuation token">}</SPAN>

    <SPAN class="punctuation token">.</SPAN>sublayers<SPAN class="operator token">-</SPAN>item <SPAN class="punctuation token">{</SPAN>
      flex<SPAN class="operator token">-</SPAN>grow<SPAN class="punctuation token">:</SPAN> <SPAN class="number token">4</SPAN><SPAN class="punctuation token">;</SPAN>
      background<SPAN class="operator token">-</SPAN>color<SPAN class="punctuation token">:</SPAN> <SPAN class="token function">rgba</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="number token">34</SPAN><SPAN class="punctuation token">,</SPAN> <SPAN class="number token">111</SPAN><SPAN class="punctuation token">,</SPAN> <SPAN class="number token">14</SPAN><SPAN class="punctuation token">,</SPAN> <SPAN class="number token">0.5</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>
      color<SPAN class="punctuation token">:</SPAN> #fff<SPAN class="punctuation token">;</SPAN>
      margin<SPAN class="punctuation token">:</SPAN> 1px<SPAN class="punctuation token">;</SPAN>
      width<SPAN class="punctuation token">:</SPAN> <SPAN class="number token">50</SPAN><SPAN class="operator token">%</SPAN><SPAN class="punctuation token">;</SPAN>
      padding<SPAN class="punctuation token">:</SPAN> 20px<SPAN class="punctuation token">;</SPAN>
      overflow<SPAN class="punctuation token">:</SPAN> auto<SPAN class="punctuation token">;</SPAN>
      text<SPAN class="operator token">-</SPAN>align<SPAN class="punctuation token">:</SPAN> center<SPAN class="punctuation token">;</SPAN>
      cursor<SPAN class="punctuation token">:</SPAN> pointer<SPAN class="punctuation token">;</SPAN>
      font<SPAN class="operator token">-</SPAN>size<SPAN class="punctuation token">:</SPAN> <SPAN class="number token">0</SPAN><SPAN class="punctuation token">.</SPAN>7em<SPAN class="punctuation token">;</SPAN>
    <SPAN class="punctuation token">}</SPAN>

    <SPAN class="punctuation token">.</SPAN>visible<SPAN class="operator token">-</SPAN>layer <SPAN class="punctuation token">{</SPAN>
      color<SPAN class="punctuation token">:</SPAN> #fff<SPAN class="punctuation token">;</SPAN>
      background<SPAN class="operator token">-</SPAN>color<SPAN class="punctuation token">:</SPAN> #226f0e<SPAN class="punctuation token">;</SPAN>
    <SPAN class="punctuation token">}</SPAN>
  <SPAN class="operator token"><</SPAN><SPAN class="operator token">/</SPAN>style<SPAN class="operator token">></SPAN>
<SPAN class="operator token"><</SPAN><SPAN class="operator token">/</SPAN>head<SPAN class="operator token">></SPAN>

<SPAN class="operator token"><</SPAN>body<SPAN class="operator token">></SPAN>
  <SPAN class="operator token"><</SPAN>div id<SPAN class="operator token">=</SPAN><SPAN class="string token">"viewDiv"</SPAN><SPAN class="operator token">></SPAN><SPAN class="operator token"><</SPAN><SPAN class="operator token">/</SPAN>div<SPAN class="operator token">></SPAN>
  <SPAN class="operator token"><</SPAN>div <SPAN class="keyword token">class</SPAN><SPAN class="operator token">=</SPAN><SPAN class="string token">"footer"</SPAN><SPAN class="operator token">></SPAN>
    <SPAN class="operator token"><</SPAN>div <SPAN class="keyword token">class</SPAN><SPAN class="operator token">=</SPAN><SPAN class="string token">"sublayers"</SPAN><SPAN class="operator token">></SPAN>
      <SPAN class="operator token"><</SPAN>div <SPAN class="keyword token">class</SPAN><SPAN class="operator token">=</SPAN><SPAN class="string token">"sublayers-item"</SPAN> data<SPAN class="operator token">-</SPAN>id<SPAN class="operator token">=</SPAN><SPAN class="string token">"0"</SPAN><SPAN class="operator token">></SPAN>Cities<SPAN class="operator token"><</SPAN><SPAN class="operator token">/</SPAN>div<SPAN class="operator token">></SPAN>
      <SPAN class="operator token"><</SPAN>div <SPAN class="keyword token">class</SPAN><SPAN class="operator token">=</SPAN><SPAN class="string token">"sublayers-item"</SPAN> data<SPAN class="operator token">-</SPAN>id<SPAN class="operator token">=</SPAN><SPAN class="string token">"1"</SPAN><SPAN class="operator token">></SPAN>Highways<SPAN class="operator token"><</SPAN><SPAN class="operator token">/</SPAN>div<SPAN class="operator token">></SPAN>
      <SPAN class="operator token"><</SPAN>div <SPAN class="keyword token">class</SPAN><SPAN class="operator token">=</SPAN><SPAN class="string token">"sublayers-item"</SPAN> data<SPAN class="operator token">-</SPAN>id<SPAN class="operator token">=</SPAN><SPAN class="string token">"4"</SPAN><SPAN class="operator token">></SPAN>Railroads<SPAN class="operator token"><</SPAN><SPAN class="operator token">/</SPAN>div<SPAN class="operator token">></SPAN>
      <SPAN class="operator token"><</SPAN>div <SPAN class="keyword token">class</SPAN><SPAN class="operator token">=</SPAN><SPAN class="string token">"sublayers-item"</SPAN> data<SPAN class="operator token">-</SPAN>id<SPAN class="operator token">=</SPAN><SPAN class="string token">"2"</SPAN><SPAN class="operator token">></SPAN>States<SPAN class="operator token"><</SPAN><SPAN class="operator token">/</SPAN>div<SPAN class="operator token">></SPAN>
    <SPAN class="operator token"><</SPAN><SPAN class="operator token">/</SPAN>div<SPAN class="operator token">></SPAN>
  <SPAN class="operator token"><</SPAN><SPAN class="operator token">/</SPAN>div<SPAN class="operator token">></SPAN>
<SPAN class="operator token"><</SPAN><SPAN class="operator token">/</SPAN>body<SPAN class="operator token">></SPAN>

<SPAN class="operator token"><</SPAN><SPAN class="operator token">/</SPAN>html<SPAN class="operator token">></SPAN>‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍<SPAN class="line-numbers-rows"><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN></SPAN>

All comments

RobertScheitlin__GISP

Michael,

So in your app in the folder where you have your .html file you have a img folder that has a busStop.png file and that file is named with the exact same cAsE?

MichaelCollinsGIS

Something like that. I have a script that loads the image as follows:

bufferLayers = new MapImageLayer({

// The layers must be in reverse order of how they are displayed in the REST interface otherwise

// it tries to render them dynamically which is not possible in 10.31.

url: bufferLayersURL,

title: "Other Map Features",

visible: true,

sublayers: [

{

id: busStopsPedJoinLayerID,

title: "Pedestrian-Bus Stop Buffers Join",

outFields: ["*"],

visible: false

label: 'Bus Stop Location'

popupTemplate: Bus Stop',

outFields: ["*"],

content: busStopContent

}

label: 'School Location'

popupTemplate: (<1mi)",

outFields: ["*"],

content: schoolContent

}

]

});

The weird part is that if I change the bus stop icon to “../img/busStop.png” it works fine, but the schools no longer show up. Neither show up if I load both locally. The only way to make it work is to use the janky web hosted images as above. Do I have to use a fully qualified location? As in publish it to the server then use an address as above?

Best,

Michael Collins

d +1 (646) 791-8814 | c +1 (651) 323-8431

An Equal Opportunity Employer

image001.png

RobertScheitlin__GISP

Michael,

I'm confused there is nothing in the code you shared that has anything to do with using a local png file...?

MichaelCollinsGIS

Hey Robert:

If I change what I sent to you to what is below, as I mentioned in my previous email (sorry it was unclear), I see no symbols. So…

Both png files hosted external => everything is fine

Bus stop png file local, school file external => bus stop shows up, but school does not

Both files local => nothing shows up

bufferLayers = new MapImageLayer({

// The layers must be in reverse order of how they are displayed in the REST interface otherwise

// it tries to render them dynamically which is not possible in 10.31.

url: bufferLayersURL,

title: "Other Map Features",

visible: true,

sublayers: [

{

id: busStopsPedJoinLayerID,

title: "Pedestrian-Bus Stop Buffers Join",

outFields: ["*"],

visible: false

label: 'Bus Stop Location'

popupTemplate: Bus Stop',

outFields: ["*"],

content: busStopContent

}

label: 'School Location'

popupTemplate: (<1mi)",

outFields: ["*"],

content: schoolContent

}

]

});

Michael Collins, E.I.T.

d +1 (646) 791-8814 | c +1 (651) 323-8431

An Equal Opportunity Employer

image001.png

RobertScheitlin__GISP

Michael,

I am still not seeing where in the provided code you are setting the sublayers renderer or your renderer code so that I can verify your code.

MichaelCollinsGIS

Not better, probably worse. I have attached a text file with the code. Maybe that will work better.

Michael Collins, E.I.T.

d +1 (646) 791-8814 | c +1 (651) 323-8431

An Equal Opportunity Employer

layerExample.txt.zip

image001.png

RobertScheitlin__GISP

Michael,

<SPAN class="operator token"><</SPAN><SPAN class="operator token">!</SPAN>DOCTYPE html<SPAN class="operator token">></SPAN>
<SPAN class="operator token"><</SPAN>html<SPAN class="operator token">></SPAN>

<SPAN class="operator token"><</SPAN>head<SPAN class="operator token">></SPAN>
  <SPAN class="operator token"><</SPAN>meta charset<SPAN class="operator token">=</SPAN><SPAN class="string token">"utf-8"</SPAN> <SPAN class="operator token">/</SPAN><SPAN class="operator token">></SPAN>
  <SPAN class="operator token"><</SPAN>meta name<SPAN class="operator token">=</SPAN><SPAN class="string token">"viewport"</SPAN> content<SPAN class="operator token">=</SPAN><SPAN class="string token">"initial-scale=1,maximum-scale=1,user-scalable=no"</SPAN> <SPAN class="operator token">/</SPAN><SPAN class="operator token">></SPAN>
  <SPAN class="operator token"><</SPAN>title<SPAN class="operator token">></SPAN>MapImageLayer <SPAN class="operator token">-</SPAN> Toggle sublayer visibility <SPAN class="operator token">-</SPAN> <SPAN class="number token">4.11</SPAN><SPAN class="operator token"><</SPAN><SPAN class="operator token">/</SPAN>title<SPAN class="operator token">></SPAN>

  <SPAN class="operator token"><</SPAN>link rel<SPAN class="operator token">=</SPAN><SPAN class="string token">"stylesheet"</SPAN> href<SPAN class="operator token">=</SPAN><SPAN class="string token">"http://js.arcgis.com/4.11/esri/themes/light/main.css"</SPAN> <SPAN class="operator token">/</SPAN><SPAN class="operator token">></SPAN>
  <SPAN class="operator token"><</SPAN>script src<SPAN class="operator token">=</SPAN><SPAN class="string token">"http://js.arcgis.com/4.11/"</SPAN><SPAN class="operator token">></SPAN><SPAN class="operator token"><</SPAN><SPAN class="operator token">/</SPAN>script<SPAN class="operator token">></SPAN>

  <SPAN class="operator token"><</SPAN>script<SPAN class="operator token">></SPAN>
    <SPAN class="token function">require</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">[</SPAN>
      <SPAN class="string token">"esri/Map"</SPAN><SPAN class="punctuation token">,</SPAN>
      <SPAN class="string token">"esri/views/MapView"</SPAN><SPAN class="punctuation token">,</SPAN>
      <SPAN class="string token">"esri/layers/MapImageLayer"</SPAN><SPAN class="punctuation token">,</SPAN>
      <SPAN class="string token">"esri/symbols/PictureMarkerSymbol"</SPAN><SPAN class="punctuation token">,</SPAN>
      <SPAN class="string token">"esri/Graphic"</SPAN>
    <SPAN class="punctuation token">]</SPAN><SPAN class="punctuation token">,</SPAN> <SPAN class="keyword token">function</SPAN> <SPAN class="punctuation token">(</SPAN>Map<SPAN class="punctuation token">,</SPAN> MapView<SPAN class="punctuation token">,</SPAN> MapImageLayer<SPAN class="punctuation token">,</SPAN> PictureMarkerSymbol<SPAN class="punctuation token">,</SPAN> Graphic<SPAN class="punctuation token">)</SPAN> <SPAN class="punctuation token">{</SPAN>
      <SPAN class="comment token">/*****************************************************************
       * Create a renderer for the dynamic data layer (table).
       *****************************************************************/</SPAN>

      <SPAN class="keyword token">var</SPAN> renderer <SPAN class="operator token">=</SPAN> <SPAN class="punctuation token">{</SPAN>
        type<SPAN class="punctuation token">:</SPAN> <SPAN class="string token">"simple"</SPAN><SPAN class="punctuation token">,</SPAN> <SPAN class="comment token">// autocasts as new SimpleRenderer()</SPAN>
        symbol<SPAN class="punctuation token">:</SPAN> <SPAN class="punctuation token">{</SPAN>
          type<SPAN class="punctuation token">:</SPAN> <SPAN class="string token">"simple-line"</SPAN><SPAN class="punctuation token">,</SPAN> <SPAN class="comment token">// autocasts as new SimpleLineSymbol()</SPAN>
          color<SPAN class="punctuation token">:</SPAN> <SPAN class="punctuation token">[</SPAN><SPAN class="number token">255</SPAN><SPAN class="punctuation token">,</SPAN> <SPAN class="number token">255</SPAN><SPAN class="punctuation token">,</SPAN> <SPAN class="number token">255</SPAN><SPAN class="punctuation token">,</SPAN> <SPAN class="number token">0.5</SPAN><SPAN class="punctuation token">]</SPAN><SPAN class="punctuation token">,</SPAN>
          width<SPAN class="punctuation token">:</SPAN> <SPAN class="number token">0.75</SPAN><SPAN class="punctuation token">,</SPAN>
          style<SPAN class="punctuation token">:</SPAN> <SPAN class="string token">"long-dash-dot-dot"</SPAN>
        <SPAN class="punctuation token">}</SPAN>
      <SPAN class="punctuation token">}</SPAN><SPAN class="punctuation token">;</SPAN>

      <SPAN class="keyword token">var</SPAN> pms <SPAN class="operator token">=</SPAN> <SPAN class="keyword token">new</SPAN> <SPAN class="token class-name">PictureMarkerSymbol</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">{</SPAN>
        url<SPAN class="punctuation token">:</SPAN> <SPAN class="string token">'images/search-pointer.png'</SPAN><SPAN class="punctuation token">,</SPAN> <SPAN class="comment token">//this does not for a sublayer symbol</SPAN>
        <SPAN class="comment token">//url: 'https://js.arcgis.com/3.28/esri/dijit/Search/images/search-pointer.png', //this works</SPAN>
        width<SPAN class="punctuation token">:</SPAN> <SPAN class="string token">"22px"</SPAN><SPAN class="punctuation token">,</SPAN>
        height<SPAN class="punctuation token">:</SPAN> <SPAN class="string token">"22px"</SPAN>
      <SPAN class="punctuation token">}</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>

      <SPAN class="comment token">/*****************************************************************
       * Create a MapImageLayer instance pointing to a Map Service
       * containing data about US Cities, Counties, States and Highways.
       * Define sublayers with visibility for each layer in Map Service.
       *****************************************************************/</SPAN>
      <SPAN class="keyword token">var</SPAN> layer <SPAN class="operator token">=</SPAN> <SPAN class="keyword token">new</SPAN> <SPAN class="token class-name">MapImageLayer</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">{</SPAN>
        url<SPAN class="punctuation token">:</SPAN> <SPAN class="string token">"http://sampleserver6.arcgisonline.com/arcgis/rest/services/USA/MapServer"</SPAN><SPAN class="punctuation token">,</SPAN>
        sublayers<SPAN class="punctuation token">:</SPAN> <SPAN class="punctuation token">[</SPAN><SPAN class="punctuation token">{</SPAN>
            id<SPAN class="punctuation token">:</SPAN> <SPAN class="number token">2</SPAN><SPAN class="punctuation token">,</SPAN>
            visible<SPAN class="punctuation token">:</SPAN> <SPAN class="keyword token">true</SPAN>
          <SPAN class="punctuation token">}</SPAN><SPAN class="punctuation token">,</SPAN>
          <SPAN class="punctuation token">{</SPAN>
            id<SPAN class="punctuation token">:</SPAN> <SPAN class="number token">4</SPAN><SPAN class="punctuation token">,</SPAN>
            visible<SPAN class="punctuation token">:</SPAN> <SPAN class="keyword token">false</SPAN><SPAN class="punctuation token">,</SPAN>
            title<SPAN class="punctuation token">:</SPAN> <SPAN class="string token">"Railroads"</SPAN><SPAN class="punctuation token">,</SPAN>
            renderer<SPAN class="punctuation token">:</SPAN> renderer<SPAN class="punctuation token">,</SPAN>
            source<SPAN class="punctuation token">:</SPAN> <SPAN class="punctuation token">{</SPAN>
              <SPAN class="comment token">// indicates the source of the sublayer is a dynamic data layer</SPAN>
              type<SPAN class="punctuation token">:</SPAN> <SPAN class="string token">"data-layer"</SPAN><SPAN class="punctuation token">,</SPAN>
              <SPAN class="comment token">// this object defines the data source of the layer</SPAN>
              <SPAN class="comment token">// in this case it's a feature class table from a file geodatabase</SPAN>
              dataSource<SPAN class="punctuation token">:</SPAN> <SPAN class="punctuation token">{</SPAN>
                type<SPAN class="punctuation token">:</SPAN> <SPAN class="string token">"table"</SPAN><SPAN class="punctuation token">,</SPAN>
                <SPAN class="comment token">// workspace name</SPAN>
                workspaceId<SPAN class="punctuation token">:</SPAN> <SPAN class="string token">"MyDatabaseWorkspaceIDSSR2"</SPAN><SPAN class="punctuation token">,</SPAN>
                <SPAN class="comment token">// table name</SPAN>
                dataSourceName<SPAN class="punctuation token">:</SPAN> <SPAN class="string token">"ss6.gdb.Railroads"</SPAN>
              <SPAN class="punctuation token">}</SPAN>
            <SPAN class="punctuation token">}</SPAN>
          <SPAN class="punctuation token">}</SPAN><SPAN class="punctuation token">,</SPAN>
          <SPAN class="punctuation token">{</SPAN>
            id<SPAN class="punctuation token">:</SPAN> <SPAN class="number token">1</SPAN><SPAN class="punctuation token">,</SPAN>
            visible<SPAN class="punctuation token">:</SPAN> <SPAN class="keyword token">true</SPAN>
          <SPAN class="punctuation token">}</SPAN><SPAN class="punctuation token">,</SPAN>
          <SPAN class="punctuation token">{</SPAN>
            id<SPAN class="punctuation token">:</SPAN> <SPAN class="number token">0</SPAN><SPAN class="punctuation token">,</SPAN>
            renderer<SPAN class="punctuation token">:</SPAN> <SPAN class="punctuation token">{</SPAN>
              type<SPAN class="punctuation token">:</SPAN> <SPAN class="string token">'simple'</SPAN><SPAN class="punctuation token">,</SPAN>
              symbol<SPAN class="punctuation token">:</SPAN> pms
            <SPAN class="punctuation token">}</SPAN><SPAN class="punctuation token">,</SPAN>
            visible<SPAN class="punctuation token">:</SPAN> <SPAN class="keyword token">true</SPAN>
          <SPAN class="punctuation token">}</SPAN>
        <SPAN class="punctuation token">]</SPAN>
      <SPAN class="punctuation token">}</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>

      <SPAN class="comment token">/*****************************************************************
       * Add the layer to a map
       *****************************************************************/</SPAN>
      <SPAN class="keyword token">var</SPAN> map <SPAN class="operator token">=</SPAN> <SPAN class="keyword token">new</SPAN> <SPAN class="token class-name">Map</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">{</SPAN>
        basemap<SPAN class="punctuation token">:</SPAN> <SPAN class="string token">"dark-gray"</SPAN><SPAN class="punctuation token">,</SPAN>
        layers<SPAN class="punctuation token">:</SPAN> <SPAN class="punctuation token">[</SPAN>layer<SPAN class="punctuation token">]</SPAN>
      <SPAN class="punctuation token">}</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>

      <SPAN class="keyword token">var</SPAN> view <SPAN class="operator token">=</SPAN> <SPAN class="keyword token">new</SPAN> <SPAN class="token class-name">MapView</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">{</SPAN>
        container<SPAN class="punctuation token">:</SPAN> <SPAN class="string token">"viewDiv"</SPAN><SPAN class="punctuation token">,</SPAN>
        map<SPAN class="punctuation token">:</SPAN> map<SPAN class="punctuation token">,</SPAN>
        zoom<SPAN class="punctuation token">:</SPAN> <SPAN class="number token">4</SPAN><SPAN class="punctuation token">,</SPAN>
        center<SPAN class="punctuation token">:</SPAN> <SPAN class="punctuation token">[</SPAN><SPAN class="operator token">-</SPAN><SPAN class="number token">99</SPAN><SPAN class="punctuation token">,</SPAN> <SPAN class="number token">39</SPAN><SPAN class="punctuation token">]</SPAN>
      <SPAN class="punctuation token">}</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>

      view<SPAN class="punctuation token">.</SPAN><SPAN class="token function">when</SPAN><SPAN class="punctuation token">(</SPAN> <SPAN class="keyword token">function</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">{</SPAN>
        <SPAN class="keyword token">var</SPAN> gra <SPAN class="operator token">=</SPAN> <SPAN class="keyword token">new</SPAN> <SPAN class="token class-name">Graphic</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">{</SPAN>
          geometry<SPAN class="punctuation token">:</SPAN> view<SPAN class="punctuation token">.</SPAN>center<SPAN class="punctuation token">,</SPAN>
          symbol<SPAN class="punctuation token">:</SPAN> pms
        <SPAN class="punctuation token">}</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>
        view<SPAN class="punctuation token">.</SPAN>graphics<SPAN class="punctuation token">.</SPAN><SPAN class="token function">add</SPAN><SPAN class="punctuation token">(</SPAN>gra<SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>
      <SPAN class="punctuation token">}</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>

      <SPAN class="comment token">/*****************************************************************
       * Wait for Layer to load and update the page to refelect which
       * layers are visible in the Map Service.
       *****************************************************************/</SPAN>
      layer<SPAN class="punctuation token">.</SPAN><SPAN class="token function">when</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="keyword token">function</SPAN> <SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">)</SPAN> <SPAN class="punctuation token">{</SPAN>
        layer<SPAN class="punctuation token">.</SPAN>sublayers<SPAN class="punctuation token">.</SPAN><SPAN class="token function">map</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="keyword token">function</SPAN> <SPAN class="punctuation token">(</SPAN>sublayer<SPAN class="punctuation token">)</SPAN> <SPAN class="punctuation token">{</SPAN>
          <SPAN class="keyword token">var</SPAN> id <SPAN class="operator token">=</SPAN> sublayer<SPAN class="punctuation token">.</SPAN>id<SPAN class="punctuation token">;</SPAN>
          <SPAN class="keyword token">var</SPAN> visible <SPAN class="operator token">=</SPAN> sublayer<SPAN class="punctuation token">.</SPAN>visible<SPAN class="punctuation token">;</SPAN>
          <SPAN class="keyword token">var</SPAN> node <SPAN class="operator token">=</SPAN> document<SPAN class="punctuation token">.</SPAN><SPAN class="token function">querySelector</SPAN><SPAN class="punctuation token">(</SPAN>
            <SPAN class="string token">".sublayers-item[data-id='"</SPAN> <SPAN class="operator token">+</SPAN> id <SPAN class="operator token">+</SPAN> <SPAN class="string token">"']"</SPAN>
          <SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>
          <SPAN class="keyword token">if</SPAN> <SPAN class="punctuation token">(</SPAN>visible<SPAN class="punctuation token">)</SPAN> <SPAN class="punctuation token">{</SPAN>
            node<SPAN class="punctuation token">.</SPAN>classList<SPAN class="punctuation token">.</SPAN><SPAN class="token function">add</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="string token">"visible-layer"</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>
          <SPAN class="punctuation token">}</SPAN>
        <SPAN class="punctuation token">}</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>
      <SPAN class="punctuation token">}</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>

      <SPAN class="comment token">/*****************************************************************
       * Listen for when buttons on the page have been clicked to turn
       * layers on and off in the Map Service.
       *****************************************************************/</SPAN>
      <SPAN class="keyword token">var</SPAN> sublayersElement <SPAN class="operator token">=</SPAN> document<SPAN class="punctuation token">.</SPAN><SPAN class="token function">querySelector</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="string token">".sublayers"</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>
      sublayersElement<SPAN class="punctuation token">.</SPAN><SPAN class="token function">addEventListener</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="string token">"click"</SPAN><SPAN class="punctuation token">,</SPAN> <SPAN class="keyword token">function</SPAN> <SPAN class="punctuation token">(</SPAN>event<SPAN class="punctuation token">)</SPAN> <SPAN class="punctuation token">{</SPAN>
        <SPAN class="keyword token">var</SPAN> id <SPAN class="operator token">=</SPAN> event<SPAN class="punctuation token">.</SPAN>target<SPAN class="punctuation token">.</SPAN><SPAN class="token function">getAttribute</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="string token">"data-id"</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>
        <SPAN class="keyword token">if</SPAN> <SPAN class="punctuation token">(</SPAN>id<SPAN class="punctuation token">)</SPAN> <SPAN class="punctuation token">{</SPAN>
          <SPAN class="keyword token">var</SPAN> sublayer <SPAN class="operator token">=</SPAN> layer<SPAN class="punctuation token">.</SPAN><SPAN class="token function">findSublayerById</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="token function">parseInt</SPAN><SPAN class="punctuation token">(</SPAN>id<SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>
          <SPAN class="keyword token">var</SPAN> node <SPAN class="operator token">=</SPAN> document<SPAN class="punctuation token">.</SPAN><SPAN class="token function">querySelector</SPAN><SPAN class="punctuation token">(</SPAN>
            <SPAN class="string token">".sublayers-item[data-id='"</SPAN> <SPAN class="operator token">+</SPAN> id <SPAN class="operator token">+</SPAN> <SPAN class="string token">"']"</SPAN>
          <SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>
          sublayer<SPAN class="punctuation token">.</SPAN>visible <SPAN class="operator token">=</SPAN> <SPAN class="operator token">!</SPAN>sublayer<SPAN class="punctuation token">.</SPAN>visible<SPAN class="punctuation token">;</SPAN>
          node<SPAN class="punctuation token">.</SPAN>classList<SPAN class="punctuation token">.</SPAN><SPAN class="token function">toggle</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="string token">"visible-layer"</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>
        <SPAN class="punctuation token">}</SPAN>
      <SPAN class="punctuation token">}</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>
    <SPAN class="punctuation token">}</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>
  <SPAN class="operator token"><</SPAN><SPAN class="operator token">/</SPAN>script<SPAN class="operator token">></SPAN>

  <SPAN class="operator token"><</SPAN>style<SPAN class="operator token">></SPAN>
    html<SPAN class="punctuation token">,</SPAN>
    body <SPAN class="punctuation token">{</SPAN>
      font<SPAN class="operator token">-</SPAN>family<SPAN class="punctuation token">:</SPAN> sans<SPAN class="operator token">-</SPAN>serif<SPAN class="punctuation token">;</SPAN>
      padding<SPAN class="punctuation token">:</SPAN> <SPAN class="number token">0</SPAN><SPAN class="punctuation token">;</SPAN>
      margin<SPAN class="punctuation token">:</SPAN> <SPAN class="number token">0</SPAN><SPAN class="punctuation token">;</SPAN>
      height<SPAN class="punctuation token">:</SPAN> <SPAN class="number token">100</SPAN><SPAN class="operator token">%</SPAN><SPAN class="punctuation token">;</SPAN>
      width<SPAN class="punctuation token">:</SPAN> <SPAN class="number token">100</SPAN><SPAN class="operator token">%</SPAN><SPAN class="punctuation token">;</SPAN>
    <SPAN class="punctuation token">}</SPAN>

    #viewDiv <SPAN class="punctuation token">{</SPAN>
      position<SPAN class="punctuation token">:</SPAN> absolute<SPAN class="punctuation token">;</SPAN>
      right<SPAN class="punctuation token">:</SPAN> <SPAN class="number token">0</SPAN><SPAN class="punctuation token">;</SPAN>
      left<SPAN class="punctuation token">:</SPAN> <SPAN class="number token">0</SPAN><SPAN class="punctuation token">;</SPAN>
      top<SPAN class="punctuation token">:</SPAN> <SPAN class="number token">0</SPAN><SPAN class="punctuation token">;</SPAN>
      bottom<SPAN class="punctuation token">:</SPAN> 60px<SPAN class="punctuation token">;</SPAN>
    <SPAN class="punctuation token">}</SPAN>

    <SPAN class="punctuation token">.</SPAN>footer <SPAN class="punctuation token">{</SPAN>
      position<SPAN class="punctuation token">:</SPAN> absolute<SPAN class="punctuation token">;</SPAN>
      bottom<SPAN class="punctuation token">:</SPAN> <SPAN class="number token">0</SPAN><SPAN class="punctuation token">;</SPAN>
      height<SPAN class="punctuation token">:</SPAN> 60px<SPAN class="punctuation token">;</SPAN>
      width<SPAN class="punctuation token">:</SPAN> <SPAN class="number token">100</SPAN><SPAN class="operator token">%</SPAN><SPAN class="punctuation token">;</SPAN>
    <SPAN class="punctuation token">}</SPAN>

    <SPAN class="punctuation token">.</SPAN>sublayers <SPAN class="punctuation token">{</SPAN>
      margin<SPAN class="punctuation token">:</SPAN> <SPAN class="number token">0</SPAN> auto<SPAN class="punctuation token">;</SPAN>
      display<SPAN class="punctuation token">:</SPAN> flex<SPAN class="punctuation token">;</SPAN>
      flex<SPAN class="operator token">-</SPAN>direction<SPAN class="punctuation token">:</SPAN> row<SPAN class="punctuation token">;</SPAN>
      justify<SPAN class="operator token">-</SPAN>content<SPAN class="punctuation token">:</SPAN> center<SPAN class="punctuation token">;</SPAN>
      align<SPAN class="operator token">-</SPAN>items<SPAN class="punctuation token">:</SPAN> center<SPAN class="punctuation token">;</SPAN>
      overflow<SPAN class="punctuation token">:</SPAN> auto<SPAN class="punctuation token">;</SPAN>
    <SPAN class="punctuation token">}</SPAN>

    <SPAN class="punctuation token">.</SPAN>sublayers<SPAN class="operator token">-</SPAN>item <SPAN class="punctuation token">{</SPAN>
      flex<SPAN class="operator token">-</SPAN>grow<SPAN class="punctuation token">:</SPAN> <SPAN class="number token">4</SPAN><SPAN class="punctuation token">;</SPAN>
      background<SPAN class="operator token">-</SPAN>color<SPAN class="punctuation token">:</SPAN> <SPAN class="token function">rgba</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="number token">34</SPAN><SPAN class="punctuation token">,</SPAN> <SPAN class="number token">111</SPAN><SPAN class="punctuation token">,</SPAN> <SPAN class="number token">14</SPAN><SPAN class="punctuation token">,</SPAN> <SPAN class="number token">0.5</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>
      color<SPAN class="punctuation token">:</SPAN> #fff<SPAN class="punctuation token">;</SPAN>
      margin<SPAN class="punctuation token">:</SPAN> 1px<SPAN class="punctuation token">;</SPAN>
      width<SPAN class="punctuation token">:</SPAN> <SPAN class="number token">50</SPAN><SPAN class="operator token">%</SPAN><SPAN class="punctuation token">;</SPAN>
      padding<SPAN class="punctuation token">:</SPAN> 20px<SPAN class="punctuation token">;</SPAN>
      overflow<SPAN class="punctuation token">:</SPAN> auto<SPAN class="punctuation token">;</SPAN>
      text<SPAN class="operator token">-</SPAN>align<SPAN class="punctuation token">:</SPAN> center<SPAN class="punctuation token">;</SPAN>
      cursor<SPAN class="punctuation token">:</SPAN> pointer<SPAN class="punctuation token">;</SPAN>
      font<SPAN class="operator token">-</SPAN>size<SPAN class="punctuation token">:</SPAN> <SPAN class="number token">0</SPAN><SPAN class="punctuation token">.</SPAN>7em<SPAN class="punctuation token">;</SPAN>
    <SPAN class="punctuation token">}</SPAN>

    <SPAN class="punctuation token">.</SPAN>visible<SPAN class="operator token">-</SPAN>layer <SPAN class="punctuation token">{</SPAN>
      color<SPAN class="punctuation token">:</SPAN> #fff<SPAN class="punctuation token">;</SPAN>
      background<SPAN class="operator token">-</SPAN>color<SPAN class="punctuation token">:</SPAN> #226f0e<SPAN class="punctuation token">;</SPAN>
    <SPAN class="punctuation token">}</SPAN>
  <SPAN class="operator token"><</SPAN><SPAN class="operator token">/</SPAN>style<SPAN class="operator token">></SPAN>
<SPAN class="operator token"><</SPAN><SPAN class="operator token">/</SPAN>head<SPAN class="operator token">></SPAN>

<SPAN class="operator token"><</SPAN>body<SPAN class="operator token">></SPAN>
  <SPAN class="operator token"><</SPAN>div id<SPAN class="operator token">=</SPAN><SPAN class="string token">"viewDiv"</SPAN><SPAN class="operator token">></SPAN><SPAN class="operator token"><</SPAN><SPAN class="operator token">/</SPAN>div<SPAN class="operator token">></SPAN>
  <SPAN class="operator token"><</SPAN>div <SPAN class="keyword token">class</SPAN><SPAN class="operator token">=</SPAN><SPAN class="string token">"footer"</SPAN><SPAN class="operator token">></SPAN>
    <SPAN class="operator token"><</SPAN>div <SPAN class="keyword token">class</SPAN><SPAN class="operator token">=</SPAN><SPAN class="string token">"sublayers"</SPAN><SPAN class="operator token">></SPAN>
      <SPAN class="operator token"><</SPAN>div <SPAN class="keyword token">class</SPAN><SPAN class="operator token">=</SPAN><SPAN class="string token">"sublayers-item"</SPAN> data<SPAN class="operator token">-</SPAN>id<SPAN class="operator token">=</SPAN><SPAN class="string token">"0"</SPAN><SPAN class="operator token">></SPAN>Cities<SPAN class="operator token"><</SPAN><SPAN class="operator token">/</SPAN>div<SPAN class="operator token">></SPAN>
      <SPAN class="operator token"><</SPAN>div <SPAN class="keyword token">class</SPAN><SPAN class="operator token">=</SPAN><SPAN class="string token">"sublayers-item"</SPAN> data<SPAN class="operator token">-</SPAN>id<SPAN class="operator token">=</SPAN><SPAN class="string token">"1"</SPAN><SPAN class="operator token">></SPAN>Highways<SPAN class="operator token"><</SPAN><SPAN class="operator token">/</SPAN>div<SPAN class="operator token">></SPAN>
      <SPAN class="operator token"><</SPAN>div <SPAN class="keyword token">class</SPAN><SPAN class="operator token">=</SPAN><SPAN class="string token">"sublayers-item"</SPAN> data<SPAN class="operator token">-</SPAN>id<SPAN class="operator token">=</SPAN><SPAN class="string token">"4"</SPAN><SPAN class="operator token">></SPAN>Railroads<SPAN class="operator token"><</SPAN><SPAN class="operator token">/</SPAN>div<SPAN class="operator token">></SPAN>
      <SPAN class="operator token"><</SPAN>div <SPAN class="keyword token">class</SPAN><SPAN class="operator token">=</SPAN><SPAN class="string token">"sublayers-item"</SPAN> data<SPAN class="operator token">-</SPAN>id<SPAN class="operator token">=</SPAN><SPAN class="string token">"2"</SPAN><SPAN class="operator token">></SPAN>States<SPAN class="operator token"><</SPAN><SPAN class="operator token">/</SPAN>div<SPAN class="operator token">></SPAN>
    <SPAN class="operator token"><</SPAN><SPAN class="operator token">/</SPAN>div<SPAN class="operator token">></SPAN>
  <SPAN class="operator token"><</SPAN><SPAN class="operator token">/</SPAN>div<SPAN class="operator token">></SPAN>
<SPAN class="operator token"><</SPAN><SPAN class="operator token">/</SPAN>body<SPAN class="operator token">></SPAN>

<SPAN class="operator token"><</SPAN><SPAN class="operator token">/</SPAN>html<SPAN class="operator token">></SPAN>‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍<SPAN class="line-numbers-rows"><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN></SPAN>

MichaelCollinsGIS

Thanks for your help on this Robert!!!

Michael Collins, E.I.T.

d +1 (646) 791-8814 | c +1 (651) 323-8431

An Equal Opportunity Employer

image001.png

AnnaGoldenstein

Version 4.30.0 - still doesn`t work 😱

会話に参加する

サインインしたメンバーは投稿、更新のフォローなどができます。初めてですか？無料アカウントを登録してください。

クイックリンク

Community Help
Find useful guides, FAQs, and documents to help you navigate and make the most of Esri Community.