topic Re: Planetary computer tiles in ArcGIS JavaScript Maps SDK Questions

Planetary computer tiles

Karrok — Fri, 22 Jul 2022 09:24:12 GMT

I'm trying to figure out how can I use Planetary computer as a provider of tiles.

I found how can I get links for a particular region, but unfortunately, Planetary Computer has a different format of URLs that supported by WebTileLayer.

examples of URLs -

https://planetarycomputer.microsoft.com/api/data/v1/item/tiles/WebMercatorQuad/{z}/{x}/{y}@1x?collection=3dep-lidar-dsm&item=VA_UpperMiddleNeckQL2_B2_2018-dsm-2m-1-2&assets=data&nodata=-9999
https://planetarycomputer.microsoft.com/api/data/v1/item/tiles/WebMercatorQuad/{z}/{x}/{y}@1x?collection=3dep-lidar-dsm&item=VA_UpperMiddleNeckQL2_B2_2018-dsm-2m-1-1&assets=data&nodata=-9999

As you can see the only difference is "item", but seems that WebTileLayer works with subdomains only.

Can anyone recommend which layer to use or how I can tweak WebTileLayer to work not with subdomains.

I already tried:

let customTileLayer = WebTileLayer.createSubclass({ properties: { urlTemplate: "https://planetarycomputer.microsoft.com/api/data/v1/item/tiles/WebMercatorQuad/undefined/undefined/undefined@1x?collection=3dep-lidar-returns&item={subDomain}&assets=data&colormap_name=lidar-returns&nodata=-9999", subDomains: ['VA_UpperMiddleNeckQL2_B2_2018-dsm-2m-1-1', 'VA_UpperMiddleNeckQL2_B2_2018-dsm-2m-1-2'] }, getTileUrl: function (level: any, row: any, col: any) { return this.urlTemplate.replace("{z}", level).replace("{x}", col).replace("{y}", row); } });

but it is not working

Re: Planetary computer tiles

JohnGrayson — Fri, 22 Jul 2022 15:32:18 GMT

The WebTileLayer supports the zxy format so something like this should work:

let customTileLayer = new WebTileLayer({ urlTemplate: "https://planetarycomputer.microsoft.com/api/data/v1/item/tiles/WebMercatorQuad/{z}/{x}/{y}@1x?collection=3dep-lidar-returns&item=VA_UpperMiddleNeckQL2_B2_2018-dsm-2m-1-2&assets=data&colormap_name=lidar-returns&nodata=-9999" });

However, the service is returning this error:

No item 'VA_UpperMiddleNeckQL2_B2_2018-dsm-2m-1-2' found in '3dep-lidar-returns' collection

...so the URL parameters are not correct.

Re: Planetary computer tiles

Karrok — Mon, 25 Jul 2022 07:38:08 GMT

strange, I copied these names...

anyway, seems that I got a conception of WebTileLayer incorrectly, the intention of this layer is to load tiles from different subdomains in parallel, right?

But my intention was - to load tiles from different URLs for some particular boundary box and seems that I "found" a way how to do this, but this solution is working pretty bad so far

// tileObjects - array of objects with fields { bbox: number[]; link: string } let customTileLayer = BaseTileLayer.createSubclass({ properties: { urlTemplate: null }, getTileUrl: function (level: any, row: any, col: any) { let tileUrl = ''; const bounds = this.getTileBounds(level, row, col); // probably I missed something but getTileBounds() returns not lat/lon coordinates but a diffrent projection, like [-13227886.366918996, 4011415.244407987, -13208318.487677995, 4030983.123648987] let outSpatialReference = new SpatialReference({ wkid: 3857 }); tileObjects.forEach(tileObject => { // change coordinates projection const objBbox = self.extentToBbox(projection.project(self.bboxToExtent(tileObject.bbox), outSpatialReference)); // if tile boundary box belongs to boundary box of particular "item" in planetary computer collection if (self.rectanglesIntersect(objBbox, bounds) || self.rectanglesIntersect(bounds, objBbox)) { tileUrl = tileObject.link; } }); return tileUrl.replace("{z}", level).replace("{x}", col).replace("{y}", row); } });

Two more URLs to load items:

https://planetarycomputer.microsoft.com/api/data/v1/item/tiles/WebMercatorQuad/{z}/{x}/{y}@1x?collection=3dep-lidar-dtm-native&item=USGS_LPC_CA_LosAngeles_2016_LAS_2018-dtm_native-2m-1-9&assets=data&nodata=-9999
https://planetarycomputer.microsoft.com/api/data/v1/item/tiles/WebMercatorQuad/{z}/{x}/{y}@1x?collection=3dep-lidar-dtm-native&item=USGS_LPC_CA_LosAngeles_2016_LAS_2018-dtm_native-2m-1-10&assets=data&nodata=-9999

with tiles -

https://planetarycomputer.microsoft.com/api/data/v1/item/tiles/WebMercatorQuad/11/348/818@1x?collection=3dep-lidar-dtm-native&item=USGS_LPC_CA_LosAngeles_2016_LAS_2018-dtm_native-2m-1-9&assets=data&nodata=-9999
https://planetarycomputer.microsoft.com/api/data/v1/item/tiles/WebMercatorQuad/11/348/817@1x?collection=3dep-lidar-dtm-native&item=USGS_LPC_CA_LosAngeles_2016_LAS_2018-dtm_native-2m-1-10&assets=data&nodata=-9999

so, item names would be ['USGS_LPC_CA_LosAngeles_2016_LAS_2018-dtm_native-2m-1-9', 'USGS_LPC_CA_LosAngeles_2016_LAS_2018-dtm_native-2m-1-10']

I guess I need to work on math with fitting different "items" to each other(boundaries intersection).

If I'm wrong and you know a better way - let me know, please

Re: Planetary computer tiles

JohnGrayson — Mon, 25 Jul 2022 15:26:23 GMT

Correct, the data you're trying to load seems to represent two distinct datasets and the way to configure each one is via the URL parameters and not as part of the base URL, so you will need two different layers. It always helps is you have a simple CodePen or similar showing us what you're trying, that way we can better understand your issues.

Re: Planetary computer tiles

JohnGrayson — Mon, 25 Jul 2022 17:35:21 GMT

Not sure if this helps as I'm not familiar enough with this service, but here's an example of how you can extend the BaseTileLayer to access the service and use custom parameters:

https://codepen.io/john-grayson/pen/VwXWbjK