arcgis jsapi接口入门系列(8):鼠标在地图画面
初始化,每个map执行一次
PS:画点也差不多,都是用SketchViewModel,因此本demo没有专门写画点的
drawPolygonInit: function () {
//画几何对象初始化
//新建一个图形图层用于存放画图过程中的图形
let layer = new this.apiInstance.GraphicsLayer({
//空间参考,一般要跟地图的一样
spatialReference: this.mapView.spatialReference,
});
//图层添加到地图
//PS:GraphicsLayer也是图层之一,因此也支持通用的图层功能
this.map.add(layer);
//new SketchViewModel,此对象用于画图
this.sketchPolygon = new this.apiInstance.SketchViewModel({
//mapView
view: this.mapView,
//一个图形图层
layer: layer,
polygonSymbol: {
type: "simple-fill", // autocasts as new SimpleMarkerSymbol()
color: "rgba(138,43,226, 0.8)",
style: "solid",
outline: { // autocasts as new SimpleLineSymbol()
color: "white",
width: 1
}
}
});
//绑定create-complete事件,新增画图完成时会触发
this.sketchPolygon.on("create-complete", function (event) {
//画的几何对象类型,值同开始画的create方法的参数1
let drawGeometryType = event.tool;
//画的结果的几何对象
//PS:画完后SketchViewModel创建的图形会消失,因此如果要在画完后还要显示在地图上,就要另外再编码画在地图上,SketchViewModel只会提供画的结果的几何对象
let geometry = event.geometry;
//样式
//PS:其他高级样式配置请看样式的章节
let style = {
//线颜色
color: [50, 205, 50, 0.3],
outline: {
color: [255, 0, 0],
width: 1
}
};
let graphic = mapUtil.geometry.polygonToPolygonGraphic(this.apiInstance, geometry, style, this.mapView.spatialReference, null);
//把图形添加到地图的图形集合
//PS:图形要在地图上显示,可以添加到两种地方。一是mapView的graphics,这是地图的图形容器。第二是创建图形图层(GraphicsLayer),然后把图形加入到图层里
this.mapView.graphics.add(graphic);
}.bind(this));
//
// //绑定update-complete事件,编辑画图完成时会触发
// this.sketchPolyline.on("update-complete", function (event) {
// //画的结果的几何对象
// //PS:画完后SketchViewModel创建的图形会消失,因此如果要在画完后还要显示在地图上,就要另外再编码画在地图上,SketchViewModel只会提供画的结果的几何对象
// let geometry = event.geometry;
//
// //后续代码略。。。
// }.bind(this));
},
开始画面
drawPolygon: function () {
//开始画面
//参数1:画的几何类型,有值:point=点 | multipoint=多点 | polyline=线 | polygon=面 | rectangle=矩形 | circle=原型
this.sketchPolygon.create("polygon");
},
arcgis jsapi接口入门系列(8):鼠标在地图画面的更多相关文章
- arcgis jsapi接口入门系列(0):总览
开发环境: arcgis jsapi版本4.9 由于我们这套代码是基于vue,webpack开发的,会有少数vue代码,但总体不影响 里面还有些我们公司的js库和html css,给出的代码不能百分百 ...
- arcgis jsapi接口入门系列(5):几何(点线面)基本操作
点 point: function () { //通过wkt生成点 //wkt,代表点的坐标 let wkt = "POINT(113.566806 22.22445)"; //w ...
- arcgis jsapi接口入门系列(3):各种类型的图层添加
这里说的tomcat切片,是指arcgis server切片后,把切片图片文件用tomcat发布(其他任意web服务器发布都行) //添加tomcat切片图层 addTomcatTileLayer: ...
- arcgis jsapi接口入门系列(2):图层基础操作
//图层相关demo layerFun: function () { //获取地图的所有图层(不包括的图层类型:底图图层(basemaps)) let layers = this.map.layers ...
- arcgis jsapi接口入门系列(7):鼠标在地图画线
初始化,每个map执行一次就行 drawPolylineInit: function () { //画几何对象初始化 //新建一个图形图层用于存放画图过程中的图形 let layer = new th ...
- arcgis jsapi接口入门系列(10):图形高亮
jsapi也有提供高亮的实现接口,但这里没用,而用的是一种改变图形(graphic)样式的思路 本文实现效果是:地图有多个面图形,当鼠标移动到面的上方,面高亮显示,鼠标移出后高亮解除 初始化 //高亮 ...
- arcgis jsapi接口入门系列(9):可以同时显示多个的地图popup
jsapi有提供popup功能,但缺点很多,例如地图上只能同时显示一个popup,popup内容有限制等 本文提供另一个方法,原理不用jsapi,在地图外用一个普通的div放在地图上面,再监听地图的鼠 ...
- arcgis jsapi接口入门系列(4):用代码在地图画点线面
PS:用代码画点这样写是为了跟后面的用鼠标画点线面区分出来 画点 drawPointGraphic: function () { //点有多种样式:一般的点,显示文字,显示图片 //一般的点 let ...
- arcgis jsapi接口入门系列(6):样式
symbol: function () { //线样式 //样式详情请看官方文档 let style = { //线颜色,支持多种格式: //CSS color string:例如"dodg ...
随机推荐
- C++之面向对象初探----对象管理模型(关键是this指针)
前言 c++对象模型可以概括为以下2部分 1.语言中直接支持面向对象程序员设计部分,主要涉及如构造函数.析构函数.虚函数.继承(单继承.多继承.虚继承).多态等待. 2.对于各种支持的底层实现机制 在 ...
- Linux whereis 搜索命令位置
在学习 兄弟连 linux教学视频 的时候,我将所学的 linux 命令记录在我的博客中,方便自己查阅. 文件搜索命令: whereis 基础的命令 命令名称:whereis 命令的所在路径:/usr ...
- Lightoj 1082【RMQ】
这里很low地写了个线段树... #include <bits/stdc++.h> using namespace std; typedef long long LL; const int ...
- 51nod 1413
思路: 直接在串里找个最大的值就好了: #include <cstdio> #include <cstring> #include <cstdlib> #inclu ...
- P4593 [TJOI2018]教科书般的亵渎(拉格朗日插值)
传送门 首先所有亵渎的张数\(k=m+1\),我们考虑每一次使用亵渎,都是一堆\(i^k\)之和减去那几个没有出现过的\(j^k\),对于没有出现过的我们可以直接快速幂处理并减去,所以现在的问题就是如 ...
- MySQL 派生表(Derived Table) Merge Optimization
本文将通过演示告诉你:MySQL中派生表(Derived Table)是什么?以及MySQL对它的优化. Background 有如下一张表: mysql> desc city; +------ ...
- Vue.js实战
指令 什么是指令 指令,directives,是vue非常常用的功能,在template里. 都是以v-开头 不是自己所为html元素,比如假设指令叫v-abc,没有这种写法,这是组件(compone ...
- 干货:排名前16的Java工具类
在Java中,工具类定义了一组公共方法,这篇文章将介绍Java中使用最频繁及最通用的Java工具类.以下工具类.方法按使用流行度排名,参考数据来源于Github上随机选取的5万个开源项目源码. 一. ...
- mysql驱动包下载
- 10M光纤与下载速度KB/s、MB/s的换算
我们经常听说谁开的宽带是4M或10M或20M等等.那这和我们所说的网速“多少MB/s”.“多少KB/s”等同吗? 其实这不是一个概念. 在宽带运营商那里开的宽带,比如4M,其实是说4M bit/s,即 ...