1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
| <!DOCTYPE html>
| <html lang="en">
| <head>
| <meta charset="UTF-8" />
| <title>都市圈三维示例</title>
| <script type="text/javascript" src="./api/OMAP.min.js"></script>
| <script
| type="text/javascript"
| src="./api/terraformer/terraformer.js"
| ></script>
| <script
| type="text/javascript"
| src="./api/terraformer/terraformer-wkt-parser-1.1.2.min.js"
| ></script>
| <script
| type="text/javascript"
| src="./api/terraformer/terraformer-arcgis-parser.min.js"
| ></script>
| <script type="text/javascript" src="./lib/jquery.min.js"></script>
| </head>
| <body>
| <div
| id="ocnMapDiv"
| style="width: 100%; height: 100%; position: absolute; top: 0; left: 0"
| ></div>
| <script>
| var jsPath = 'https://sgbusserver.shouguang.gov.cn/ServiceAccess/MapService-T/%E5%AF%BF%E5%85%89%E5%B8%822.5D%E5%9C%B0%E5%9B%BE/a0a175dfe1ac7ed9b1297ba783860b5f/js'
| var shouguangResourcePath =
| 'https://sgbusserver.shouguang.gov.cn/ServiceAccess/MapService-T/%E5%AF%BF%E5%85%89%E5%B8%822.5D%E5%9C%B0%E5%9B%BE/a0a175dfe1ac7ed9b1297ba783860b5f'
|
| // 2.5维瓦片图层加载是都市圈自有的
| var shouguangTileLayer = new OMAP.Layer.NOGISLayer(
| 'shouguangTile',
| shouguangResourcePath,
| {
| isBaseLayer: true,
| transparent: true,
| defaultImage: '/api/img/transparent.png',
| startHoverLevel: 12,
| startLevel: 0,
| loadHotspot: true, // 是否加载热区
| }
| )
|
| var shouguangMap = new OMAP.Map(document.getElementById('ocnMapDiv'), {
| extent: new OMAP.Bounds(
| -56255400.354765005,
| -56255400.354765005,
| 56255400.354765005,
| 56255400.354765005
| ),
| center: [8387734.6301929, 4895816.7819977],
| zoom: 14,
| config: new OMAP.Config({
| jsPath: jsPath,
| mapId: 1,
| scale: 0.353,
| hotFileLevel: 12,
| overlook: Math.PI / 4,
| rotate: 0,
| }),
| // 寿光瓦片分为16级，对应天地图5级到20级
| resolutions: [
| 107.29866095498086 * 128,
| 107.29866095498086 * 64,
| 107.29866095498086 * 32,
| 107.29866095498086 * 16,
| 107.29866095498086 * 8,
| 107.29866095498086 * 4,
| 107.29866095498086 * 2,
| 107.29866095498086,
| 53.64933047749043,
| 26.824665238745215,
| 13.412332619372608,
| 6.7061663096863038,
| 3.3530831548431519,
| 1.676541577421576,
| 0.838270788710788,
| 0.419135394355394,
| ],
| numZoomLevels: 16,
| layers: [shouguangTileLayer],
| controls: [new OMAP.Control.Navigation()],
| })
|
| var tempLayer = new OMAP.Layer.Vector()
| shouguangMap.addLayer(tempLayer)
|
| var url = 'https://sgfzsw.shouguang.gov.cn/frontCommon/pageKeywordsSearch'
| var keywords = '中南世纪城小区'
| $.ajax({
| url: url,
| data: {
| keywords: keywords, //关键词
| type: 1, //搜索类型，1搜索不动产，2搜索宗地
| currentPage: 1, //当前页数
| pageSize: 10, //每页条数
| },
| success: function (res) {
| var data = JSON.parse(res)
| if (data.rows.length > 0) {
| tempLayer.removeAllFeatures()
| for (var i = 0; i < data.rows.length; i++) {
| var row = data.rows[i]
| var shape = ''
| if (row.shape instanceof Array) {
| shape = row.shape[0]
| } else {
| shape = row.shape
| }
| var feature = new OMAP.Format.WKT().read(shape)
|
| //定位
| var center = feature.geometry.getCentroid()
| shouguangMap.setCenter([center.x, center.y], 14)
|
| //添加描边
| if (feature == null || feature === '' || feature === 'undefined')
| return
| var style = {
| strokeOpacity: 1,
| strokeColor: 'red',
| strokeWidth: 2,
| fillColor: 'white',
| fillOpacity: 0.2,
| }
| var clone = feature.clone()
| clone.style = style
| tempLayer.addFeatures([clone])
| }
| }
| },
| })
|
| // 重写此回调方法实现消息弹出
| function showCustomDetial(pt, entity, feature) {
|
|
| }
| </script>
| </body>
| </html>
|
|
