1

I am trying to allow the user to select a series of aerial basemaps from the dropdown menu on the CMV map. The aerials however are in a different projections than the default basemap, i.e., satellite, streets, osm... I have struggled with this for a while and tried to avoid asking for help but I searched through various posts with no resolve. The dropdown shows the maps but do not load, I'm banking on that the projections are the issue.

Can anyone provide input on how this is done?

I created a new variable (shown below) and tried to center in mapOptions to newPoint but didnt work. Below is the code from the viewer.js and basemap.js.

var newPoint = new esri.geometry.Point(3584430.121, 525261.384, new esri.SpatialReference({ wkid: 3452 })); ... center: newPoint  

In viewer.js

<!-- language: lang-js -->

    define([
    'esri/units',
    'esri/geometry/Extent',
    'esri/config',
    'esri/tasks/GeometryService',
    'esri/layers/ImageParameters',
    'gis/plugins/Google',
    'dojo/i18n!./nls/main',
    'esri/dijit/Basemap',
    'esri/dijit/BasemapLayer',
    'esri/geometry/Point',
    'dojo/topic'
  ], 
<!-- language: lang-js -->

    function (units, Extent, esriConfig, GeometryService, ImageParameters, GoogleMapsLoader,i18n, Basemap, BasemapLayer, POINT, topic)
    {

    // url to your proxy page, must be on same machine hosting you app. See proxy folder for readme.
    esriConfig.defaults.io.proxyUrl = 'proxy/proxy.ashx';
    esriConfig.defaults.io.alwaysUseProxy = false;

    // url to your geometry server.
    esriConfig.defaults.geometryService = new GeometryService('https://tasks.arcgisonline.com/ArcGIS/rest/services/Geometry/GeometryServer');

    // Use your own Google Maps API Key.
    // https://developers.google.com/maps/documentation/javascript/get-api-key
    GoogleMapsLoader.KEY = 'NOT-A-REAL-API-KEY';

    function buildImageParameters (config) {
        config = config || {};
        var ip = new ImageParameters();
        //image parameters for dynamic services, set to png32 for higher quality exports
        ip.format = 'png32';
        for (var key in config) {
            if (config.hasOwnProperty(key)) {
                ip[key] = config[key];
            }
        }
        return ip;
    }

    return {
        // used for debugging your app
        isDebug: true,

        //default mapClick mode, mapClickMode lets widgets know what mode the map is in to avoid multipult map click actions from taking place (ie identify while drawing).
        defaultMapClickMode: 'identify',
        // map options, passed to map constructor. see: https://developers.arcgis.com/javascript/jsapi/map-amd.html#map1
        mapOptions: {
            basemap: 'satellite',
            center: [-90.382370, 29.911553],
            zoom: 12,
            logo: false,
            sliderStyle: 'small'
        },

In basemap.js

<!-- language: lang-js -->

    define([
    'esri/dijit/Basemap',
    'esri/dijit/BasemapLayer',
    'esri/layers/osm'
], 
<!-- language: lang-js -->

    function ( Basemap, BasemapLayer, osm) {
    return {
        map: true, // needs a refrence to the map
        mode: 'custom', //must be either 'agol' or 'custom'
        title: 'Basemaps', // tilte for widget
        mapStartBasemap: 'satellite', // must match one of the basemap keys below

        // TODO Is this array necessary when the same keys are explicitly included/excluded below?
        basemapsToShow: ['satellite', 'hybrid', 'lightGray', 'Aerial2017', 'Aerial2018'],
        basemaps: {
           satellite: {
                title: 'Satellite',
                basemap: new Basemap({
                    id: 'satellite',
                    layers: [new BasemapLayer({
                        url: 'http://services.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer'
                    })]
                })
            },
            hybrid: {
                title: 'Hybrid',
                basemap: new Basemap({
                    id: 'hybrid',
                    layers: [new BasemapLayer({
                        url: 'http://services.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer'
                    }), new BasemapLayer({
                        url: 'http://services.arcgisonline.com/ArcGIS/rest/services/Reference/World_Boundaries_and_Places/MapServer',
                        isReference: true,
                        displayLevels: [0, 1, 2, 3, 4, 5, 6, 7]
                    }), new BasemapLayer({
                        url: 'http://services.arcgisonline.com/ArcGIS/rest/services/Reference/World_Transportation/MapServer',
                        isReference: true,
                        displayLevels: [8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19]
                    })]
                })
            },
            lightGray: {
                title: 'Light Gray Canvas',
                basemap: new Basemap({
                    id: 'lightGray',
                    layers: [new BasemapLayer({
                        url: 'http://services.arcgisonline.com/ArcGIS/rest/services/Canvas/World_Light_Gray_Base/MapServer'
                    }), new BasemapLayer({
                        url: 'http://services.arcgisonline.com/ArcGIS/rest/services/Canvas/World_Light_Gray_Reference/MapServer',
                        isReference: true
                    })]
                })
            },
            Aerial2017: {
                title: 'Aerial 2017', //appears as basemap title in Gallery
                basemap: new Basemap({
                    id: 'Aerial2017',
                    layers: [new BasemapLayer({
                        url: 'https://example.com/geoserver/rest/services/AERIALS/Aerials2017/MapServer/'
                    })]
                })
            },
            Aerial2018: {
                title: 'Aerial 2018', //appears as basemap title in Gallery
                basemap: new Basemap({
                    id: 'Aerial2018',
                    layers: [new BasemapLayer({
                        url: 'https://example.com/geoserver/rest/services/AERIALS/Aerials2018/MapServer/'
                    })]
                })
            }
        }
    };
});

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Browse other questions tagged or ask your own question.