arcgis for js学习之Draw类

<!DOCTYPE html>

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>

    <title>Draw类的详解</title>

    <meta charset="utf-8" />

    <!-- 绘图功能说明：

        draw类可以在地图中点击一点进行画点或者划线

        1、点击添加一个点。

        2、多个点的绘制双击添加最后一个点。

        3、多线段或者多边形点击添加顶点，双击添加最后一点。

        4、自由线和自由面开始按住鼠标左键绘制,放手绘完成。

        5、划线时点击开始，鼠标左键放开时结束。

         -->

    <!-- 构造函数：

        new Draw(map,options?)

         -->

    <!-- 常量：

        ARROW:画一个箭头

        CIRCLE:画一个圆

        ODWN_ARROW:指向下方的箭头

        ELLIPSE:画一个椭圆

        EXTENT:某一程度

        FREEHAND_POLYGON:徒手多边形

        FREEHAND_POLYLINE;徒手线

        LEFT_ARROW:向左的箭头

        LINE:一条线

        MULTI_POINT:多个点

        POINT:点

        POLYGON:多边形

        POLYLINE;折线

        RECTANGLE:矩形

        RIGHT-ARROW:一个箭头

        TRIANGLE:画一个三角形

        UP_ARROW:画一个箭头

         -->

    <!-- 属性：

        1、fillSymbol:多边形的样式

        2、lineSymbol:线的样式

        3、markerSymbol:点的样式

        4、respectDrawingVertexOrder:几个拓扑

         -->

    <!-- 方法：

        activate(geometryType,options):激活工具栏

        deactivate():关闭

        finishDrawing():完成绘制，onDrawEnd事件

        setFillSymbol(fillSymbol):设置填充样式

        setLineSymbol(lineSymbol):设置线的样式

        setMarkerSymbol(marjerSymbol):设置点的样式

        setRespectDrawingVertexOrder(set):设置是否修改多边形的几何拓扑

         -->

    <!-- 事件：

        draw-complete:绘制完成时触发

        draw-end:此事件被弃用

         -->

    <!-- 构造方法详情：

        new Draw(map,options?)

        options的属性：

        drawTime:设定时间绘制下一个点

        showTooltips:工具提示

        tolerance:宽容，徒手画时决定鼠标移动多远添加一个新点

        tooltipPffset:确定多远抵消鼠标指针的工具提示

         -->

    <script>

        //实例一：是否显示showTooltips

        require([

            "esri/map", "esri/toolbars/draw"

        ], function (Map, Draw) {

            var map = new Map();

            var toolbar = new Draw(map, {

                showTooltips: false

            });

        });

        //实例二：设置drawTime

        require(["esri/map", "esri/toolbars/draw"], function (Map, Draw) {

            var map = new Map();

            var toolbar = new Draw(map, {

                tooltipOffset: 20,

                drawTime: 90

            });

        });

        //实例三：激活 active(geometryType,options),进行画点

        require(["esti/toolbars/draw"], function (Draw) {

            var toolbar = new Draw();

            toolbar.active(Draw.POINT);

            toolbar.finishDraw();//完成绘制

        })

        //实例四：draw-end事件，返回类型为一个geometry对象

        require(["esri/toolbars/draw", "esri/graphic"], function (Draw, Graphic) {

            function createToolbar(map) {

                var toolbar = new Draw(map);

                toolbar.on("draw-end", addToMap);

            }

            function addToMap(evt) {

                var graphic = new Graphic(evt.geometry, symbol);

                map.graphics.add(graphic);

            }

        });

    </script>

</head>

<body>

</body>

</html>

