ArcGIS for js SketchViewModel绘制点、线、面和圆(vue代码)

引入依赖(前提要加载地图):

import SketchViewModel from "@arcgis/core/widgets/Sketch/SketchViewModel.js";import GraphicsLayer from "@arcgis/core/layers/GraphicsLayer.js";

创建SketchViewModel对象:

// 创建GraphicsLayer
let graphicsLayer = new GraphicsLayer();
ToolsConfig.map.add(graphicsLayer);// 创建编辑工具
var sketchViewModel = new SketchViewModel({layer: graphicsLayer,view: ToolsConfig.view,activeFillSymbol:{type: "simple-fill",style: "solid",color: [255, 0, 0, 0.2],outline: {color: [255, 0, 0],width: 1}},snappingOptions: { enabled: true, featureSources: [{layer: graphicsLayer, enabled: true}]}
});

绘制图形方法:

// 绘制点 
//sketchViewModel.create("point", { "mode": "click" });// 绘制点线
//sketchViewModel.create("polyline", { "mode": "click" });// 绘制面 
sketchViewModel.create("polygon", { "mode": "click" });// 绘制圆
//sketchViewModel.create("circle", { "mode": "click" });

操作方法:

// 编辑
//sketchViewModel.updateOnGraphicClick = true;// 撤销
//sketchViewModel.undo();// 恢复
//sketchViewModel.redo();// 保存
//sketchViewModel.updateOnGraphicClick = false;
//sketchViewModel.cancel();

绑定事件:

绘制完执行函数:

//绘制图形绑定事件
sketchViewModel.on("create", onGraphicCreate);//绘制完执行函数
function onGraphicCreate(event) {if (event.state === "complete") {console.log(event)graphicsLayer.add(event.graphic);}}

编辑完执行函数:

//编辑图形绑定事件
sketchViewModel.on("update", onGraphicUpdate);//编辑完执行函数
function onGraphicUpdate(event) {const graphic = event.graphics[0];if (event.state === "complete") {console.log(graphic);}
}

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/pingmian/51461.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

dockerfile部署镜像 ->push仓库 ->虚拟机安装建木 ->自动部署化 (详细步骤)

目录 创建私服仓库 vi /etc/docker/daemon.json vim deploy.sh判断脚本内容 创建 建木 后端部署 命名空间 设置密码用户名 创建git仓库 gitignore文件内容 图形项目操作 git maven docker镜像 点击流程日志 vim /etc/docker/daemon.json 执行部署脚本 ip 开发…

【嵌入式英语教程--4】C语言中的控制结构

C语言中的控制结构 英文原文 Control structures in the C programming language allow you to control the flow of execution in your programs. This includes decision-making constructs like if, else, and switch, as well as looping constructs such as for, while,…

RuntimeError: No CUDA GPUs are available

RuntimeError: No CUDA GPUs are available 目录 RuntimeError: No CUDA GPUs are available 【常见模块错误】 【解决方案】 解决步骤如下: 欢迎来到英杰社区https://bbs.csdn.net/topics/617804998 欢迎来到我的主页,我是博主英杰,211科…

Redis:集群测试及删除key

集群性能测试: redis-benchmark -h localhost -p 6379 -c 100 -n 100000 其中代表100个并发连接,100000个请求,检测host为localhost 端口为6379的redis服务器性能 命令删除相关key: src/redis-cli -h 127.0.0.1 -p 6379 -a …

Spring 高级解析 07

文章目录 1. Spring 概述(基本情况)1.1 Spring 的优势1.2 Spring 的核⼼结构 2. 核⼼思想 IoC 和 AOP2.1 什么是IoC?2.2 什么是AOP2.3 AOP在解决什么问题 3. Spring IoC ⾼级应⽤3.1 BeanFactory与ApplicationContext区别3.1.1 BeanFactory3.…

Android虚假定位的实现与防护

Android中常用的定位方式 一,GPS定位 定义:全球卫星定位系统,直接和卫星交互,获取设备经纬度 优点: 走卫星通信通道,无需打开Wifi或流量就能获得位置信息 精确度最高,几米到几十米 缺点&a…

Java面试八股之Spring AOP 和 AspectJ AOP 的区别

Spring AOP 和 AspectJ AOP 的区别 Spring AOP 和 AspectJ AOP 是两种不同的面向切面编程(Aspect-Oriented Programming, AOP)实现。它们各有特点,适用于不同的场景。下面是一些主要的区别: 1. 实现机制 Spring AOP: 基于代理…

