Uncaught TypeError: Cannot read property 'toRgba' of null

2069
7
06-14-2017 08:13 AM
MichaelHamsa
Occasional Contributor

We're using the ArcGIS JavaScript API version 4.3 to integrate a web map into one of our web applications and we regularly get the following JavaScript error when the map is rendering, and none of the features from the feature layer get displayed. It will work one time, then it fails the next and it seems to be happening more consistently now.

Uncaught TypeError: Cannot read property 'toRgba' of null

at js.arcgis.com/4.3/esri/views/MapView.js:414

Any ideas on what may be causing this error?

Thanks,

Mike...

0 Kudos
7 Replies
ThomasSolow
Occasional Contributor III

I'm not sure what's causing this.  It looks like toRgba is a function on 'esri/Color.'  So presumably at some point the API is expecting to get a color and gets null instead.  

Are you able to provide the web map in question in a sample?  I'd be happy to take a look at it.

0 Kudos
MichaelHamsa
Occasional Contributor

Thomas.

Most certainly - what information do you need to get access to it? I can provide the Id of the web map, if that helps.

Thanks,

mike...

0 Kudos
ThomasSolow
Occasional Contributor III

If the web map is an arcgis online item and the map is shared, the id should be enough.

0 Kudos
MichaelHamsa
Occasional Contributor

Thomas,

Should be good - the ID is: b13951db59b4420d8d05a02a8ed58d28

Again, we're using the JavaScript API to embed this map in one of our web applications, and at certain times the features on the map are not getting displayed; we're getting this error instead.

We've been able to reproduce this in all the major browsers.

Thanks again,

mike...

0 Kudos
ThomasSolow
Occasional Contributor III

After looking at the web map JSON for this webmap, I noticed what may be the source of this issue in the renderer;

              {
                "value": "Customer Owned",
                "symbol": {
                  "color": null, // color is null
                  "size": 0.75,
                  "angle": 0,
                  "xoffset": 0,
                  "yoffset": 0,
                  "type": "esriSMS",
                  "style": "esriSMSCircle",
                  "outline": {
                    "color": null, // color is null
                    "width": 0.75,
                    "type": "esriSLS",
                    "style": "esriSLSNull" // invalid style
                  }
                },
                "label": "Customer Owned"
              }

This is the symbol that is displayed for "customer owned" features.  I didn't see the error you mentioned when I loaded the map, but I also couldn't render this symbol in the legend widget, probably because the color is null and style of the outline is invalid.  I could easily see how this issue could cause the error that you ran into.

I think the best way to fix this is through whichever application was used to set up this renderer in the first place.  You can do this in the arcgisonline map viewer.

0 Kudos
MichaelHamsa
Occasional Contributor

Thomas,

Oh, I see - that would make perfect as to why it was happening inconsistently because there are not a lot of customer owned features, so when one would come into view, we'd get the error. If there wasn't one in view, it would draw fine. That certainly explains it.

Just for your info, I actually set this up with ArcGIS Online Portal - we didn't want the customer owned features to be displayed so I chose No Color for the fill and the outline since this was an option that was provided. I'll go back in and set up some colors and see if that resolve the problem.

0 Kudos
ThomasSolow
Occasional Contributor III

Yeah, this could be an error in how the JS API 4.3 interprets renderers.  I'm unsure if null is specified as a valid value for colors.  Apparently it's not if it's the cause of this error, but according to the agol web map viewer, it is a valid value.

0 Kudos