Skip to content

Commit 11c0a2e

Browse files
author
潘卓然Y7000P
committed
【站点】【新增】【新增DataStore/PostGIS的查询以及分布式显示】
1 parent 60a56eb commit 11c0a2e

33 files changed

Lines changed: 1280 additions & 17 deletions

website/public/static/demo/config/config-mapboxgl.json

Lines changed: 72 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -692,26 +692,82 @@
692692
]
693693
},
694694
{
695-
"name": "ElasticSearch",
696-
"iconfont": "iconsearch",
697-
"folder": "elasticsearch",
698-
"leaffolder": true,
695+
"name": "DataStore-内网",
696+
"iconfont": "iconESfuwuElasticsearch",
697+
"folder": "datastore",
698+
"leaffolder": false,
699699
"childs": [
700700
{
701-
"name": "聚类分析",
702-
"file": "grid-search",
703-
"diffcult": "5",
704-
"detail": "",
705-
"icon": "grid-search.png",
706-
"update": "最后更新时间:2019-11-07"
701+
"name": "PostGIS",
702+
"iconfont": "iconpostgresql",
703+
"folder": "postgis",
704+
"leaffolder": true,
705+
"childs": [
706+
{
707+
"name": "数据目录",
708+
"file": "postgis-catlog",
709+
"diffcult": "3",
710+
"detail": "",
711+
"icon": "postgis-catlog.png",
712+
"update": "最后更新时间:2020-09-28"
713+
},
714+
{
715+
"name": "元数据信息",
716+
"file": "postgis-metadata",
717+
"diffcult": "3",
718+
"detail": "",
719+
"icon": "postgis-metadata.png",
720+
"update": "最后更新时间:2020-09-28"
721+
},
722+
{
723+
"name": "查询统计",
724+
"file": "postgis-query",
725+
"diffcult": "3",
726+
"detail": "",
727+
"icon": "postgis-query.png",
728+
"update": "最后更新时间:2020-09-28"
729+
},
730+
{
731+
"name": "自定义查询",
732+
"file": "postgis-custom-query",
733+
"diffcult": "3",
734+
"detail": "",
735+
"icon": "postgis-custom-query.png",
736+
"update": "最后更新时间:2020-09-28"
737+
},
738+
{
739+
"name": "实时矢量瓦片",
740+
"file": "postgis-vectortile",
741+
"diffcult": "3",
742+
"detail": "",
743+
"icon": "postgis-vectortile.png",
744+
"update": "最后更新时间:2020-09-28"
745+
}
746+
]
707747
},
708748
{
709-
"name": "热力分析",
710-
"file": "heat-search",
711-
"diffcult": "5",
712-
"detail": "",
713-
"icon": "heat-search.png",
714-
"update": "最后更新时间:2019-11-07"
749+
"name": "ElasticSearch",
750+
"iconfont": "iconelasticsearch",
751+
"folder": "elasticsearch",
752+
"leaffolder": true,
753+
"childs": [
754+
{
755+
"name": "聚类分析",
756+
"file": "grid-search",
757+
"diffcult": "5",
758+
"detail": "",
759+
"icon": "grid-search.png",
760+
"update": "最后更新时间:2019-11-07"
761+
},
762+
{
763+
"name": "热力分析",
764+
"file": "heat-search",
765+
"diffcult": "5",
766+
"detail": "",
767+
"icon": "heat-search.png",
768+
"update": "最后更新时间:2019-11-07"
769+
}
770+
]
715771
}
716772
]
717773
},

website/public/static/demo/mapboxgl/example/elasticsearch/grid-search.htm renamed to website/public/static/demo/mapboxgl/example/datastore/elasticsearch/grid-search.htm

File renamed without changes.

website/public/static/demo/mapboxgl/example/elasticsearch/heat-search.htm renamed to website/public/static/demo/mapboxgl/example/datastore/elasticsearch/heat-search.htm

