topic Re: Does VectorTileLayer support data-driven styles? in ArcGIS JavaScript Maps SDK Questions

Does VectorTileLayer support data-driven styles?

FayuLai — Fri, 05 Oct 2018 17:19:32 GMT

Hello,

I was reading the ArcGIS API for JavaScript version 4.9 documentation and have some questions.

Documentation details:
Page title: VectorTileLayer | API Reference | ArcGIS API for JavaScript 4.9
Page URL: https://developers.arcgis.com/javascript/latest/api-reference/esri-layers-VectorTileLayer.html

Does VectorTileLayer support data-driven styles? I want to set line color based on the values of “pipelength” property.

I try two ways as following, but neither works. Does ESRI have some specific format for VectorTileLayer data-driven style?

'line-color': {

"property": "pipelength",

"stops": [

[500, '#51bbd6'],

[1000, '#f28cb1']

]

}

'line-color': [

"step",

["get", "pipelength"],

"#51bbd6",

500,

"#f1f075",

1000,

"#f28cb1"

]

Re: Does VectorTileLayer support data-driven styles?

UndralBatsukh — Thu, 11 Oct 2018 20:30:00 GMT

Hi there,

Very short answer is yes.

Here are the requirements for the data driven styles: JS API started supporting data driven style starting at 3.23 and 4.6. The vector tiles must be created using ArcGIS Pro 2.1 and published with ArcGIS 10.6.

Search for vector tiles in the following doc to see what kind of data driven styles are supported for vector tiles.

What's new in ArcGIS Pro 2.1—ArcGIS Pro | ArcGIS Desktop

So if all requirements are met, then your first snippet should work. Expressions are not supported with vector tiles so the second snippet won't work.

Hope this helps,

-Undral

Re: Does VectorTileLayer support data-driven styles?

XingZhang1 — Fri, 12 Oct 2018 16:56:10 GMT

Hi Undral,

Thanks for your explanation! I'm Fayu Lai‌'s colleague from the same company.

I have two questions about this topic:

1. Do you have any plan to support Expressions for data-driven style of VectorTileLayer?

2. I followed your instructions and published a vector tiles using ArcGIS Pro 2.2:

https://tiles.arcgis.com/tiles/LjXACVRBffrUtGL8/arcgis/rest/services/Conduit/VectorTileServer

It has a Line layer called "ssGravityMain" which element color is based on "PipeLength" property.

I noticed it has similar style settings as you suggested:

"line-color":{"property":"PipeLength","default":"#000000","stops":[[-5,"#17F4F7"],[998.804,"#5719F4"],[2002.61,"#FF25F5"]]}

in its default styles:

https://tiles.arcgis.com/tiles/LjXACVRBffrUtGL8/arcgis/rest/services/Conduit/VectorTileServer/resources/styles/root.json

Everything works fine if I show it using built-in map view of ArcGIS Online.

But it doesn't work if I use ArcGIS API for JavaScript version 4.9. Here is a simple sample code:

https://codepen.io/anon/pen/WaEOJy

You can find "Bad buffer type 8" error message on Chrome console:

That is exactly the same error when I used the Fayu's first snippet before.

Thanks,

Xing

Re: Does VectorTileLayer support data-driven styles?

UndralBatsukh — Mon, 05 Nov 2018 21:42:47 GMT

Hi there,

I am really sorry it took me this long to reply. Somehow I did not see your post until today.

Answer to your first question is No. We do not have plans to support expressions for data-driven styles.

I logged an internal issue for your second question. It is definitely an issue.

Thanks,

-Undral

Re: Does VectorTileLayer support data-driven styles?

XingZhang1 — Wed, 07 Nov 2018 16:58:41 GMT

Hi Undral,

Thanks for your response!

I appreciate that the issue could be fixed. And I also hope the expressions support got implemented in future because it is very useful.

Thanks,

Xing