topic Re: How to use style-change event of VectorTileLayer in ArcGIS JavaScript Maps SDK Questions

How to use style-change event of VectorTileLayer

YukiOZAWA — Sat, 11 Dec 2021 22:03:15 GMT

VectorTileLayer class has style-change event.

This event don't fire even if change a style of VectorTileLayer using setStyle methods.

I want to use style-change event.

var map = new Map();

//make map view and bind it to the map
var view = new MapView({
  container: "viewDiv",
  map: map,
  center: [-100.33, 25.69],
  zoom: 10
});

var tileLyr = new VectorTileLayer({
  url: "http://www.arcgis.com/sharing/rest/content/items/3b8814f6ddbd485cae67e8018992246e/resources/styles/root.json"
});
map.add(tileLyr);

on(changeStyle, "click", function() {
  tileLyr.setStyle("http://www.arcgis.com/sharing/rest/content/items/103d0c867a9640e3a6d44224196de1fd/resources/styles/root.json");
});

tileLyr.on("style-change", function(){
  console.log("style changed");
});

Re: How to use style-change event of VectorTileLayer

Noah-Sager — Wed, 25 Nov 2015 22:50:18 GMT

Hi Yuki,

I was also not able to get the "style-change" event to fire using the setStyle method. This might be an issue with Beta 2, but I will do some more research.

In the meantime, it is possible to use .then() after the setStyle, because setStyle returns a promise. See fiddle below.

http://jsfiddle.net/noahs42/2z7pzu9f

Re: How to use style-change event of VectorTileLayer

YukiOZAWA — Thu, 26 Nov 2015 04:09:19 GMT

Hi Noah,

I was able to try your sample and use promise of setStyle.

Thanks so much.

Re: How to use style-change event of VectorTileLayer

KristianEkenes — Sat, 11 Dec 2021 22:03:17 GMT

Hi Yuki,

Yes, the 'style-change' event is not working in 4.0. We'll remove it from the documentation. You can use .then() as Noah suggested, or you can watch the style property on the layer like this:

tileLyr.watch("style", function(newStyle, formerStyle){
  console.log("style changed from ", formerStyle, " to ", newStyle);
});

Watching properties is discussed here: Working with properties | ArcGIS API for JavaScript