File renamed without changes.
Lines changed: 176 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,176 @@
1+
<!DOCTYPE html>
2+
<html xmlns="http://www.w3.org/1999/xhtml">
3+
<head>
4+
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
5+
<title>数据目录</title>
6+
<script src="./static/libs/include-mapboxgl-local.js"></script>
7+
<style>
8+
#map {
9+
position: absolute;
10+
width: 100%;
11+
height: 100%;
12+
}
13+
.mapboxgl-popup {
14+
max-width: fit-content !important;
15+
}
16+
.table-popup-wrapper {
17+
width: fit-content;
18+
}
19+
</style>
20+
</head>
21+
22+
<body>
23+
<div id="map"></div>
24+
<script>
25+
mapboxgl.accessToken = 'pk.eyJ1IjoicGFybmRlZWRsaXQiLCJhIjoiY2o1MjBtYTRuMDhpaTMzbXhpdjd3YzhjdCJ9.sCoubaHF9-nhGTA-sgz0sA';
26+
var tiandituKey = 'f5347cab4b28410a6e8ba5143e3d5a35';
27+
var vecsrc = {
28+
//来源类型为栅格瓦片
29+
type: 'raster',
30+
tiles: [
31+
//来源请求地址,请求天地图提供的全球矢量地图WMTS服务
32+
'http://t' +
33+
Math.round(Math.random() * 7) +
34+
'.tianditu.gov.cn/vec_c/wmts?SERVICE=WMTS&REQUEST=GetTile&VERSION=1.0.0&LAYER=vec&STYLE=default&TILEMATRIXSET=c&FORMAT=tiles' +
35+
'&TILECOL=' +
36+
'{x}' +
37+
'&TILEROW=' +
38+
'{y}' +
39+
'&TILEMATRIX=' +
40+
'{z}' +
41+
'&tk=' +
42+
tiandituKey
43+
],
44+
//栅格瓦片的分辨率
45+
tileSize: 256
46+
};
47+
var cvasrc = {
48+
//来源类型为栅格瓦片
49+
type: 'raster',
50+
tiles: [
51+
//来源请求地址,请求天地图提供的全球矢量中文注记WMTS服务
52+
'http://t' +
53+
Math.round(Math.random() * 7) +
54+
'.tianditu.gov.cn/cva_c/wmts?SERVICE=WMTS&REQUEST=GetTile&VERSION=1.0.0&LAYER=cva&STYLE=default&TILEMATRIXSET=c&FORMAT=tiles' +
55+
'&TILECOL=' +
56+
'{x}' +
57+
'&TILEROW=' +
58+
'{y}' +
59+
'&TILEMATRIX=' +
60+
'{z}' +
61+
'&tk=' +
62+
tiandituKey
63+
],
64+
//栅格瓦片的分辨率
65+
tileSize: 256
66+
};
67+
var popup = new mapboxgl.Popup({ closeOnClick: false });
68+
var map = new mapboxgl.Map({
69+
container: 'map',
70+
crs: 'EPSG:4326', //经纬度一定要设置crs参数
71+
maxBounds: [
72+
[-180, -90],
73+
[180, 90]
74+
],
75+
style: {
76+
//设置版本号,一定要设置
77+
version: 8,
78+
//添加来源
79+
sources: {
80+
vecsrc: vecsrc,
81+
cvasrc: cvasrc
82+
},
83+
//设置加载并显示来源的图层信息
84+
layers: [
85+
{
86+
//图层id,要保证唯一性
87+
id: 'vecsrc',
88+
//图层类型
89+
type: 'raster',
90+
//连接图层来源
91+
source: 'vecsrc',
92+
//图层最小缩放级数
93+
minzoom: 0,
94+
//图层最大缩放级数
95+
maxzoom: 22
96+
},
97+
{
98+
//图层id,要保证唯一性
99+
id: 'cvasrc',
100+
//图层类型
101+
type: 'raster',
102+
//连接图层来源
103+
source: 'cvasrc',
104+
//图层最小缩放级数
105+
minzoom: 0,
106+
//图层最大缩放级数
107+
maxzoom: 22
108+
}
109+
]
110+
},
111+
zoom: 10,
112+
pitch: 45,
113+
center: [121.4693, 31.12307]
114+
});
115+
116+
var param = {
117+
networkProtocol: 'http',
118+
ip: '192.168.96.101',
119+
port: 9091,
120+
path: 'bigdata03',
121+
classify: '数据集',
122+
keyWords: 'big'
123+
};
124+
125+
var catlog = new Zondy.DataStore.PostGIS.PostgisCatlogService(param);
126+
catlog.query(success, fail);
127+
function success(res) {
128+
var result = res.t.rtn[0];
129+
var html = '<div class="table-popup-wrapper">' + makeHtml(result) + '</div>';
130+
popup.setLngLat([121.4693, 31.12307]).setHTML(html).addTo(map);
131+
}
132+
133+
function fail(error) {
134+
console.log('fail', error);
135+
}
136+
137+
function makeHtml(result) {
138+
var html = '<div><table border="1"><tr><th>属性</th><th>值</th></tr>';
139+
var keys = Object.keys(result);
140+
// 显示非对象属性
141+
keys.forEach((key) => {
142+
if (typeof result[key] != 'object' || result[key] == undefined) {
143+
html += `<tr>
144+
<td>${key}</td>
145+
<td>${result[key]}</td>
146+
</tr>`;
147+
}
148+
});
149+
// 显示对象属性
150+
keys.forEach((key) => {
151+
if (result[key] && typeof result[key] == 'object') {
152+
html += `<th colspan="2">${key}</th>`;
153+
html += '<tr><th>属性</th><th>值</th></tr>';
154+
var object = result[key];
155+
var fields = Object.keys(object);
156+
fields.forEach((f) => {
157+
var item;
158+
if (object[f] && typeof object[f] === 'object') {
159+
item = makeHtml(object[f]);
160+
} else {
161+
item = object[f];
162+
}
163+
html += `<tr>
164+
<td>${f}</td>
165+
<td>${item}</td>
166+
</tr>`;
167+
});
168+
}
169+
});
170+
171+
html += '</table></div>';
172+
return html;
173+
}
174+
</script>
175+
</body>
176+
</html>

0 commit comments

Comments
 (0)