topic Re: How to Use ColorPicker in ArcGIS JavaScript API 4.12? in ArcGIS JavaScript Maps SDK Questions

Using ColorPicker in ArcGIS JavaScript API 4.12

JerryChen — Wed, 28 Aug 2019 06:50:44 GMT

I can only find ColorPicker in ArcGIS JavaScript API 3.X, but I'm working on a project using 4.12.

I'm trying to implement ColorPicker to my map to allow users to choose colors for Sketch objects.

I've included both 4.12 and 3.29 APIs in my code as well as required "esri/dijit/ColorPicker", then the website just turned into a blank white page. Obviously it doesn't work this way.

So, is there any other way to implement ColorPicker in a API v4.12 project?

Re: How to Use ColorPicker in ArcGIS JavaScript API 4.12?

BenElan — Wed, 28 Aug 2019 20:17:49 GMT

According to the Functionality matrix, ColorPicker is 'Coming soon' in 4x. Until then, there is not an Esri supported workflow to replicate this functionality.

That being said, you could use something like Spectrum to select a color and create symbology for the SketchViewModel

Re: How to Use ColorPicker in ArcGIS JavaScript API 4.12?

KristianEkenes — Wed, 28 Aug 2019 20:58:07 GMT

Hi Jerry,

The 4.x JS API will not add a ColorPicker widget. Instead, it will be implemented as a Calcite component, which will be used in Esri apps. This is currently being worked on. You can see the issue for tracking this work here: https://github.com/Esri/calcite-components/issues/64

We'll update the Functionality Matrix accordingly.

Re: How to Use ColorPicker in ArcGIS JavaScript API 4.12?

JerryChen — Thu, 29 Aug 2019 01:57:46 GMT

Thank you for your reply, but I still get blank page after I include the Spectrum CDN.

Is there any further requirement to implement Spectrum ColorPicker to ArcGIS API map?

Re: How to Use ColorPicker in ArcGIS JavaScript API 4.12?

JerryChen — Thu, 29 Aug 2019 02:24:19 GMT

The map shows after I put Spectrum CDN above the ESRI API script. But the ColorPicker is still a default text input box, and it's placed outside the map.

I'm so stuck on this. I've tried only the ColorPicker code on CodePen and it works perfectly, but not when I tried to place it on my map. What should I do to get the ColorPicker to work with the ArcGIS API?

Re: Using ColorPicker in ArcGIS JavaScript API 4.12

BenElan — Thu, 29 Aug 2019 15:33:54 GMT

Hi Jerry,

As I said, this isn't an Esri supported functionality so you will have to write some custom code to get it to work. You will need to change some css to get it over the map. You will also need to get the color selected in JavaScript and use that color to create your SketchViewModel.

Kristian stated that the ArcGIS JavaScript API 4.x will implement a Calcite component for color picking, so alternatively, you can wait for that to be released.