arcgis for js学习之Draw类的更多相关文章

  1. arcgis for js学习之Graphic类

    arcgis for js学习之Graphic类 <title>Graphic类</title> <meta charset="utf-8" /> ...

  2. js学习（五）-全局函数和类内部函数区别

    //---------------------------js代码--------------------------- function User(){       //类成员的定义及构造函数 th ...

  3. Arcgis for Js之加载wms服务

    概述:本节讲述Arcgis for Js加载ArcgisServer和GeoServer发布的wms服务. 1.定义resourceInfo var resourceInfo = { extent: ...

  4. js学习之变量、作用域和内存问题

    js学习之变量.作用域和内存问题 标签(空格分隔): javascript 变量 1.基本类型和引用类型: 基本类型值:Undefined, Null, Boolean, Number, String ...

  5. 【Knockout.js 学习体验之旅】（2）花式捆绑

    本文是[Knockout.js 学习体验之旅]系列文章的第2篇,所有demo均基于目前knockout.js的最新版本(3.4.0).小茄才识有限,文中若有不当之处,还望大家指出. 目录: [Knoc ...

  6. 【Knockout.js 学习体验之旅】（1）ko初体验

    前言 什么,你现在还在看knockout.js?这货都已经落后主流一千年了!赶紧去学Angular.React啊,再不赶紧的话,他们也要变out了哦.身旁的90后小伙伴,嘴里还塞着山东的狗不理大蒜包, ...

  7. Backbone.js学习之一

    昨天一个我崇拜的朋友,徐飞送我一本名为<Backbone.js实战>书,让我心中狂喜,于是带着这份浓厚的兴趣,开始研究Backbone.js之路. 打开这本书的第一句话就很有哲理,“授人以 ...

  8. 数据可视化的优秀入门书籍有哪些,D3.js 学习资源汇总

    习·D3.js 学习资源汇总 除了D3.js自身以外,许多可视化工具包都是基于D3开发的,所以对D3的学习就显得很重要了,当然如果已经有了Javascript的经验,学起来也会不费力些. Github ...

  9. 我的three.js学习记录（二）

    通过上一篇文章我的three.js学习记录(一)基本上是入门了three.js,但是这不够3D,这次我希望能把之前做的demo弄出来,然后通过例子来分析操作步骤. 1. 示例 上图是之前做的一个dem ...

随机推荐

  1. [Swift]LeetCode35. 搜索插入位置 | Search Insert Position

    Given a sorted array and a target value, return the index if the target is found. If not, return the ...

  2. [Swift]LeetCode83. 删除排序链表中的重复元素 | Remove Duplicates from Sorted List

    Given a sorted linked list, delete all duplicates such that each element appear only once. Example 1 ...

  3. [Swift]LeetCode819. 最常见的单词 | Most Common Word

    Given a paragraph and a list of banned words, return the most frequent word that is not in the list ...

  4. [Swift]LeetCode859. 亲密字符串 | Buddy Strings

    Given two strings A and B of lowercase letters, return true if and only if we can swap two letters i ...

  5. websocket+rabbitmq实战

    1. websocket+rabbitmq实战 1.1. 前言   接到的需求是后台定向给指定web登录用户推送消息,且可能同一账号会登录多个客户端都要接收到消息 1.2. 遇坑 基于springbo ...

  6. c 编译器大全

    c 编译器大全 看了下nginx的auto/cc下的目录,nginx对多种c语言的编辑器都进行了支持.才知道c语言有那么多编辑器. 编译器原理 所谓编译器,就是执行下面的三步骤: 1 将目标语言转换为 ...

  7. hexo配置自己的博客站点

    最近业余时间利用hexo为自己搭建一个高度自定义的个人站点,站点发布在github上,访问地址为:https://cqhaibin.github.io/.本博客简单介绍实现此站点的过程.效果图如下 构 ...

  8. Event（事件）的传播与冒泡

    特性说明和原理图: 标准浏览器和Ie9+浏览器都支持事件的冒泡和捕获,而IE8-浏览器只支持冒泡 标准和Ie9+浏览器用stopPropagation()或cancelBubble阻止事件传播,而ie ...

  9. Config ConnectionStrings

    <connectionStrings> <add name ="MyschoolConnectionString" connectionString =" ...

  10. 带着新人学springboot的应用03（springboot+mybatis+缓存 下）

    springboot+mybatis+缓存,基本的用法想必是会了,现在说一说内部大概的原理. 稍微提一下mybatis,只要导入了mybatis的依赖,那么有个自动配置类就会生效,你可以去mybati ...