Skip to content

Commit 4fa6c46

Browse files
songyumengsongyumeng
committed
【feature】ol 支持为图层设置/移除掩膜 review by xiongjj
1 parent 9bd8687 commit 4fa6c46

9 files changed

Lines changed: 440 additions & 142 deletions

File tree

‎examples/locales/en-US/resources.js‎

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -664,6 +664,9 @@ window.examplesResources = {
664664
"title_webPrinting_landUse": 'Web Printing(LandUse)',
665665
"title_natureResourcePlatform_Vue": 'Nature Resource Platform(Vue)',
666666
"title_ecologicalBigDataPlatform_Vue": 'Ecological Big Data Platform(Vue)',
667+
"title_mask":'Layer Mask',
668+
"title_objectdetection":"Machinelearning(Objectdetection)",
669+
"title_binaryclassification":"Machinelearning(Binaryclassification)",
667670

668671
"text_service_name":"Name",
669672
"text_service_type":"Type",
@@ -1403,6 +1406,9 @@ window.examplesResources = {
14031406
'text_ncpworld_incidence_title':"Reported incidence by World (per 100,000)",
14041407
'text_ncp_world':"Global NCP",
14051408
'text_ncp_china':"China NCP",
1409+
"text_input_value_addMask": "Add mask",
1410+
"text_input_value_removeMask": "Remove mask",
1411+
"text_add_sicahun_plygon":"Loading Sichuan Province Regional Data...",
14061412

14071413

14081414
"btn_previous":"Previous",

‎examples/locales/zh-CN/resources.js‎

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -615,6 +615,9 @@ window.examplesResources = {
615615
"title_webPrinting_landUse": '土地利用 Web 打印',
616616
"title_natureResourcePlatform_Vue": '自然资源平台大屏',
617617
"title_ecologicalBigDataPlatform_Vue": '生态大数据平台大屏',
618+
"title_mask":'图层掩膜',
619+
"title_objectdetection":"机器学习（目标检测）",
620+
"title_binaryclassification":"机器学习（二元分类）",
618621

619622
"text_service_name":"名称",
620623
"text_service_type":"类型",
@@ -1349,6 +1352,9 @@ window.examplesResources = {
13491352
'text_ncpworld_incidence_title':"全球报告发病率（每10万人）",
13501353
'text_ncp_world':"世界疫情",
13511354
'text_ncp_china':"中国疫情",
1355+
"text_input_value_addMask": "添加掩膜",
1356+
"text_input_value_removeMask": "移除掩膜",
1357+
"text_add_sicahun_plygon":"正在加载四川省区划数据...",
13521358

13531359

13541360
"btn_previous":"上一步",

‎examples/mapboxgl/machinelearning_binaryclassification.html‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@
66
<head>
77
<meta charset="utf-8" />
88
<meta name="viewport" content="initial-scale=1,maximum-scale=1,user-scalable=no" />
9-
<title data-i18n="resources.title_tiledMapLayer"></title>
9+
<title data-i18n="resources.title_binaryclassification"></title>
1010
<script type="text/javascript" include="bootstrap" src="../js/include-web.js"></script>
1111
<style>
1212
body {

‎examples/mapboxgl/machinelearning_objectdetection.html‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@
66
<head>
77
<meta charset="utf-8" />
88
<meta name="viewport" content="initial-scale=1,maximum-scale=1,user-scalable=no" />
9-
<title data-i18n="resources.title_tiledMapLayer"></title>
9+
<title data-i18n="resources.title_objectdetection"></title>
1010
<script type="text/javascript" include="bootstrap" src="../js/include-web.js"></script>
1111
<style>
1212
body {

‎examples/openlayers/config.js‎

Lines changed: 13 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -970,7 +970,19 @@ var exampleConfig = {
970970
thumbnail: "ol_graphThemeLayer.png",
971971
fileName: "graphThemeLayer"
972972
}]
973-
}
973+
},
974+
"mask": {
975+
name: "掩膜",
976+
name_en: "Mask",
977+
version: "10.1.0",
978+
content: [{
979+
name: "图层掩膜",
980+
name_en: "Layer Mask",
981+
version: "10.1.0",
982+
thumbnail: "mask.png",
983+
fileName: "mask"
984+
}]
985+
},
974986
}
975987
},
976988
"plot": {

‎examples/openlayers/img/mask.png‎

18.5 KB
Loading

‎examples/openlayers/mask.html‎

Lines changed: 110 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,110 @@
1+
<!--********************************************************************
2+
* Copyright© 2000 - 2020 SuperMap Software Co.Ltd. All rights reserved.
3+
*********************************************************************-->
4+
<!DOCTYPE html>
5+
<html>
6+
<head>
7+
<meta charset="UTF-8" />
8+
<title data-i18n="resources.title_mask"></title>
9+
10+
<style type="text/css">
11+
.editPane {
12+
position: absolute;
13+
top: 50px;
14+
right: 50px;
15+
text-align: center;
16+
background: #fff;
17+
z-index: 1000;
18+
}
19+
</style>
20+
</head>
21+
<body style="margin: 0; overflow: hidden; background: #fff; width: 100%; height: 100%; position: absolute; top: 0">
22+
<div class="panel panel-primary editPane" id="editPane" style="z-index: 99999">
23+
<div class="panel-heading">
24+
<h5 class="panel-title text-center" data-i18n="resources.btn_operate"></h5>
25+
</div>
26+
<div class="panel-body" id="params">
27+
<p></p>
28+
<div align="right" class="button-group">
29+
<input
30+
type="button"
31+
id="btn1"
32+
class="btn btn-primary"
33+
data-i18n="[value]resources.text_input_value_addMask"
34+
onclick="addMask()"
35+
/>
36+
<input
37+
type="button"
38+
id="btn2"
39+
class="btn btn-primary"
40+
data-i18n="[value]resources.text_input_value_removeMask"
41+
onclick="removeMask()"
42+
/>
43+
</div>
44+
</div>
45+
</div>
46+
<div id="map" style="width: 100%; height: 100%"></div>
47+
<script type="text/javascript" include="bootstrap,widgets" src="../js/include-web.js"></script>
48+
<script type="text/javascript" include="ol-mapbox-style" src="../../dist/ol/include-ol.js"></script>
49+
<script type="text/javascript">
50+
var map,
51+
sichuanFeature,
52+
vectorLayer,
53+
baseUrl =
54+
(window.isLocal ? window.server : 'https://iserver.supermap.io') +
55+
'/iserver/services/map-china400/rest/maps/China',
56+
url =
57+
(window.isLocal ? window.server : 'https://iserver.supermap.io') +
58+
'/iserver/services/map-Population/rest/maps/PopulationDistribution';
59+
map = new ol.Map({
60+
target: 'map',
61+
controls: ol.control
62+
.defaults({ attributionOptions: { collapsed: false } })
63+
.extend([new ol.supermap.control.Logo()]),
64+
view: new ol.View({
65+
center: [11523496.18, 3735091.51],
66+
zoom: 4,
67+
multiWorld: true
68+
})
69+
});
70+
var layer = new ol.layer.Tile({
71+
source: new ol.source.TileSuperMapRest({
72+
url: baseUrl,
73+
wrapX: true
74+
})
75+
});
76+
map.addLayer(layer);
77+
var vectorLayer = new ol.layer.Tile({
78+
source: new ol.source.TileSuperMapRest({
79+
url: url,
80+
wrapX: true
81+
})
82+
});
83+
map.addLayer(vectorLayer);
84+
function addMask() {
85+
if (!sichuanFeature) {
86+
widgets.loader.showLoader(resources.text_add_sicahun_plygon);
87+
var param = new SuperMap.QueryBySQLParameters({
88+
queryParams: {
89+
name: 'China_Province_pl@China',
90+
attributeFilter: 'SMID =14'
91+
}
92+
});
93+
new ol.supermap.QueryService(baseUrl).queryBySQL(param, function (serviceResult) {
94+
widgets.loader.removeLoader();
95+
sichuanFeature = new ol.format.GeoJSON().readFeatures(
96+
serviceResult.result.recordsets[0].features
97+
)[0];
98+
ol.supermap.Util.setMask(vectorLayer, sichuanFeature);
99+
});
100+
return;
101+
} else {
102+
ol.supermap.Util.setMask(vectorLayer, sichuanFeature);
103+
}
104+
}
105+
function removeMask() {
106+
ol.supermap.Util.unsetMask(vectorLayer);
107+
}
108+
</script>
109+
</body>
110+
</html>

0 commit comments

Comments
 (0)