My app uses simple javascript to control basic map location, zoom, etc. This works fine with several map service providers but I'm having trouble with ArcGIS. It seems I can't access the view. I'm wondering if the 'require' is somehow involved or if it's some other a basic error. The code is loaded in a browser control but is unresponsive. Simply double clicking the html file displays the starting map as expected.
<link rel="stylesheet" href="https://js.arcgis.com/4.16/esri/themes/light/main.css" />
<script src="https://js.arcgis.com/4.16/"></script>
<script>
require(["esri/Map", "esri/views/MapView"], function (Map, MapView) {
var zoomlevel = 14;
var ready = false;
var map = new Map({
basemap: "topo"
});
var view = new MapView({
container: "viewDiv", // Reference to the view div created below
map: map, // Reference to the map object created before the view
zoom: 14, // Sets zoom level based on level of detail
center: [-78.25, 37.375], // Sets center point of view using longitude,latitude
ui: { components: ["attribution"] } // exclude zoom widget from default ui
});
view.when(function () {
// All the resources in the MapView and the map have loaded. Now execute additional processes
ready = true;
}, function (error) {
// Error handling
});
// Unresponsive methods
function IsReady() {
return ready;
}
function Up(ctrlkey) {
if (zoomlevel > 9) zoomlevel = zoomlevel - 1; /* 9 to 18 */
if (ctrlkey) {
if (zoomlevel > 9) zoomlevel = zoomlevel - 1;
}
view.zoom = zoomlevel;
}
// Down
function GetRight() {
return view.extent.xmax;
}
//Left, etc.
function SnapTo(lat, lon) {
view.center = [lon, lat];
}
});
</script>
