<?xml version="1.0" encoding="UTF-8"?>
<rss xmlns:content="http://purl.org/rss/1.0/modules/content/" xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns:taxo="http://purl.org/rss/1.0/modules/taxonomy/" version="2.0">
  <channel>
    <title>topic Legend doesn't recognize how color is formatted in ArcGIS JavaScript Maps SDK Questions</title>
    <link>https://community.esri.com/t5/arcgis-javascript-maps-sdk-questions/legend-doesn-t-recognize-how-color-is-formatted/m-p/556157#M51879</link>
    <description>&lt;HTML&gt;&lt;HEAD&gt;&lt;/HEAD&gt;&lt;BODY&gt;&lt;P&gt;I am using something I found at gitHub that will help me classify my data, change classes, colors etc.&amp;nbsp; It was a little rough, but I got it working and my layer is drawing.&amp;nbsp; The problem is in the way the color is formatted.&amp;nbsp; I'm pulling it out an predetermined array and the function is converting it to hex. Somewhere in here I've defined my color such that the legend doesn't like it and it's failing when I create it. &lt;/P&gt;&lt;P&gt;&lt;/P&gt;&lt;P&gt;The color is defined as hex returned from the function in the format #ffee000.&amp;nbsp; I using these to create a simplefillsymbol for a classbreakrenderer&lt;/P&gt;&lt;P&gt;&lt;/P&gt;&lt;P&gt;breakData is what is getting returned from my function.&amp;nbsp; It is in the format&lt;/P&gt;&lt;P&gt;&lt;SPAN class="objectBox-text objectBox"&gt;{"breaks": [{"interval":0.9 , "color":"#fee5d9" },{"interval":5.95 , "color":"#fcae91" },{"interval":11.26 , "color":"#fb6a4a" },{"interval":19.77 , "color":"#de2d26" },{"interval":27.86 , "color":"#a50f15" }]}&lt;/SPAN&gt;&lt;/P&gt;&lt;P&gt;&lt;SPAN class="objectBox-text objectBox"&gt;&lt;/SPAN&gt;&lt;/P&gt;&lt;P&gt;&lt;SPAN class="objectBox-text objectBox"&gt;I've also returned the array of break points so I can use it for my max/min of the classbreaks.&amp;nbsp; &lt;/SPAN&gt;&lt;/P&gt;&lt;P&gt;&lt;SPAN class="objectBox-text objectBox"&gt;breaks = &lt;SPAN class="objectBox-array objectBox"&gt;&lt;A class="objectLink"&gt;&lt;SPAN class="arrayLeftBracket"&gt;[&lt;/SPAN&gt;&lt;/A&gt;&lt;SPAN class="objectBox-number objectBox"&gt;0.9&lt;/SPAN&gt;&lt;SPAN class="arrayComma"&gt;, &lt;/SPAN&gt;&lt;SPAN class="objectBox-number objectBox"&gt;3.99&lt;/SPAN&gt;&lt;SPAN class="arrayComma"&gt;, &lt;/SPAN&gt;&lt;SPAN class="objectBox-number objectBox"&gt;8.92&lt;/SPAN&gt;&lt;SPAN class="arrayComma"&gt;, &lt;/SPAN&gt;&lt;SPAN class="objectBox-number objectBox"&gt;11.98&lt;/SPAN&gt;&lt;SPAN class="arrayComma"&gt;, &lt;/SPAN&gt;&lt;SPAN class="objectBox-number objectBox"&gt;16.97&lt;/SPAN&gt;&lt;SPAN class="arrayComma"&gt;, &lt;/SPAN&gt;&lt;SPAN class="objectBox-number objectBox"&gt;23.8&lt;/SPAN&gt;&lt;SPAN class="arrayComma"&gt;, &lt;/SPAN&gt;&lt;SPAN class="objectBox-number objectBox"&gt;30.02&lt;/SPAN&gt;&lt;SPAN class="arrayComma"&gt;, &lt;/SPAN&gt;&lt;SPAN class="objectBox-number objectBox"&gt;64.08&lt;/SPAN&gt;&lt;SPAN class="arrayComma"&gt;&lt;/SPAN&gt;&lt;A class="objectLink"&gt;&lt;SPAN class="arrayRightBracket"&gt;]&lt;/SPAN&gt;&lt;/A&gt;&lt;/SPAN&gt;;&lt;/SPAN&gt;&lt;/P&gt;&lt;P&gt;&lt;EM&gt;&lt;SPAN class="objectBox-text objectBox"&gt;Note: I couldn't figure how how to specify just a min value and symbol, without a maxValue in between when specifying a new break.&amp;nbsp; I thought I could put a 'null' in addBreak, but I couldn't figure out how to skip over it.&lt;/SPAN&gt;&lt;/EM&gt;&lt;/P&gt;&lt;P&gt;&lt;SPAN class="objectBox-text objectBox"&gt;-------------------------------------------------------------------&lt;/SPAN&gt;&lt;/P&gt;&lt;P&gt;var br = new ClassBreaksRenderer(defaultSymbol, findBreakValue); &lt;EM&gt;//using a function here instead of a field&lt;/EM&gt;&lt;/P&gt;&lt;P&gt;var breakData = JSON.parse(jstyle); &lt;/P&gt;&lt;P&gt;var int,nextup, nextInt, col,color, sym;&lt;/P&gt;&lt;P&gt;for (var j in breakData.breaks){&lt;/P&gt;&lt;P&gt;int = breakData.breaks&lt;J&gt;.interval; &lt;/J&gt;&lt;/P&gt;&lt;P&gt;nextup = parseInt(j) + 1; &lt;/P&gt;&lt;P&gt;nextInt = classBr[nextup]; &lt;/P&gt;&lt;P&gt;&amp;nbsp;&amp;nbsp;&amp;nbsp; if (!nextInt) {&lt;/P&gt;&lt;P&gt;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp; nextInt = highestValue; &lt;/P&gt;&lt;P&gt;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp; } &lt;/P&gt;&lt;P&gt;col = breakData.breaks&lt;J&gt;.color; &lt;/J&gt;&lt;/P&gt;&lt;P&gt;color = new Color(col);&lt;/P&gt;&lt;P&gt;sym = new SimpleFillSymbol(SimpleFillSymbol.STYLE_SOLID, polyOutlineSymbol, col); &lt;EM&gt;//polyOutlineSymbol defined earlier as a thin gray line&lt;/EM&gt;&lt;/P&gt;&lt;P&gt;br.addBreak(int, nextInt, sym);&lt;/P&gt;&lt;P&gt;}&lt;/P&gt;&lt;P&gt;featureLayer.setRenderer(br);&lt;/P&gt;&lt;P&gt;featureLayer.redraw();&lt;/P&gt;&lt;P&gt;var legend = new Legend({&lt;/P&gt;&lt;P&gt;map: map, layerInfos: [{&lt;/P&gt;&lt;P&gt;"layer": featureLayer, "title": "Value" }]&lt;/P&gt;&lt;P&gt;},"legend");&lt;/P&gt;&lt;P&gt;legend.startup();&lt;/P&gt;&lt;P&gt;&lt;/P&gt;&lt;P&gt;I get an error: &lt;SPAN class="objectBox-errorMessage objectBox hasTwisty hasBreakSwitch opened"&gt;&lt;SPAN class="errorMessage"&gt;&lt;EM&gt;TypeError: b.color.toRgba is not a function &lt;/EM&gt;during the legend creation.&lt;/SPAN&gt;&lt;/SPAN&gt;&lt;/P&gt;&lt;P&gt;&lt;SPAN class="objectBox-errorMessage objectBox hasTwisty hasBreakSwitch opened"&gt;&lt;SPAN class="errorMessage"&gt;&lt;/SPAN&gt;&lt;/SPAN&gt;&lt;/P&gt;&lt;P&gt;&lt;SPAN class="objectBox-errorMessage objectBox hasTwisty hasBreakSwitch opened"&gt;&lt;SPAN class="errorMessage"&gt;The map displays correctly, with the classification and colors as defined.&amp;nbsp; I assume the legend doesn't like the way I formatted the color for my symbology?&amp;nbsp; There seems to be lots of variations on defining your color, hex, rgb, rgba.&lt;BR /&gt;&lt;/SPAN&gt;&lt;/SPAN&gt;&lt;/P&gt;&lt;/BODY&gt;&lt;/HTML&gt;</description>
    <pubDate>Thu, 07 Aug 2014 15:01:19 GMT</pubDate>
    <dc:creator>TracySchloss</dc:creator>
    <dc:date>2014-08-07T15:01:19Z</dc:date>
    <item>
      <title>Legend doesn't recognize how color is formatted</title>
      <link>https://community.esri.com/t5/arcgis-javascript-maps-sdk-questions/legend-doesn-t-recognize-how-color-is-formatted/m-p/556157#M51879</link>
      <description>&lt;HTML&gt;&lt;HEAD&gt;&lt;/HEAD&gt;&lt;BODY&gt;&lt;P&gt;I am using something I found at gitHub that will help me classify my data, change classes, colors etc.&amp;nbsp; It was a little rough, but I got it working and my layer is drawing.&amp;nbsp; The problem is in the way the color is formatted.&amp;nbsp; I'm pulling it out an predetermined array and the function is converting it to hex. Somewhere in here I've defined my color such that the legend doesn't like it and it's failing when I create it. &lt;/P&gt;&lt;P&gt;&lt;/P&gt;&lt;P&gt;The color is defined as hex returned from the function in the format #ffee000.&amp;nbsp; I using these to create a simplefillsymbol for a classbreakrenderer&lt;/P&gt;&lt;P&gt;&lt;/P&gt;&lt;P&gt;breakData is what is getting returned from my function.&amp;nbsp; It is in the format&lt;/P&gt;&lt;P&gt;&lt;SPAN class="objectBox-text objectBox"&gt;{"breaks": [{"interval":0.9 , "color":"#fee5d9" },{"interval":5.95 , "color":"#fcae91" },{"interval":11.26 , "color":"#fb6a4a" },{"interval":19.77 , "color":"#de2d26" },{"interval":27.86 , "color":"#a50f15" }]}&lt;/SPAN&gt;&lt;/P&gt;&lt;P&gt;&lt;SPAN class="objectBox-text objectBox"&gt;&lt;/SPAN&gt;&lt;/P&gt;&lt;P&gt;&lt;SPAN class="objectBox-text objectBox"&gt;I've also returned the array of break points so I can use it for my max/min of the classbreaks.&amp;nbsp; &lt;/SPAN&gt;&lt;/P&gt;&lt;P&gt;&lt;SPAN class="objectBox-text objectBox"&gt;breaks = &lt;SPAN class="objectBox-array objectBox"&gt;&lt;A class="objectLink"&gt;&lt;SPAN class="arrayLeftBracket"&gt;[&lt;/SPAN&gt;&lt;/A&gt;&lt;SPAN class="objectBox-number objectBox"&gt;0.9&lt;/SPAN&gt;&lt;SPAN class="arrayComma"&gt;, &lt;/SPAN&gt;&lt;SPAN class="objectBox-number objectBox"&gt;3.99&lt;/SPAN&gt;&lt;SPAN class="arrayComma"&gt;, &lt;/SPAN&gt;&lt;SPAN class="objectBox-number objectBox"&gt;8.92&lt;/SPAN&gt;&lt;SPAN class="arrayComma"&gt;, &lt;/SPAN&gt;&lt;SPAN class="objectBox-number objectBox"&gt;11.98&lt;/SPAN&gt;&lt;SPAN class="arrayComma"&gt;, &lt;/SPAN&gt;&lt;SPAN class="objectBox-number objectBox"&gt;16.97&lt;/SPAN&gt;&lt;SPAN class="arrayComma"&gt;, &lt;/SPAN&gt;&lt;SPAN class="objectBox-number objectBox"&gt;23.8&lt;/SPAN&gt;&lt;SPAN class="arrayComma"&gt;, &lt;/SPAN&gt;&lt;SPAN class="objectBox-number objectBox"&gt;30.02&lt;/SPAN&gt;&lt;SPAN class="arrayComma"&gt;, &lt;/SPAN&gt;&lt;SPAN class="objectBox-number objectBox"&gt;64.08&lt;/SPAN&gt;&lt;SPAN class="arrayComma"&gt;&lt;/SPAN&gt;&lt;A class="objectLink"&gt;&lt;SPAN class="arrayRightBracket"&gt;]&lt;/SPAN&gt;&lt;/A&gt;&lt;/SPAN&gt;;&lt;/SPAN&gt;&lt;/P&gt;&lt;P&gt;&lt;EM&gt;&lt;SPAN class="objectBox-text objectBox"&gt;Note: I couldn't figure how how to specify just a min value and symbol, without a maxValue in between when specifying a new break.&amp;nbsp; I thought I could put a 'null' in addBreak, but I couldn't figure out how to skip over it.&lt;/SPAN&gt;&lt;/EM&gt;&lt;/P&gt;&lt;P&gt;&lt;SPAN class="objectBox-text objectBox"&gt;-------------------------------------------------------------------&lt;/SPAN&gt;&lt;/P&gt;&lt;P&gt;var br = new ClassBreaksRenderer(defaultSymbol, findBreakValue); &lt;EM&gt;//using a function here instead of a field&lt;/EM&gt;&lt;/P&gt;&lt;P&gt;var breakData = JSON.parse(jstyle); &lt;/P&gt;&lt;P&gt;var int,nextup, nextInt, col,color, sym;&lt;/P&gt;&lt;P&gt;for (var j in breakData.breaks){&lt;/P&gt;&lt;P&gt;int = breakData.breaks&lt;J&gt;.interval; &lt;/J&gt;&lt;/P&gt;&lt;P&gt;nextup = parseInt(j) + 1; &lt;/P&gt;&lt;P&gt;nextInt = classBr[nextup]; &lt;/P&gt;&lt;P&gt;&amp;nbsp;&amp;nbsp;&amp;nbsp; if (!nextInt) {&lt;/P&gt;&lt;P&gt;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp; nextInt = highestValue; &lt;/P&gt;&lt;P&gt;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp; } &lt;/P&gt;&lt;P&gt;col = breakData.breaks&lt;J&gt;.color; &lt;/J&gt;&lt;/P&gt;&lt;P&gt;color = new Color(col);&lt;/P&gt;&lt;P&gt;sym = new SimpleFillSymbol(SimpleFillSymbol.STYLE_SOLID, polyOutlineSymbol, col); &lt;EM&gt;//polyOutlineSymbol defined earlier as a thin gray line&lt;/EM&gt;&lt;/P&gt;&lt;P&gt;br.addBreak(int, nextInt, sym);&lt;/P&gt;&lt;P&gt;}&lt;/P&gt;&lt;P&gt;featureLayer.setRenderer(br);&lt;/P&gt;&lt;P&gt;featureLayer.redraw();&lt;/P&gt;&lt;P&gt;var legend = new Legend({&lt;/P&gt;&lt;P&gt;map: map, layerInfos: [{&lt;/P&gt;&lt;P&gt;"layer": featureLayer, "title": "Value" }]&lt;/P&gt;&lt;P&gt;},"legend");&lt;/P&gt;&lt;P&gt;legend.startup();&lt;/P&gt;&lt;P&gt;&lt;/P&gt;&lt;P&gt;I get an error: &lt;SPAN class="objectBox-errorMessage objectBox hasTwisty hasBreakSwitch opened"&gt;&lt;SPAN class="errorMessage"&gt;&lt;EM&gt;TypeError: b.color.toRgba is not a function &lt;/EM&gt;during the legend creation.&lt;/SPAN&gt;&lt;/SPAN&gt;&lt;/P&gt;&lt;P&gt;&lt;SPAN class="objectBox-errorMessage objectBox hasTwisty hasBreakSwitch opened"&gt;&lt;SPAN class="errorMessage"&gt;&lt;/SPAN&gt;&lt;/SPAN&gt;&lt;/P&gt;&lt;P&gt;&lt;SPAN class="objectBox-errorMessage objectBox hasTwisty hasBreakSwitch opened"&gt;&lt;SPAN class="errorMessage"&gt;The map displays correctly, with the classification and colors as defined.&amp;nbsp; I assume the legend doesn't like the way I formatted the color for my symbology?&amp;nbsp; There seems to be lots of variations on defining your color, hex, rgb, rgba.&lt;BR /&gt;&lt;/SPAN&gt;&lt;/SPAN&gt;&lt;/P&gt;&lt;/BODY&gt;&lt;/HTML&gt;</description>
      <pubDate>Thu, 07 Aug 2014 15:01:19 GMT</pubDate>
      <guid>https://community.esri.com/t5/arcgis-javascript-maps-sdk-questions/legend-doesn-t-recognize-how-color-is-formatted/m-p/556157#M51879</guid>
      <dc:creator>TracySchloss</dc:creator>
      <dc:date>2014-08-07T15:01:19Z</dc:date>
    </item>
    <item>
      <title>Re: Legend doesn't recognize how color is formatted</title>
      <link>https://community.esri.com/t5/arcgis-javascript-maps-sdk-questions/legend-doesn-t-recognize-how-color-is-formatted/m-p/556158#M51880</link>
      <description>&lt;HTML&gt;&lt;HEAD&gt;&lt;/HEAD&gt;&lt;BODY&gt;&lt;P&gt;Found it!&lt;/P&gt;&lt;P&gt;&lt;/P&gt;&lt;P&gt;When specifying the color in my symbology, I was using just the hex value.&amp;nbsp; I should have been defining a color based on the hex value instead. &lt;/P&gt;&lt;TABLE&gt;&lt;TBODY&gt;&lt;TR&gt;&lt;TD&gt;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp; &lt;/TD&gt;&lt;TD&gt;color = new Color(col);&lt;/TD&gt;&lt;/TR&gt;&lt;TR&gt;&lt;TD&gt;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp; &lt;/TD&gt;&lt;TD&gt;sym = new SimpleFillSymbol(SimpleFillSymbol.STYLE_SOLID, polyOutlineSymbol, color);&lt;/TD&gt;&lt;/TR&gt;&lt;/TBODY&gt;&lt;/TABLE&gt;&lt;/BODY&gt;&lt;/HTML&gt;</description>
      <pubDate>Thu, 07 Aug 2014 15:13:56 GMT</pubDate>
      <guid>https://community.esri.com/t5/arcgis-javascript-maps-sdk-questions/legend-doesn-t-recognize-how-color-is-formatted/m-p/556158#M51880</guid>
      <dc:creator>TracySchloss</dc:creator>
      <dc:date>2014-08-07T15:13:56Z</dc:date>
    </item>
  </channel>
</rss>

