arcgis js api 4.X 自定义工具按钮
// All material copyright ESRI, All Rights Reserved, unless otherwise specified.
// See https://js.arcgis.com/4.10/esri/copyright.txt for details.
//>>built ; ;sdfsd sd;;;
define('esri/widgets/Widget esri/widgets/support/widget'.split(' '), function(Widget, widget) {
console.log("baseButtonWedgit")
var baseButtonWedgit = Widget.createSubclass({
constructor: function(options) {
if (options) {
dojo.mixin(this, options);
}
},
cancelGo: function() {},
go: function() {
alert('go go go');
},
_go: function() {
if (this.go) {
this.go.call(this,this);
}
},
getLable: function() {
return this.lable || '标题';
},
getTitle: function() {
return this.title || 'title';
},
getDivClass :function(){
return {};
},
getIconClass :function(){
return {};
},
render: function() {
var title = this.getTitle(this);
var lable = this.getLable(this);
var divClass = this.getDivClass(this);
var iconClass = this.getIconClass(this);
return widget.tsx(
'div',
{
bind: this,
class: this.classes('esri-home esri-widget--button esri-widget',divClass),
role: 'button',
tabIndex: 0,
onclick: this._go,
onkeydown: this._go,
'aria-label': lable,
title: title,
},
widget.tsx('span', {
'aria-hidden': 'true',
class: this.classes('esri-icon', iconClass),
innerText: this.title, }),
widget.tsx(
'span',
{
class: 'esri-icon-font-fallback-text',
},
'button'
)
);
},
});
return baseButtonWedgit;
});
/**
* 添加工具按钮
*/
this.addButtonWedgit = (options = {}) => {
// options.map = map;
// options.view = view;
const button = new BaseButtonWedgit(options);
view.ui.add(button, {
position: options.position || 'bottom-right',
});
return button;
};
const btn1 = this.pmap.addButtonWedgit({
go: (e) => {
const {domNode} = e;
console.log(domNode)
if (this.maptype === '3D') {
this.maptype = '2D';
self.setState({ is3D: false });
btn1.title = '二维地图'
btn1.set("title", '二维地图');
} else {
this.maptype = '3D';
btn1.title = '三维地图'
self.setState({ is3D: true });
}
},
getTitle:()=>this.maptype === '3D'?"二维地图":"三维地图" ,
getIconClass:()=>this.maptype === '3D'?{"esri-icon-2d":true}:{"esri-icon-3d":true}
});
btn1.set("title", '三维地图');
btn1.set("maptype", '2D');
btn1.set("buttonClass", 'buttonClass');
}

arcgis js api 4.X 自定义工具按钮的更多相关文章
- ArcGIS JS API使用PrintTask打印地图问题解决汇总
环境:来源于工作过程,使用的API是 arcgis js 3.* 3系API,4.*暂时没测试: 1.数据与打印服务跨域情况下,不能打印问题. 一般情况下,我们发布的数据服务和打印服务是在一台服务 ...
- 基于ArcGIS JS API的在线专题地图实现
0 引言 专题地图是突出而深入的表示一种或几种要素或现象,即按照地图主题的要求,集中表示与主题有关内容的地图.专题地图的专题要素多种多样,分类方法也多种多样,根据专题地图表现数据的特点可分为定 ...
- geoserver图层属性查询及查询结果转换为arcgis js api能使用的格式
一个项目使用了ArcGIS JS API开发GIS展示层,但GIS服务使用了Geoserver,这时加载Geoserver数据和查询数据就和之前完全不一样了,以下介绍下我使用ArcGIS JS API ...
- 关于ueditor与arcgis js api同用会报错的问题
在ueditor与arcgis js api共用时,需要将ueditor\third-party\zeroclipboard\ZeroClipboard.js中的 if (typeof define ...
- arcgis js api 本地化配置
配置arcgis library 根目录的init.js的 "baseUrl:",使其指向正确的地址
- Arcgis js API使用wmts方式加载GeoWebCache中的切片地图(转载)
使用GeoWebCache的主要目的是其独立安装版能够发布arcgis的切片.我们知道,使用openlayer是调用geoserver最方便的方法,那么在发布完arcgis的切片后,怎么用arcgis ...
- ArcGIS JS API多线程克里金插值
最近做关于雨量插值的项目,本来使用后台的GP工具做的,但是处理时间比较长需要十几秒钟左右,所以研究怎么通过前台来计算. 参考下克里金例子,思路是生成要计算区域的100乘以100网格,然 ...
- ArcGIS js api 手动构建FeatureLayer
坐标系 var spatialReference = new SpatialReference(4326);1要素坐标点 var pointArr = [ new Point(116.94431351 ...
- ArcGIS JS Api 4.x修改三维球背景技巧
通过修改scenceview.js中tileBackground和defaultTileBackground中的png的base64编码就可以达到要求. 4.8中通过修改scenceview. ...
随机推荐
- gsoap生成webservice调用客户端接口
1.下载gsoap2.8 2.运行 wsdl2h.exe -o XXX.h XXX.wsdl wsdl文件可以是本地文件,也可以是服务器的wsdl,比如http://192.168.0.122:333 ...
- mysql用查询结果当删除的判断条件进行删除报错1093 You can't specify target table解决方法
mysql用查询结果当删除的判断条件进行删除报错1093 You can't specify target table解决方法 #分开两个sql执行正常的语句,只保留最新1000条数据,删掉1000条 ...
- maven 学习---Maven快照
大型软件应用程序通常由多个模块组成,这是多个团队工作于同一应用程序的不同模块的常见场景.例如一个团队工作负责应用程序的前端应用用户接口工程(app-ui.jar:1.0)),同时他们使用数据服务工程( ...
- Android培训准备资料之Android开发环境的搭建
Android开发环境的搭建主要分为以下四步: (1)下载JDK并安装 (2)配置JDK环境变量 (3)下载安装Android Studio (4)配置Android SDK环境变量(可执行可不执行) ...
- [20190509]rman备份的疑问5.txt
[20190509]rman备份的疑问5.txt --//别人跟我提到的rman备份问题,我开始以为是assm与mssm的问题,实际测试情况不是.--//开始备份时生成的备份集文件很大,以后会回缩(对 ...
- MongoDB 4.X 用户和角色权限管理总结
关于MongoDB的用户和角色权限的梳理一直不太清晰,仔细阅读了下官方文档,并对此做个总结. 默认情况下,MongoDB实例启动运行时是没有启用用户访问权限控制的,也就是说,在实例本机服务器上都可以随 ...
- pipenv管理python开发环境
简介 简单说,pipenv就是把pip和virtualenv包装起来的一个便携工具. 它不会在你的项目文件夹里生成一大堆东西,只有两个文本文件: Pipfile, 简明地显示项目环境和依赖包. Pip ...
- Django Windows+IIS+wfastcgi 环境下部署
教程基于 Windows 10专业版 + Python3.6 + IIS + wfastcgi 之上部署Django2.2的,同样适用于Windows server2012服务器和Windows7及以 ...
- v8
V8 - 开源,由Google开发,用C ++编写 Rhin- 由Mozilla基金会开源,完全用Java开发 SpiderMonkey 第一个JavaScript引擎,Netscape Naviga ...
- 本地jar包在maven工程中pom引用
背景 在使用Maven的过程中,经常碰到有些jar包在中央仓库没有的情况.如果公司有私服,那么就把jar包安装到私服上.如果没有私服,那就把jar包安装到本地Maven仓库.下面是如何把jar包导 ...