Extend MapImageLayer

432
5
Jump to solution
05-03-2020 09:22 PM
Ranga_Tolapi
Occasional Contributor II

I am looking for the possible ways to extend MapImageLayer to return a greyscale map image (using TypeScript). Or any other way to get the greyscale image from a map service? Any suggestions/samples please.

Your support is sincerely appreciated.

Rene RubalcavaMatt Driscoll Juan Carlos Franco Esri Technical Support

arcgis api for javascript 4.x‌ greyscale typescript mapimagelayer canvas

HTML5, CSS, JavaScript, and JavaScript Frameworks

0 Kudos
1 Solution

Accepted Solutions
Ranga_Tolapi
Occasional Contributor II

It's perfectly feasible with ArcGIS API for JavaScript v4.18 (and above), need to use effect property for MapImageLayer.

var layer = new MapImageLayer({
  url: "...",
  effect: "grayscale(100%)",
});

 

View solution in original post

5 Replies
TanuHoque
Esri Regular Contributor

Hi Ranga,

The source of a mapImage layer is always a dynamic map service. When dynamic map service is enabled with 'dynamicLayers' capability (which is the case by default since may be 10.3), a client can pass in a drawinInfo (i.e. renderer) in an export request to ask the map service to draw features using the drawingInfo client passes.

Please let me know if I misunderstood what you asked for.

Thanks.

Tanu

Ranga_Tolapi
Occasional Contributor II

Hi Tanu,

Thanks for the reply.

To elaborate, we got a colourful map service which is being used as a Basemap in our JavaScript based application. We got a new scenario where Basemap need to be shown also in Greyscale. We are exploring the possible and probably the best ways to achieve this.

Time being, we created an additional Greyscale map service. But don’t want to maintain 2 map services.

Note: We are not looking for solutions based out of CSS based filters for browser.

Thank you

Noah-Sager
Esri Regular Contributor

Tanu already explained how you can achieve this with the MapImageLayer, which is to override the default renderer.

Take a look at this example: MapImageLayer - set renderer on sublayers

Another option is just to use a light or dark gray vector basemap.

Ranga_Tolapi
Occasional Contributor II

Our custom Basemap contains 500+ layers including group layers, made with all type of geometries (Point, Line, Polygon and Annotation) and complex symbology was used. Can I apply “only color” through rendering across all the layers at once for every request to the MapImageLayer?

0 Kudos
Ranga_Tolapi
Occasional Contributor II

It's perfectly feasible with ArcGIS API for JavaScript v4.18 (and above), need to use effect property for MapImageLayer.

var layer = new MapImageLayer({
  url: "...",
  effect: "grayscale(100%)",
});

 

View solution in original post