Vector map's styles/root.json file is not packaged correctly within a .vtpk (Vector Tile Package)

Question

Hello,

When I am creating an Offline Map Area for a vector map and download the .vtpk file, the p12/resources/styles/root.json file is always the same, it's the styles from the default Streets vector map.

This means that creating an Offline Map Area of the Streets (Night) map results in a light-themed map that is exactly the same as the normal Streets map.  It appears the sprites folder has the wrong .png and .json mapping file as well.  This results in Interstate/highway icons being incorrect.

Steps to reproduce:

1. Create an Offline Map Area of the Streets (Night) vector map that esri owns.

2. Go to the "Overview" tab of your map's detail page and run this browser bookmarklet

javascript&colon;void function(){(async()=>{const a=new URLSearchParams(window.location.search).get("id");if(!a)return void alert("No Web Map ID in URL. Only run this from the detail screen of a web map.");const b=(await esri.IdentityManager().checkSignInStatus(location.origin)).token,c=await fetch(`https://www.arcgis.com/sharing/rest/content/items/${a}/relatedItems%3Ff=json%26relationshipType=Map2Area%26token=${b}`),d=(await c.json()).relatedItems.map(a=>({id:a.id,name:a.title}));if(!d.length)return void alert("There are no map areas associated to this web map.");const e=open("","_blank");let f=d[0],g=f.name;if(1<d.length){if(g=e.prompt(`Enter the name of the map area you want to download:
${d.map(b=>b.name).join("
")}`,"")||"",!g)return void e.close();if(f=d.find(a=>a.name.toLowerCase()===g.toLowerCase()),!f)return e.alert(`Could not find map area with a name of: "${g}"`),void e.close()}const h=await fetch(`https://www.arcgis.com/sharing/rest/content/items/${f.id}/relatedItems%3Ff=json%26relationshipType=Area2Package%26token=${b}`),i=(await h.json()).relatedItems.find(a=>a.name.endsWith(".vtpk"));if(!i)return e.alert(`Could not find VTPK associated to map area with a name of: "${g}"`),void e.close();const j=new URL(window.location.href);j.hash="",j.searchParams.set("id",i.id),e.open(j.href,"_self")})()}();

3. A new tab should open and there is a Download button to get the .vtpk package.

4. Rename the .vtpk to a .zip file and unzip the package.

5. Open ./p12/resources/styles/root.json

The styles inside are all for the the Streets map and not Streets (Night).  If you download a .vtpk for both maps, the root.json files are identical.  The sprites as well.

Is this deliberate from Esri?  Do they only want us taking the Streets map offline?

-Bill

MarkBockenhauer · Accepted Answer

The basemap service has what I refer to as an internal style.  I call it an internal style as this is the style that gets put into a .vtpk when you take the tiles offline.   The other tile styles are external to the service.   The system can use these external styles with the .vtpk when taken offline.   If you use the .vtpk by itself the internal style will be used for rendering.  When used as part of a map with reference to the external styling in place the tiles will draw with the desired styling.

for Example with this tile layer

https://www.arcgis.com/home/item.html?id=8e848d9302e84dcba0de7aff8ac429dc

You can use

https://cdn.arcgis.com/sharing/rest/content/items/8e848d9302e84dcba0de7aff8ac429dc/resources/export?f=zip

to get a resource.zip file that contains the dark streetmap styling.  Notice the item ID is the same in both URLs.

If we look at a map area that has been taken offline we get the following content.

If we look at the .mmap we can see that for the basemap it has an itemPath referencing the folder with the resources.zip file (the Night styling)

Applications can show the desired styling when the itemPath is present with the resources.zip