Supermap 组合单值专题图与标签专题图演示样例

效果图例如以下：单值专题图并显示每一个区域的相关文字信息

 

代码：

<!DOCTYPE>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>单值专题图</title>
<style type="text/css">
body{
margin: 0;
overflow: hidden;
background: #fff;
}
#map{
position: relative;
height: 520px;
border:1px solid #3473b7;
}
#toolbar{
position: relative;
height: 33px;
padding-top:5;
}
</style>
<script src='./supermap_iclient_for_JavaScript_712_12428_1122/libs/SuperMap.Include.js'></script>
<script type="text/javascript">
var map, local, baseLayer, layersID, themeLayer,
host = document.location.toString().match(/file:\/\//)?"http://localhost:8090":'http://' + document.location.host,
url=host+"/iserver/services/map-China400/rest/maps/China";
function init(){
map = new SuperMap.Map("map",{controls: [
new SuperMap.Control.LayerSwitcher(),
new SuperMap.Control.ScaleLine(),
new SuperMap.Control.Zoom(),
new SuperMap.Control.Navigation({
dragPanOptions: {
enableKinetic: true
}
})]
});
baseLayer = new SuperMap.Layer.TiledDynamicRESTLayer("China400", url, {transparent: true, cacheEnabled: true}, {maxResolution: "auto"});
baseLayer.events.on({"layerInitialized": addLayer});
}function addLayer() {
map.addLayer(baseLayer);
map.setCenter(new SuperMap.LonLat(12080677, 4591416), 3);
map.allOverlays = true;
}
/**
*叠加专题图
*/
function addThemeUnique() {
removeTheme();
var themeService = new SuperMap.REST.ThemeService(url, {eventListeners:{"processCompleted": themeCompleted, "processFailed": themeFailed}});
var style1, style2, style3, style4, style5, style6;
var style1, style2, style3, style4, style5, style6;
style1 = new SuperMap.REST.ServerStyle({
fillForeColor: new SuperMap.REST.ServerColor(248, 203, 249),
lineColor: new SuperMap.REST.ServerColor(0, 0, 0),
lineWidth: 0.1
});
style2 = new SuperMap.REST.ServerStyle({
fillForeColor: new SuperMap.REST.ServerColor(196, 255, 189),
lineColor: new SuperMap.REST.ServerColor(0, 0, 0),
lineWidth: 0.1
});
style3 = new SuperMap.REST.ServerStyle({
fillForeColor: new SuperMap.REST.ServerColor(255, 173, 173),
lineColor: new SuperMap.REST.ServerColor(0, 0, 0),
lineWidth: 0.1
});
style4 = new SuperMap.REST.ServerStyle({
fillForeColor: new SuperMap.REST.ServerColor(255, 239, 168),
lineColor: new SuperMap.REST.ServerColor(0, 0, 0),
lineWidth: 0.1
});
style5 = new SuperMap.REST.ServerStyle({
fillForeColor: new SuperMap.REST.ServerColor(173, 209, 255),
lineColor: new SuperMap.REST.ServerColor(0, 0, 0),
lineWidth: 0.1
});
style6 = new SuperMap.REST.ServerStyle({
fillForeColor: new SuperMap.REST.ServerColor(132, 164, 232),
lineColor: new SuperMap.REST.ServerColor(0, 0, 0),
lineWidth: 0.1
});var themeUniqueIteme1 = new SuperMap.REST.ThemeUniqueItem({
unique: "黑龙江省",
style: style1
}),
themeUniqueIteme2 = new SuperMap.REST.ThemeUniqueItem({
unique: "湖北省",
style: style2
}),
themeUniqueIteme3 = new SuperMap.REST.ThemeUniqueItem({
unique: "吉林省",
style: style3
}),
themeUniqueIteme4 = new SuperMap.REST.ThemeUniqueItem({
unique: "内蒙古自治区",
style: style4
}),
themeUniqueIteme5 = new SuperMap.REST.ThemeUniqueItem({
unique: "青海省",
style: style5
}),
themeUniqueIteme6 = new SuperMap.REST.ThemeUniqueItem({
unique: "新疆维吾尔自治区",
style: style6
}),
themeUniqueIteme7 = new SuperMap.REST.ThemeUniqueItem({
unique: "云南省",
style: style1
}),
themeUniqueIteme8 = new SuperMap.REST.ThemeUniqueItem({
unique: "四川省",
style: style4
}),
themeUniqueIteme9 = new SuperMap.REST.ThemeUniqueItem({
unique: "贵州省",
style: style3
}),
themeUniqueIteme10 = new SuperMap.REST.ThemeUniqueItem({
unique: "甘肃省",
style: style3
}),
themeUniqueIteme11 = new SuperMap.REST.ThemeUniqueItem({
unique: "宁夏回族自治区",
style: style5
}),
themeUniqueIteme12 = new SuperMap.REST.ThemeUniqueItem({
unique: "重庆市",
style: style6
}),
themeUniqueIteme13 = new SuperMap.REST.ThemeUniqueItem({
unique: "山东省",
style: style1
}),
themeUniqueIteme14 = new SuperMap.REST.ThemeUniqueItem({
unique: "安徽省",
style: style2
}),
themeUniqueIteme15 = new SuperMap.REST.ThemeUniqueItem({
unique: "江西省",
style: style3
}),
themeUniqueIteme16 = new SuperMap.REST.ThemeUniqueItem({
unique: "浙江省",
style: style4
}),
themeUniqueIteme17 = new SuperMap.REST.ThemeUniqueItem({
unique: "台湾省",
style: style2
}),
themeUniqueIteme18 = new SuperMap.REST.ThemeUniqueItem({
unique: "江苏省",
style: style6
}),
themeUniqueIteme19 = new SuperMap.REST.ThemeUniqueItem({
unique: "湖南省",
style: style5
}),
themeUniqueIteme20 = new SuperMap.REST.ThemeUniqueItem({
unique: "河南省",
style: style4
}),
themeUniqueIteme21 = new SuperMap.REST.ThemeUniqueItem({
unique: "河北省",
style: style3
}),
themeUniqueIteme22 = new SuperMap.REST.ThemeUniqueItem({
caption:"福建省",
unique: "福建省",
style: style5
}),
themeUniqueIteme23 = new SuperMap.REST.ThemeUniqueItem({
unique: "广西壮族自治区",
style: style6
}),
themeUniqueIteme24 = new SuperMap.REST.ThemeUniqueItem({
unique: "西藏自治区",
style: style2
}),
themeUniqueIteme25 = new SuperMap.REST.ThemeUniqueItem({
unique: "广东省",
style: style4
}),
themeUniqueIteme26 = new SuperMap.REST.ThemeUniqueItem({
unique: "山西省",
style: style2
}),
themeUniqueIteme27 = new SuperMap.REST.ThemeUniqueItem({
unique: "陕西省",
style: style1
}),
themeUniqueIteme28 = new SuperMap.REST.ThemeUniqueItem({
unique: "天津市",
style: style5
}),
themeUniqueIteme29 = new SuperMap.REST.ThemeUniqueItem({
unique: "北京市",
style: style2
}),
themeUniqueIteme30 = new SuperMap.REST.ThemeUniqueItem({
unique: "辽宁省",
style: style1
});var themeUniqueItemes=[themeUniqueIteme1, themeUniqueIteme2, themeUniqueIteme3, themeUniqueIteme4, themeUniqueIteme5, themeUniqueIteme6,themeUniqueIteme7,themeUniqueIteme8,themeUniqueIteme9,themeUniqueIteme10,themeUniqueIteme11,themeUniqueIteme12, themeUniqueIteme13,themeUniqueIteme14,themeUniqueIteme15,themeUniqueIteme16,themeUniqueIteme17,themeUniqueIteme18,themeUniqueIteme19,themeUniqueIteme20,themeUniqueIteme21,themeUniqueIteme22,themeUniqueIteme23,themeUniqueIteme24,themeUniqueIteme25,themeUniqueIteme26,themeUniqueIteme27,themeUniqueIteme28,themeUniqueIteme29,themeUniqueIteme30];var themeUnique = new SuperMap.REST.ThemeUnique({
uniqueExpression: "Name",
items: themeUniqueItemes,
defaultStyle: style1
});//label专题图
style1 = new SuperMap.REST.ServerTextStyle({fontHeight: 4,foreColor: new SuperMap.REST.ServerColor(100,20,50),<strong><span style="color:#ff0000;"> sizeFixed: true,//当 sizeFixed 为 True 时，单位为毫米（mm）。</span></strong>bold:true                }),style2 = new SuperMap.REST.ServerTextStyle({fontHeight: 0,foreColor: new SuperMap.REST.ServerColor(100,20,50),sizeFixed: true,//当 sizeFixed 为 True 时，单位为毫米（mm）。bold:true                }),
//设置标签专题图的子项themeLabelIteme1 = new SuperMap.REST.ThemeLabelItem({start: 0.0,end: 20.0,style: style1}),<strong><span style="color:#ff0000;">//设置不要显示的数据。必须设置不然所有显示出来</span></strong>themeLabelIteme2 = new SuperMap.REST.ThemeLabelItem({start: 20.0,end: 1000.0,style: style2,
<span style="white-space:pre">		</span><span style="color:#ff0000;"><strong>visible:false</strong></span>}),themeLabelOne = new SuperMap.REST.ThemeLabel({labelExpression: "NAME",//标注字段表达式rangeExpression: "SMID",numericPrecision: 0,items: [themeLabelIteme1,themeLabelIteme2]}),//创建矩阵标签元素LabelThemeCellOne=new SuperMap.REST.LabelThemeCell({themeLabel: themeLabelOne}),//矩阵背景backStyle=new SuperMap.REST.ServerStyle({fillForeColor: new SuperMap.REST.ServerColor(255,255,0),fillOpaqueRate: 60,lineWidth: 0.1}),
<span style="white-space:pre">	</span>//创建矩阵标签专题图themeLabel = new SuperMap.REST.ThemeLabel({matrixCells: [[LabelThemeCellOne]],<span style="white-space:pre">		</span>maxLabelLength:20,<span style="white-space:pre">		</span><span style="color:#ff0000;"><strong>smallGeometryLabeled:true,//关键点不然有可能看不到文字效果哦</strong></span>background:new SuperMap.REST.ThemeLabelBackground({backStyle: backStyle,    labelBackShape:"RECT"})}),
themeParameters = new SuperMap.REST.ThemeParameters({
datasetNames: ["China_Province_R"],
dataSourceNames: ["China400"],
<span style="color:#ff0000;"><strong>themes: [themeLabel,themeUnique]//两个专题图组合</strong></span>
});
themeService.processAsync(themeParameters);
}function themeCompleted(themeEventArgs) {
if(themeEventArgs.result.resourceInfo.id) {
themeLayer = new SuperMap.Layer.TiledDynamicRESTLayer("中国行政区划_专题图", url, {cacheEnabled:false,transparent: true,layersID: themeEventArgs.result.resourceInfo.id}, {"maxResolution": "auto"});
themeLayer.events.on({"layerInitialized": addThemeLayer});
}
}
function addThemeLayer() {
map.addLayer(themeLayer);
}function themeFailed(serviceFailedEventArgs) {
//doMapAlert("",serviceFailedEventArgs.error.errorMsg,true);
alert(serviceFailedEventArgs.error.errorMsg);
}
function removeTheme() {
if (map.layers.length > 1) {
map.removeLayer(themeLayer, true);
}
}
</script>
</head>
<body οnlοad="init()"><br>
<div id="toolbar">
<input type="button" value="创建专题图" οnclick="addThemeUnique()" />
<input type="button" value="移除专题图" οnclick="removeTheme()" />
</div>
<div id="map"></div>
</body>
</html>


转载于:https://www.cnblogs.com/yutingliuyl/p/6941346.html

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

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

相关文章

[剑指Offer] 25.复杂链表的复制

[剑指Offer] 25.复杂链表的复制

1 /*2 struct RandomListNode {3 int label;4 struct RandomListNode *next, *random;5 RandomListNode(int x) :6 label(x), next(NULL), random(NULL) {7 }8 };9 */ 10 class Solution 11 { 12 public: 13 //在旧链表中创建新链表&#xff0…
阅读更多...
Flask项目中应用七牛云存储

Flask项目中应用七牛云存储

七牛云存储&#xff1a; https://developer.qiniu.com/kodo/sdk/1242/python 点击注册开通七牛开发者帐号 如果已有账号&#xff0c;直接登录七牛开发者后台&#xff0c;点击这里查看 Access Key 和 Secret Key pip install qiniu q Auth(Access Key,Secret Key) b…
阅读更多...
异常检测算法之IForest

异常检测算法之IForest

前言 IForest即孤立森林&#xff0c;可以用于做异常检测。一句话总结IForest做异常检测的原理&#xff1a;异常点密度小&#xff0c;基于树模型容易被一下切割出来&#xff0c;正常值密度大&#xff0c;需要切割多次才能得到目标值。 原理 iForest算法得益于随机森林的思想&…
阅读更多...
JavaScript - 动态数据

JavaScript - 动态数据

1、使用ajax进行数据的请求 function getData(params){$.ajax({type: "POST", //提交方式data: "{params}", //请求参数url:, //请求接口contentType: "application/text;charsetutf-8",async: false, //是否同步dataType: &quo…
阅读更多...
用c#编写爬虫在marinetraffic下载船仅仅图片

用c#编写爬虫在marinetraffic下载船仅仅图片

近期在做船仅仅识别方面的事情&#xff0c;须要大量的正样本来训练adaboost分类器。于是到marinetraffic这个站点上下载船仅仅图片。写个爬虫来自己主动下载显然非常方便。 站点特点 在介绍爬虫之前首先了解一下marinetraffic这个站点的一些特点&#xff1a; 1. 会定期检測爬虫…
阅读更多...
发送手机验证码通过调用第三方网易云信API（flask项目）

发送手机验证码通过调用第三方网易云信API（flask项目）

一、 获取验证码&#xff1a; 1. 输入手机号码 2. 通过ajax发送请求 3. 后端&#xff1a; 获取手机号码 使用requests向第三方的服务端&#xff08;网易云信&#xff09;发送请求 官方文档 https://dev.yunxin.163.com/docs/product/%E7%9F%AD%E4%BF%A1/%E7%9F…
阅读更多...
异常检测算法之LOF

异常检测算法之LOF

前言&#xff1a; LOF&#xff1a;Local outlier factor&#xff0c;即局部异常因子。LOF主要是通过比较每个点p和其邻域点的密度来判断该点是否为异常点&#xff0c;如果点p的密度越低&#xff0c;越可能被认定是异常点。至于密度&#xff0c;是通过点之间的距离来计算的&…
阅读更多...
Android属性动画进阶用法

Android属性动画进阶用法

2019独角兽企业重金招聘Python工程师标准>>> 在上周二文章中介绍补间动画缺点的时候有提到过&#xff0c;补间动画是只能对View对象进行动画操作的。而属性动画就不再受这个限制&#xff0c;它可以对任意对象进行动画操作。那么大家应该还记得之前我举的一个例子&am…
阅读更多...
5.3linux下C语言socket网络编程简例

5.3linux下C语言socket网络编程简例

原创文章&#xff0c;转载请注明转载字样和出处&#xff0c;谢谢&#xff01; 这里给出在Linux下的简单socket网络编程的实例&#xff0c;使用tcp协议进行通信&#xff0c;服务端进行监听&#xff0c;在收到客户端的连接后&#xff0c;发送数据给客户端&#xff1b;客户端在接受…
阅读更多...
parser.add_argument验证格式

parser.add_argument验证格式

article_bp Blueprint(article, __name__, url_prefix/api) api Api(article_bp) parser reqparse.RequestParser() parser.add_argument(name, typestr, help必须填写名称, requiredTrue) channel_fields { id: fields.Integer, cname: fields.String } clas…
阅读更多...
异常检测算法之HBOS

异常检测算法之HBOS

前言 HBOS&#xff08;Histogram-based Outlier Score&#xff09;核心思想&#xff1a;将样本按照特征分成多个区间&#xff0c;样本数少的区间是异常值的概率大。 原理 该方法为每一个样本进行异常评分&#xff0c;评分越高越可能是异常点。评分模型为&#xff1a; 假设样…
阅读更多...
字典和json 的区别 和转换

字典和json 的区别 和转换

前言&#xff1a;字典和json非常像。接下来比较一下两者的异同 先看一下字典的写法&#xff1a; a {a:1,b:2,c:3} 再看一下json的写法&#xff1a; {"studentInfo":{"id":123456,"stu_name":"Dorra"} } 从形式上看&#xff0c;都是…
阅读更多...
Struts2的工作原理及工作流程

Struts2的工作原理及工作流程

众所周知&#xff0c;Struts2是个非常优秀的开源框架&#xff0c;我们能用Struts2框架进行开发&#xff0c;同时能 快速搭建好一个Struts2框架&#xff0c;但我们是否能把Struts2框架的工作原理用语言表达清楚&#xff0c;你表达的原理不需要说出底层是怎么实现的&#xff0c;我…
阅读更多...
正则表达式采坑

正则表达式采坑

[a-zA-Z]匹配大小写字符 \w 匹配字母、数字、下划线 {5,7} 表示前面的字符&#xff08;即&#xff1a;\w&#xff09;必须至少出现 5 次最多出现 7 次. 合起来就是 >6 少于8个的字符 [a-zA-Z]\w{6,12} --------------》》 就是要输入七位数到十三位&#x…
阅读更多...
easyui动态显示和隐藏表头

easyui动态显示和隐藏表头

为什么80%的码农都做不了架构师&#xff1f;>>> var _bt{date:日期,subtime:填写时间,xz:小组,uname:操作人,qdbh:渠道编号,mt:媒体,zh:账户,sjd:时间段,tfwz:投放位置,tfh:投放号,td:团队,sjje:实际金额,jxs:进线数,cb:成本,yxzyjx:有效资源进线,yxzyl:有效资源率…
阅读更多...
物联网

物联网

如果要说未来什么技术正在或将彻底改变人类生活、工作和娱乐的方式&#xff0c;那必须是物联网。小到各种可穿戴产品&#xff0c;大到汽车、工厂和楼宇&#xff0c;物联网能使一切设备互联并具备智慧。物联网也正改变着产业的格局&#xff0c;索尼、夏普、东芝等日本传统电子设…
阅读更多...
理解：复杂度是O(log^n) 就是二分法

理解：复杂度是O(log^n) 就是二分法

冒昧问一下&#xff0c;为什么二分法查找的复杂度是O(log^n)&#xff1f;这是怎么计算的&#xff1f; 你要从1&#xff0c;2&#xff0c;3&#xff0c;4&#xff0c;5&#xff0c;6&#xff0c;7&#xff0c;8里面找到3&#xff0c;分成几步&#xff1f; 第一步&#xff0c;…
阅读更多...
浅谈管理数据平台的一些想法

浅谈管理数据平台的一些想法

前言&#xff1a; 对于任何使用大数据技术的公司来说&#xff0c;大数据平台特别是Hive来说&#xff0c;维护其高效快速的运行&#xff0c;对整个公司的运作来说至关重要。比如说&#xff1a;某个调度任务失败了造成业务部门的某些报表无法正常产出&#xff1b;hive平台最近速…
阅读更多...
MongoDB误删表恢复

MongoDB误删表恢复

一、场景描述公司某工程师执行db.giveget_card.drop()&#xff0c;误将线上表删除。幸好每天都有做备份&#xff0c;这个时候就体现了备份的重要性了&#xff0c;哈哈哈。。。二、模拟故障过程备份数据大小&#xff1a;rs_test01:PRIMARY> use ycsb switched to db ycsb rs_…
阅读更多...
linux下kill某个应用

linux下kill某个应用

linux命令行与桌面切换快捷键CtrAltF1&#xff0c;CtrAltF7 ps -e | grep abc sudo kill xyz 转载于:https://www.cnblogs.com/cj2014/p/6512354.html
阅读更多...
最新文章

Copyright @ 2022~2023