zoukankan      html  css  js  c++  java
  • third application :Directions widget

    <!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>Directions Widget</title>
        <link rel="stylesheet" href="http://js.arcgis.com/3.13/dijit/themes/claro/claro.css">
        <link rel="stylesheet" href="http://js.arcgis.com/3.13/esri/css/esri.css">
        <style>
          html, body, #map {
            height:100%;
            width:100%;
            margin:0;
            padding:0;
          }
          body {
            background-color:#FFF;
            overflow:hidden;
            font-family:"Trebuchet MS";
          }
        </style>
    
        <script src="http://js.arcgis.com/3.13/"></script>
        <script>
          require([
            "esri/map", "esri/dijit/Directions", 
            "dojo/parser", 
            "dijit/layout/BorderContainer", "dijit/layout/ContentPane", "dojo/domReady!"
          ], function(
            Map, Directions,parser
          ) {
            parser.parse();
            
    
            var map = new Map("map", {
              basemap: "streets",
              center:[-98.56,39.82],
              zoom: 4
            });
    
            var directions = new Directions({
              map: map,
              routeTaskUrl: "http://sampleserver3.arcgisonline.com/ArcGIS/rest/services/Network/USA/NAServer/Route",
            },"dir");
            directions.startup();
          });
        </script>
      </head>
      <body class="claro">
        <div data-dojo-type="dijit/layout/BorderContainer" 
             data-dojo-props="design:'headline', gutters:false" 
             style="100%;height:100%;">
          <div data-dojo-type="dijit/layout/ContentPane" 
               data-dojo-props="region:'right'" 
               style="300px;height:600px;">
            
            <div id="dir"></div>
          </div>
          <div id="map" 
               data-dojo-type="dijit/layout/ContentPane" 
               data-dojo-props="region:'center'">
          </div>
        </div>
      </body>
    </html>
    parser.parse():
    dojo的parser会把html节点根据所声明的类型(data-dojo-type)转化为相应的dijit组件的template(dojo类型的节点),并且会给这些相应的template赋上对应的id,属性等等,并且把组件的id注册到dijit.registry里。在注册到registry的过程中,如果没有显式的指定id,则registry会生成一个自增的id赋值给相应的组件,如果显式的指定id,则使用指定的id。如果对同一节点多次parse操作,并且这些节点中有指定id的情况,就会出现你说的这种情况,报的错应该是Tried to register widget with id==xxx but that id is already registered。如果想分步加载并且多次parse,可以加载一个节点parse一个节点。或者在代码中调用dijit组件的startup方法也可实现parse的同样效果。

    startup():
  • 相关阅读:
    优化SQL查询:如何写出高性能SQL语句
    提高SQL执行效率的16种方法
    Spring Ioc DI 原理
    java内存泄漏
    转:js闭包
    LeetCode Best Time to Buy and Sell Stock III
    LeetCode Best Time to Buy and Sell Stock with Cooldown
    LeetCode Length of Longest Fibonacci Subsequence
    LeetCode Divisor Game
    LeetCode Sum of Even Numbers After Queries
  • 原文地址:https://www.cnblogs.com/tiandi/p/4420886.html
Copyright © 2011-2022 走看看