How to add Nova Basemap to BasemapToggle

EvelynHernandez · ‎04-26-2018

Hey there,

im wondering if there is a way to put the new nova basemap in the basemap toggle, cuz i really like it.

I hope u guys can help me, its really appreciated.

Thanks in advice.

RobertScheitlin__GISP · ‎04-27-2018

Sure here is a sample:

<!DOCTYPE html>
<html>
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
  <meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no"/>
  <title>VectorTileLayer sample</title>
  <link rel="stylesheet" href="https://js.arcgis.com/3.24/esri/css/esri.css">
  <style>
    html, 
    body, 
    #map {
      height: 100%;
      width: 100%;
      margin: 0;
      padding: 0;
    }
  </style>
  <script src="https://js.arcgis.com/3.24/"></script>
  <script>
    require([
      "esri/map",
      "esri/layers/VectorTileLayer",
      "dojo/domReady!"
    ], function(Map, VectorTileLayer) {

      var map = new Map("map", {
        center: [2.3508, 48.8567], // longitude, latitude
        zoom: 2
      });

      //The URL referenced in the constructor may point to a style url JSON (as in this sample)
      //or directly to a vector tile service
      var vtlayer = new VectorTileLayer("http://www.arcgis.com/sharing/rest/content/items/75f4dfdff19e445395653121a95a85db/resources/styles/r...");
      map.addLayer(vtlayer);
    });
  </script>
</head>
<body>
  <div id="map"></div>
</body>
</html>‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍

View solution in original post

RobertScheitlin__GISP · ‎04-27-2018

Evelyn,

The process involves a few steps:

Select Groups in the arcgis.com banner.
Select ‘Create a Group’.
Complete the required fields (including Group members) and click ‘Save’.
In the ‘Search for Maps’ area, search for ‘NOVA’ (make sure to uncheck the option "Only search in Organization" on the left). This will display the NOVA basemap.
Click ‘Details’ for the Map you want to add to the Group.
Click ‘Share’ and select the Group that you created.
Now follow this link to add your group as your orgs default basemap gallery group: How To: Configure a default basemap in ArcGIS Online
Be sure to check "Share the Esri default basemaps to this group when you click Save"

Now you will see the NOVA basemap in your orgs basemap choices when you create a new web map.

EvelynHernandez · ‎04-27-2018

But there is a way to add it in a js application?

RobertScheitlin__GISP · ‎04-27-2018

Sure here is a sample:

<!DOCTYPE html>
<html>
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
  <meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no"/>
  <title>VectorTileLayer sample</title>
  <link rel="stylesheet" href="https://js.arcgis.com/3.24/esri/css/esri.css">
  <style>
    html, 
    body, 
    #map {
      height: 100%;
      width: 100%;
      margin: 0;
      padding: 0;
    }
  </style>
  <script src="https://js.arcgis.com/3.24/"></script>
  <script>
    require([
      "esri/map",
      "esri/layers/VectorTileLayer",
      "dojo/domReady!"
    ], function(Map, VectorTileLayer) {

      var map = new Map("map", {
        center: [2.3508, 48.8567], // longitude, latitude
        zoom: 2
      });

      //The URL referenced in the constructor may point to a style url JSON (as in this sample)
      //or directly to a vector tile service
      var vtlayer = new VectorTileLayer("http://www.arcgis.com/sharing/rest/content/items/75f4dfdff19e445395653121a95a85db/resources/styles/r...");
      map.addLayer(vtlayer);
    });
  </script>
</head>
<body>
  <div id="map"></div>
</body>
</html>‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍

ReneRubalcava · ‎04-27-2018

Do you mean in the BasemapToggle widget?

BaseMap Toggle

You don't get the thumbnail until it loads, but could load it yourself with the Basemap class.

RobertScheitlin__GISP · ‎04-27-2018

I completely missed the toggle portion of Her question...