<!DOCTYPE html><html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=7, IE=9, IE=10"/> <title>Create web map from JSON</title> <link rel="stylesheet" href="http://js.arcgis.com/3.6/js/dojo/dijit/themes/claro/claro.css"/> <link rel="stylesheet" href="http://js.arcgis.com/3.6/js/esri/css/esri.css" /> <link rel="stylesheet" href="css/layout.css"/> <script src="http://js.arcgis.com/3.6/"></script> <script> require([ "dojo/parser", "dojo/ready", "dijit/layout/BorderContainer", "dijit/layout/ContentPane", "dojo/dom", "esri/map", "esri/geometry/Extent", "esri/urlUtils", "esri/arcgis/utils", "esri/dijit/Legend", "esri/dijit/Scalebar", "esri/IdentityManagerBase", "esri/kernel", "dojo/domReady!" ], function ( parser, ready, BorderContainer, ContentPane, dom, Map, Extent, urlUtils, arcgisUtils, Legend, Scalebar, IMB, kernel ) { ready(function () { parser.parse(); var webmapId = "<INSERT WEBMAP ID HERE>"; var userId = "<INSERT USER ID HERE>"; var tokenStr = "<INSERT TOKEN HERE>"; var token = { "server": "http://www.arcgis.com/sharing/rest", "userId": userId, "token": tokenStr, "ssl": false, "expires": 7200 }; kernel.id.registerToken(token); arcgisUtils.createMap(webmapId, "map").then(function (response) { var map = response.map; //By default the extent will be that of the web map. Here we change it //to a custom extent. //add the scalebar var scalebar = new Scalebar({ map: map, scalebarUnit: "english" }); //add the legend. Note that we use the utility method getLegendLayers to get //the layers to display in the legend from the createMap response. var legendLayers = arcgisUtils.getLegendLayers(response); var legendDijit = new Legend({ map: map, layerInfos: legendLayers }, "legend"); legendDijit.startup(); }); }); }); </script> </head> <body class="claro"> <div id="mainWindow" data-dojo-type="dijit/layout/BorderContainer" data-dojo-props="design:'headline'" style="width:100%; height:100%;"> <div id="header" class="shadow roundedCorners" data-dojo-type="dijit/layout/ContentPane" data-dojo-props="region:'top'"> <div id="title"></div> <div id="subtitle"></div> </div> <div id="map" class="roundedCorners shadow" data-dojo-type="dijit/layout/ContentPane" data-dojo-props="region:'center'"></div> <div id="rightPane" class="roundedCorners shadow" data-dojo-type="dijit/layout/ContentPane" data-dojo-props="region:'right'" > <div id="legend"></div> </div> </div> </body></html>
A side note; The application needs to be owned by the same user as the web maps being accessed otherwise authentication will be granted.
サインインしたメンバーは投稿、更新のフォローなどができます。初めてですか?無料アカウントを登録してください。
Find useful guides, FAQs, and documents to help you navigate and make the most of Esri Community.