<!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. FreeMarker调用Java静态方法以及静态变量的方法

    这里介绍下在类似 Spring+FreeMarker 的架构中如何在FreeMarker中访问Java中的静态方法以及静态变量. 一.首先为了方便以及可复用我们创建一个工具类 /** * FreeMa ...

  2. easy_UI datagrid view数据格式化

    从数据库中提取的信息,有时候需要后期处理一下,easy_ui给了我们很好的一个方法,根据easy_ui生成datagridview的两种方式,下面用两种方式来格式化显示数据信息 1,通过脚本生成的da ...

  3. C/C++程序开发中实现信息隐藏的三种类型

    不管是模块化设计,还是面向对象设计.还是分层设计,实现子系统内部信息的对外隐藏都是最关键的内在要求.以本人浅显的经验,把信息隐藏依照程度的不同分成(1)不可见不可用(2)可见不可用(3)可见可用. 1 ...

  4. /dev/null简介

    在类Unix系统中,/dev/null,或称空设备,是一个特殊的设备文件,它丢弃一切写入其中的数据(但报告写入操作成功),读取它则会立即得到一个EOF[1]. 在程序员行话,尤其是Unix行话中,/d ...

  5. ios 关于collectionView.performBatchUpdates()方法 --时时更新

    今天想实现一个简单的collectionView动画效果,查阅相关资料发现,实现 collectionView.performBatchUpdates()方法即可,于是掉坑里了. 文档: public ...

  6. nyoj677 谍战

    本题能够说是最小割入门级题目. 假设能想到是最小割问题.那么建图思路便是水到渠成的事了. 加入一个源点S和汇点T: 把S与每一个间谍相连.容量为无穷大: 把城市N(即飞机场的位置)与汇点T相连.容量为 ...

  7. 第一篇：尽量多的以 const/enum/inline 替代 #define

    前言 在面向过程语言,如 C 语言中,#define 非常常见,也确实好用,值得提倡.但在如今面向对象的语言,如 C++ 语言中,#define 就要尽量少用了. 为何在 C++ 中就要少用了呢? 这 ...

  8. Architectural Styles and the Design of Network-based Software Architectures

    w Architectural Styles and the Design of Network-based Software Architectures  http://www.ics.uci.ed ...

  9. JavaScript-onerror事件:图片加载失败后不显示

    HTML: <img src="http://www.mazey.net/images/upload/image/20170518/1495122198180663.gif" ...

  10. js验证表单大全2

    屏蔽右键 很酷  oncontextmenu="return false" ondragstart="return false"onselectstart=&q ...