Adding Custom Basemap in Basemap Gallery Widget

Den-GIS — Mon, 18 Jun 2018 09:58:47 GMT

I'm trying to add custom basemap from organisation ArcGIS Server in the ESRI Basemap Gallery Widget. I cannot get it to work although my custom basemap has a same spatial reference (wkid:100102 (3857)) as ESRI Basemaps.

Has anybody Idea what I'm doing wrong?

Thanks

<!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></title>

      <link rel="stylesheet" href="https://community.esri.com//js.arcgis.com/3.24/dijit/themes/claro/claro.css">
      <link rel="stylesheet" href="https://community.esri.com//js.arcgis.com/3.24/esri/css/esri.css">
      <style>
        html, body { height: 100%; width: 100%; margin: 0; padding: 0; }
        #map{
          padding:0;
        }
      </style>

      <script src="//js.arcgis.com/3.24/"></script>
      <script>
        var map;
        require([
          "esri/map", "esri/dijit/BasemapGallery", "esri/arcgis/utils",
          "dojo/parser",
          "esri/dijit/BasemapLayer", "esri/dijit/Basemap",
          "dijit/layout/BorderContainer", "dijit/layout/ContentPane", "dijit/TitlePane",
          "dojo/domReady!"
        ], function(
          Map, BasemapGallery, arcgisUtils,
          parser, BasemapLayer, Basemap
        ) {
          parser.parse();

          map = new Map("map");

       var basemaps = [];

          var customBasemapLayer = new BasemapLayer({
            url: "https://organisationServer/arcgis/rest/services/folder/MapServer"
          });
          var customBasemap = new Basemap({
            layers: [customBasemapLayer],
            title: "custom Basemap",
            thumbnailUrl: "images/basemap.png"
          });
          basemaps.push(customBasemap);

          var worldImageryLayer = new BasemapLayer({
            url: "http://services.arcgisonline.com/arcgis/rest/services/World_Imagery/MapServer"
          });
          var satelliteBasemap = new Basemap({
            layers: [worldImageryLayer],
            title: "Satellite",
            thumbnailUrl: "images/satellite.png"
          });
          basemaps.push(satelliteBasemap);


          var basemapGallery = new BasemapGallery({
            showArcGISBasemaps: true,
            basemaps: basemaps,
            map: map
          }, "basemapGallery");
          basemapGallery.startup();


          basemapGallery.on("error", function(msg) {
            console.log("basemap gallery error: ", msg);
          });

        });
      </script>
    </head>

    <body class="claro">
      <div data-dojo-type="dijit/layout/BorderContainer"
           data-dojo-props="design:'headline', gutters:false"
           style="width:100%;height:100%;margin:0;">

        <div id="map"
             data-dojo-type="dijit/layout/ContentPane"
             data-dojo-props="region:'center'"
             style="padding:0;">

          <div style="position:absolute; right:20px; top:10px; z-Index:999;">
            <div data-dojo-type="dijit/TitlePane"
                 data-dojo-props="title:'Switch Basemap', closable:false, open:false">
              <div data-dojo-type="dijit/layout/ContentPane" style="width:380px; height:280px; overflow:auto;">
                <div id="basemapGallery"></div>
              </div>
            </div>
          </div>

        </div>
      </div>
    </body>

    </html>

Re: Adding Custom Basemap in Basemap Gallery Widget

RobertScheitlin__GISP — Mon, 18 Jun 2018 12:52:50 GMT

Denis,

Your Layer has to have the same WKID and tiling Scheme. So if your WKID is the same then your tiling scheme must not match.

Re: Adding Custom Basemap in Basemap Gallery Widget

Den-GIS — Tue, 19 Jun 2018 14:18:29 GMT

Robert,

Thanks for the hint. I got it to work now.

Denis

Re: Adding Custom Basemap in Basemap Gallery Widget

RobertScheitlin__GISP — Tue, 19 Jun 2018 14:43:22 GMT

Great.

Don't forget to mark this question as answered by clicking on the "Mark Correct" link on the reply that answered your question.

topic Adding Custom Basemap in Basemap Gallery Widget in ArcGIS JavaScript Maps SDK Questions

Adding Custom Basemap in Basemap Gallery Widget

Re: Adding Custom Basemap in Basemap Gallery Widget

Re: Adding Custom Basemap in Basemap Gallery Widget

Re: Adding Custom Basemap in Basemap Gallery Widget