为Mac配置Alfred

参考资料: Alfred神器使用手册 | louis blogMacOS神器之Alfred workflow概览GitHub - arpir/Alfred-Workflows-Collection: 一些好用的 Alfred Workflow 一、修改快捷键 Spotlight的默认快捷键是Command Space Alfred的默认快捷键是Option Space 可以将Alfred和…

Alternating Sum

Problem - 963A - Codeforces 处理式子 显然中间式子是等比数列 // Problem: A. Alternating Sum // Contest: Codeforces - Tinkoff Internship Warmup Round 2018 and Codeforces Round 475 (Div. 1) // URL: https://codeforces.com/problemset/problem/963/A // Memory Lim…

DBMS-1.1 关系模型

关系数据库基本概念 一.关系 1.关系:关系数据库是由表的集合构成的,因此在关系数据库中,表又称为关系。 2.属性:表的每一列称为一个属性。 (1)一个有n个属性的关系,称为n元关系。 3.元组&…

awk用法

文章目录 一、awk工具awk工作原理AWK程序的结构awk内置变量 二、案例1.基础案列2.BEGIN END 运算3.数值与字符串的比较4.awk高级用法5. awk if语句6.BEGIN END 流程7.AWK 数组8.awk 循环 一、awk工具 awk工作原理 当读到第一行时,匹配条件,然后执行指定…

Mojo模型的端到端加密:数据安全的终极防线

Mojo模型的端到端加密:数据安全的终极防线 在数字化时代,数据安全已成为企业和个人最为关注的问题之一。Mojo模型,作为一个先进的数据处理框架,其端到端加密(E2EE)功能为数据传输提供了坚不可摧的安全保障…

【C++11】C++11新纪元:深入探索右值引用与移动语义

📝个人主页🌹:Eternity._ ⏩收录专栏⏪:C “ 登神长阶 ” 🤡往期回顾🤡:位图与布隆过滤器 🌹🌹期待您的关注 🌹🌹 ❀C11 📒1. C11简介…

【Qt】修改窗口的标题和图标

以下操作仅对顶层 widget(独⽴窗口),有效。 修改窗口的标题 一.windowTitle属性 1.概念 是一种在用户界面中显示窗口的标题的属性。它可以用来设置窗口的标题栏文本。 2.API API说明windowTitle()获取到控件的窗⼝标题.setWindowTitle(const QString& title)设置控件的…

10 BERT

目录 1 综述 1.1 BERT的核心思想 1.2 BERT的关键技术:预训练阶段 1.3 微调阶段 2 BERT的架构 2.1 输入处理 3. 特征选择/学习模块 BERT 的自注意力过程 4. 预训练任务:同时进行 4.1 Next Sentence Prediction (NSP) 4.2 Masked Language Model…

基于微信小程序+SpringBoot+Vue的网络安全科普系统(带1w+文档)

基于微信小程序SpringBootVue的网络安全科普系统(带1w文档) 基于微信小程序SpringBootVue的网络安全科普系统(带1w文档) 优质的网络安全科普系统不仅可以单纯的满足工作人员管理的日常工作需求,还可以满足用户的需求。可以降低工作人员的工作压力,提高效…

rust 初探 -- 常用的集合

rust 初探 – 常用的集合 Vector 存储在堆内存上的数据&#xff0c;运行时可以动态变大或者变小。 Vec 特性&#xff1a; 由标准库提供&#xff0c;可以存储多个相同类型的值&#xff0c;并且值在内存中连续存放 Vector 的创建 fn main() {// Vec::new()let v: Vec<i32…

Mojo模型的自动调参:深度学习优化的新境界

Mojo模型的自动调参&#xff1a;深度学习优化的新境界 深度学习模型的参数调优是提高模型性能的关键步骤之一&#xff0c;但同时也是一个耗时且复杂的过程。Mojo模型作为一个先进的深度学习框架&#xff0c;其设计理念包含了自动化调参的概念&#xff0c;以简化模型训练流程并…

2024.7.29 作业

1> 写一个日志文件&#xff0c;将程序启动后&#xff0c;每一秒的时间写入到文件中 #include <myhead.h> int main(int argc,const char *argv[]) {FILE *fp NULL;if((fpfopen("./log.txt","r"))NULL) {perror("open error1");return…