<!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="width:100%;height:100%;">

      <div data-dojo-type="dijit/layout/ContentPane"

           data-dojo-props="region:'right'"

           style="width: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（）：

third application :Directions widget的更多相关文章

  1. arcgis flexviewer中由Application向widget传值

    arcgis flexviewer所有的小部件类均继承自com.esri.viewer.BaseWidget基类,而BaseWidget又继承了com.esri.viewer.IBaseWidget接 ...

  2. ThinkPHP 3.2.3 Widget 扩展的使用

    ThinkPHP3.2.3 手册中 Widget 扩展的地址是: http://www.kancloud.cn/manual/thinkphp/1862 Widget 扩展一般用于页面组件的扩展,和自 ...

  3. Flutter常用组件（Widget）解析-Scaffold

    实现一个应用基本的布局结构. 举个栗子: import 'package:flutter/material.dart'; void main() => runApp(MyApp()); clas ...

  4. Flutter常用组件（Widget）解析-Container

    一个组件它往往包含了一些常见的painting, positioning和sizing这样的小部件. Container相当于我们常用的div,在Flutter中用的非常多,现在来看看Containe ...

  5. [Flutter] Creating, Importing & Using Dynamic Widgets from Other Files in a Flutter Application

    In this lesson we’ll learn how to import widgets we’ve created in other files & use them in our ...

  6. Flutter学习笔记（9）--组件Widget

    如需转载,请注明出处:Flutter学习笔记(9)--组件Widget 在Flutter中,所有的显示都是Widget,Widget是一切的基础,我们可以通过修改数据,再用setState设置数据(调 ...

  7. ThinkPHP 整合Bootstrap Ajax分页

    ThinkPHP Ajax分页代码 publicfunction index() { $where=array(); $name = I('name'); if(!empty($name)){ $wh ...

  8. 天津政府应急系统之GIS一张图（arcgis api for flex）讲解（十一）路径导航模块

    config.xml文件的配置如下: <widget label="路径导航" icon="assets/images/lujingdaohang.png" ...

  9. 【译】Android系统架构

    让我们来快速预览一下整个android系统的架构.从下面的图中我们可以发现,这个架构分为几个不同的层,底层为上一层提供服务.  Linux Kernel android系统建立在一个坚固的基石上:Li ...

随机推荐

  1. hibernate配置文件再写

    hibernate配置文件主要用于配置数据库连接和hibernate运行时所需的各种属性,每个hibernate配置文件对应一个Configuration对象,hibernate的配置文件有两种格式, ...

  2. JS判断不同的浏览器，不同的浏览器版本

    JS判断不同的浏览器,不同的浏览器版本

  3. python 面向对象三大特性(封装 多态 继承)

    今天我们来学习一种新的编程方式:面向对象编程(Object Oriented Programming,OOP,面向对象程序设计)注:Java和C#来说只支持面向对象编程,而python比较灵活即支持面 ...

  4. CSS基础4——使用CSS格式化元素内容的文本

    CSS的文本属性用于控制文本的段落格式,如设置首行缩进.段落对齐方式.字间距.行间距等. 1.设置文本首行缩进:text-indent 可选属性值包含: 长度 / 百分比 2.设置文本对齐方式:tex ...

  5. linux系统启动过程具体解释-开机加电后发生了什么 --linux内核剖析（零）

    本文參考了例如以下文章 深入理解linux启动过程 mbr (主引导记录(Master Boot Record)) 电脑从开机加电到操作系统main函数之前执行的过程 详细解释linux系统的启动过程 ...

  6. Unity3D学习笔记——Rigdbody刚体组件

    Rigdbody刚体组件:必须和碰撞体(Colliders)一起使用,否则会发生穿过的现象.碰撞体(Colliders)不是必须和刚体一起使用. 刚体的作用:使游戏物体能获得重力,接受外界的受力和扭力 ...

  7. CMake error:System Error:No such file or directory CMake error:Could not open file for write in copy operation xxxx.ros_Config.cmake.tmp.

    微型电脑或嵌入式与电脑还是有点不同的,在微型电脑上ros indigo 版本下利用catkin编译如果你遇到如下错误: CMake error:System Error:No such file or ...

  8. ASCII码表(0-255)

  9. Laravel5.1 路由 -基础

    什么是路由? 大K简单的说下,路由是用户访问我们程序的一个入口,比方说 你在浏览器输入:www.myblogs.com/create 就会打开一个页面,我们接收到这一个请求后后台需要做一些事儿来反馈给 ...

  10. Python动态网站的抓取

    网页下载器 # coding:utf-8import requestsimport urllib2import systype = sys.getfilesystemencoding()class H ...