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.复杂链表的复制

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项目中应用七牛云存储

七牛云存储&#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即孤立森林&#xff0c;可以用于做异常检测。一句话总结IForest做异常检测的原理&#xff1a;异常点密度小&#xff0c;基于树模型容易被一下切割出来&#xff0c;正常值密度大&#xff0c;需要切割多次才能得到目标值。 原理 iForest算法得益于随机森林的思想&…

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

近期在做船仅仅识别方面的事情&#xff0c;须要大量的正样本来训练adaboost分类器。于是到marinetraffic这个站点上下载船仅仅图片。写个爬虫来自己主动下载显然非常方便。 站点特点 在介绍爬虫之前首先了解一下marinetraffic这个站点的一些特点&#xff1a; 1. 会定期检測爬虫…

异常检测算法之LOF

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

Android属性动画进阶用法

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

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

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

异常检测算法之HBOS

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

字典和json 的区别 和转换

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

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;索尼、夏普、东芝等日本传统电子设…

Postico —— OS X 上的免费 PostgreSQL 客户端

Postico 是 OS X 下的一个 PostgreSQL 客户端管理工具。要求 OS X 10.8 或者更新版本。 文章转载自 开源中国社区 [http://www.oschina.net]

hdu 1760 A New Tetris Game(搜索博弈)

题目链接&#xff1a;hdu 1760 A New Tetris Game 题意&#xff1a; 给你一个矩阵&#xff0c;0表示可以放格子&#xff0c;现在给你2*2的格子&#xff0c;lele先放&#xff0c;问是否能赢。 题解&#xff1a; 爆搜。具体看代码 1 #include<bits/stdc.h>2 #define F(i,a,…

flask-restful接口

同flask一样&#xff0c;flask-restful同样支持返回任一迭代器&#xff0c;它将会被转换成一个包含原始 Flask 响应对象的响应&#xff1a; class ArticleApi(Resource):def get(self):return {"hello":"world"},201&#xff0c;{"course":&quo…

Django中的F对象和Q对象

F对象 可以获取到自己的属性值实现自己的属性自己的属性关联的复杂条件支持运算 Q对象 Q对象实际上是对条件的一个封装封装后支持逻辑运算与或非 &|~ 支持嵌套 例子 from django.db.models import Max, Avg, F, Q from django.http import HttpResponse from django.s…

Django模型关系

模型关系 1:1 一对一 &#xff08;一个身份证对应一个驾照&#xff09; 是使用外键唯一约束实现的对应最多只能有一个我们通常会在从表中声明关系 主表&#xff0c;从表 主表数据删除&#xff0c;从表数据级联删除从表数据删除&#xff0c;主表不受影响谁声明关系&#xff0c…

Android常用开源项目

Android常用开源项目 Android 2014-05-23 16:39:43 发布您的评价: 4.3 收藏 24收藏Android开源项目第一篇——个性化控件(View)篇包括ListView、ActionBar、Menu、ViewPager、Gallery、GridView、ImageView、ProgressBar、TextView、其他Android开源项目第二篇——工具库…

git push/pull时总需要输入用户名密码的解决方案

在提交项目代码或者拉代码的时候&#xff0c;git会让你输入用户名密码&#xff0c;解决方案&#xff1a;&#xff08;我们公司用的是gitlab&#xff09;执行git config --global credential.helper store命令然后git push origin your-branch会让你输入用户名和密码&#xff0c…

开源商务智能软件Pentaho

1 简介Pentaho是世界上最流行的开源商务智能软件,以工作流为核心的&#xff0c;强调面向解决方案而非工具组件的&#xff0c;基于java平台的商业智能(Business Intelligence,BI)套件BI&#xff0c;之所以说是套件是因为它包括一个web server平台和几个工具软件&#xff1a;报表…

Python - Django - 中间件 process_exception

process_exception(self, request, exception) 函数有两个参数&#xff0c;exception 是视图函数异常产生的 Exception 对象 process_exception 函数的执行顺序是按照 settings.py 中设置的中间件的顺序的倒序执行 process_exception 函数只在视图函数中出现异常的时候才执行…