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.pswp.cn/news/456314.shtml
繁體地址，請注明出處：http://hk.pswp.cn/news/456314.shtml
英文地址，請注明出處：http://en.pswp.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