@mapgis/webclient-cesium-plugin 17.0.5 → 17.0.7

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -635,12 +635,6 @@
635
635
  <pre class="prettyprint"><code>// ES5引入方式
636
636
  // 服务基地址
637
637
  url: url
638
638
  // 获取provider的初始化参数
639
639
  const options = initializeOptions(layer, viewer)
640
640
  // 构造provider对象
641
641
  provider = new Cesium.ArcGisMapServerImageryProvider(options)
642
642
  // 添加图层到Cesium视图中
643
643
  cesiumLayer = viewer.imageryLayers.addImageryProvider(provider)
644
644
 
645
645
 
646
- <p class="code-caption"><h7>添加一个ArcGIS地图服务:混合接口开发</h7></p>
647
-
648
-
649
- <pre class="prettyprint"><code>// ES5引入方式
650
646
  // 服务基地址
651
647
  url: url
652
648
  // 获取自定义的tilingScheme对象
653
649
  const tilingScheme = getTilingSchemeBySpatialReference(
654
650
  layer.spatialReference,
655
651
  layer.extent
656
652
  )
657
653
  // 获取图层显示范围
658
654
  const extent = getExtent(layer, tilingScheme.rectangle)
659
655
  const rectangle = new Cesium.Rectangle(
660
656
  extent.xmin,
661
657
  extent.ymin,
662
658
  extent.xmax,
663
659
  extent.ymax
664
660
  )
665
661
  // 添加图层到Cesium视图中
666
662
  cesiumLayer = viewer.imageryLayers.addImageryProvider(
667
663
  new Cesium.ArcGisMapServerImageryProvider({
668
664
  // ArcGIS MapServer服务地址
669
665
  url: layer.url,
670
666
  // 是否使用已经预缓存的瓦片方式加载图层,为false表示不使用瓦片方式加载图层,使用export服务加载图层
671
667
  usePreCachedTilesIfAvailable: false,
672
668
  // 逗号分隔的列表,用于规定加载的图层,未定义表示加载所有的图层
673
669
  layers: layer.layers,
674
670
  // 地图瓦片的切分方式,经纬度或者Web墨卡托
675
671
  tilingScheme,
676
672
  // 地图服务的加载范围
677
673
  rectangle
678
674
  })
679
675
  )
680
-
681
-
682
676
 
683
677
 
684
678
  </div>
@@ -445,12 +445,6 @@
445
445
  <pre class="prettyprint"><code>// ES5引入方式
446
446
  // 获取provider的初始化参数
447
447
  const options = initializeOptions(layer, viewer)
448
448
  // 构造provider对象
449
449
  provider = new Cesium.UrlTemplateImageryProvider(options)
450
450
  // 添加图层到Cesium视图中
451
451
  cesiumLayer = viewer.imageryLayers.addImageryProvider(provider)
452
452
 
453
453
 
454
- <p class="code-caption"><h7>添加一个ArcGIS瓦片服务:混合接口开发</h7></p>
455
-
456
-
457
- <pre class="prettyprint"><code>// ES5引入方式
458
454
  // 构造自定义的tilingScheme对象
459
455
  const tilingScheme = getTilingSchemeBySpatialReference(
460
456
  layer.spatialReference,
461
457
  layer.extent,
462
458
  layer.tileInfo
463
459
  )
464
460
  // 设置图层范围,超过范围不请求瓦片
465
461
  const extent = getExtent(layer, tilingScheme.rectangle)
466
462
  const rectangle = new Cesium.Rectangle(
467
463
  extent.xmin,
468
464
  extent.ymin,
469
465
  extent.xmax,
470
466
  extent.ymax
471
467
  )
472
468
  // 添加图层到Cesium中
473
469
  cesiumLayer = viewer.imageryLayers.addImageryProvider(
474
470
  new Cesium.UrlTemplateImageryProvider({
475
471
  // 请求瓦片的url模板,{x}、{y}、{z}分别表示瓦片的x坐标、y坐标和层级
476
472
  url: `${layer.url}/tile/{z}/{y}/{x}`,
477
473
  // 地图瓦片的切分方式,经纬度或者Web墨卡托
478
474
  tilingScheme,
479
475
  // 瓦片宽度
480
476
  tileWidth: layer.tileInfo.cols,
481
477
  // 瓦片高度
482
478
  tileHeight: layer.tileInfo.cols,
483
479
  // 瓦片服务的加载范围
484
480
  rectangle
485
481
  })
486
482
  )
487
-
488
-
489
483
 
490
484
 
491
485
  </div>
@@ -827,69 +827,6 @@ igsMapImageLayer.load().then((layer) => {
827
827
  })</code></pre>
828
828
 
829
829
 
830
- <p class="code-caption"><h7>添加一个MapGIS地图服务:混合接口开发</h7></p>
831
-
832
-
833
- <pre class="prettyprint"><code>// ES5引入方式
834
- const { MapGISMapServerImageryProvider } = Zondy
835
- const { IGSMapImageLayer } = Zondy.Layer
836
- const { getTilingSchemeBySpatialReference, getExtent } = Zondy.Utils
837
- // ES6引入方式
838
- import { MapGISMapServerImageryProvider, getTilingSchemeBySpatialReference, getExtent } from "@mapgis/webclient-cesium-plugin"
839
- import { IGSMapImageLayer } from "@mapgis/webclient-common"
840
-
841
- // 定义IGS地图图片图层服务的基地址
842
- const url = 'http://webclient.smaryun.com:8089/igs/rest/services/Map/湖北省4326/MapServer'
843
-
844
- // 创建地图图片图层对象
845
- igsMapImageLayer = new IGSMapImageLayer({
846
- url: url
847
- })
848
-
849
- // 获取地图图片图层服务的元信息
850
- igsMapImageLayer.load().then((layer) => {
851
- // 获取自定义的tilingScheme对象
852
- const tilingScheme = getTilingSchemeBySpatialReference(
853
- layer.spatialReference,
854
- layer.extent
855
- )
856
-
857
- // 获取图层显示范围
858
- const extent = getExtent(layer, tilingScheme.rectangle)
859
- const rectangle = new Cesium.Rectangle(
860
- extent.xmin,
861
- extent.ymin,
862
- extent.xmax,
863
- extent.ymax
864
- )
865
-
866
- // 构造provider对象
867
- provider = new Cesium.MapGISMapServerImageryProvider({
868
- // 服务基地址
869
- url: layer.url,
870
- // 瓦片宽度
871
- tileWidth: layer.imageWidth,
872
- // 瓦片高度
873
- tileHeight: layer.imageHeight,
874
- // 是否显示子图层
875
- layers: layer.layers,
876
- // 地图瓦片的切分方式,经纬度或者Web墨卡托
877
- tilingScheme,
878
- // 客户端id,用户的唯一标识;在地图服务中,调用接口时如果修改了地图的状态,包括设置动态投影、设置图层显示隐藏等,为了提升并发性能,服务端会根据clientId来生成临时地图,最佳做法是一个浏览器生成一个固定的唯一值;建议普通用户不要传该参数,webclient会根据当前浏览器生成一个固定的唯一值
879
- clientId: layer.clientId,
880
- // 支持IGS2.0动态投影
881
- projectionSrs: 'EPSG:4326',
882
- // 地图服务的加载范围
883
- rectangle,
884
- // 是否启用抗锯齿
885
- isAntialiasing: true
886
- })
887
-
888
- // 添加图层到Cesium视图中
889
- cesiumLayer = viewer.imageryLayers.addImageryProvider(provider)
890
- })</code></pre>
891
-
892
-
893
830
  <p class="code-caption"><h7>extendProps参数的配置方法</h7></p>
894
831
 
895
832
 
@@ -605,12 +605,6 @@
605
605
  <pre class="prettyprint"><code>// ES5引入方式
606
606
  // 获取provider的初始化参数
607
607
  const options = initializeOptions(layer, viewer)
608
608
  // 构造provider对象
609
609
  provider = new MapGISTileServerImageryProvider(options)
610
610
  // 添加图层到Cesium视图中
611
611
  cesiumLayer = viewer.imageryLayers.addImageryProvider(provider)
612
612
 
613
613
 
614
- <p class="code-caption"><h7>添加一个MapGIS瓦片服务:混合接口</h7></p>
615
-
616
-
617
- <pre class="prettyprint"><code>// ES5引入方式
618
614
  const { spatialReference, extent, tileInfo } = result
619
615
  const tilingScheme = getTilingSchemeBySpatialReference(
620
616
  spatialReference,
621
617
  extent,
622
618
  tileInfo
623
619
  )
624
620
  const rectangle = getExtent(
625
621
  { extent, spatialReference },
626
622
  tilingScheme.rectangle
627
623
  )
628
624
  viewer.imageryLayers.addImageryProvider(
629
625
  new MapGISTileServerImageryProvider({
630
626
  // 服务基地址
631
627
  url,
632
628
  // 瓦片宽度
633
629
  tileWidth: tileInfo.size[0],
634
630
  // 瓦片高度
635
631
  tileHeight: tileInfo.size[1],
636
632
  // 地图瓦片的切分方式,经纬度、Web墨卡托或自定义投影
637
633
  tilingScheme,
638
634
  // 瓦片服务的加载范围
639
635
  rectangle: new Cesium.Rectangle(
640
636
  rectangle.xmin,
641
637
  rectangle.ymin,
642
638
  rectangle.xmax,
643
639
  rectangle.ymax
644
640
  )
645
641
  })
646
642
  )
647
-
648
-
649
643
 
650
644
 
651
645
  </div>
@@ -588,7 +588,7 @@ const { Map, SceneViewCesium } = Zondy
588
588
  import { Map, SceneViewCesium } from "@mapgis/webclient-cesium-plugin"
589
589
  // 初始化图层管理容器
590
590
  const map = new Map();
591
- let innerView = new suplic3d.Map(viewId);
591
+ let innerView = new Cesium.Viewer(viewId);
592
592
  // 初始化地图视图对象
593
593
  const sceneView = new SceneViewCesium({
594
594
  // 视图id
@@ -124,12 +124,6 @@
124
124
  <pre class="prettyprint"><code>// ES5引入方式
125
125
  url: url
126
126
  // 获取provider的初始化参数
127
127
  const options = initializeOptions(layer, viewer)
128
128
  // 构造provider对象
129
129
  provider = new Cesium.WebMapServiceImageryProvider(options)
130
130
  // 添加图层到Cesium视图中
131
131
  cesiumLayer = viewer.imageryLayers.addImageryProvider(provider)
132
132
 
133
133
 
134
- <p class="code-caption"><h7>添加一个WMS服务:混合接口开发</h7></p>
135
-
136
-
137
- <pre class="prettyprint"><code>// ES5引入方式
138
134
  // 获取tilingScheme
139
135
  const tilingScheme = getTilingSchemeBySpatialReference(
140
136
  layer.spatialReference,
141
137
  layer.extent
142
138
  )
143
139
  // 获取图层范围
144
140
  const extent = getExtent(layer, tilingScheme.rectangle)
145
141
  const rectangle = new Cesium.Rectangle(
146
142
  extent.xmin,
147
143
  extent.ymin,
148
144
  extent.xmax,
149
145
  extent.ymax
150
146
  )
151
147
  // 获取服务基地址
152
148
  let url = layer.url
153
149
  // 设置token和tokenValue
154
150
  if (layer.tokenKey &amp;&amp; layer.tokenValue) {
155
151
  url = `${url}?${layer.tokenKey}=${layer.tokenValue}`
156
152
  }
157
153
  // 添加图层到Cesium视图中
158
154
  viewer.imageryLayers.addImageryProvider(
159
155
  new Cesium.WebMapServiceImageryProvider({
160
156
  // 服务基地址
161
157
  url,
162
158
  // 要显示的子图层
163
159
  layers: layer.layers,
164
160
  // WMS服务参数
165
161
  parameters: {
166
162
  // 图片格式
167
163
  format: layer.imageFormat,
168
164
  // 背景是否透明
169
165
  transparent: layer.imageTransparency,
170
166
  // 服务版本号
171
167
  version: layer.version
172
168
  },
173
169
  // 裁图方式
174
170
  tilingScheme,
175
171
  // 瓦片宽度
176
172
  tileWidth: layer.imageWidth,
177
173
  // 瓦片高度
178
174
  tileHeight: layer.imageHeight,
179
175
  // 服务版本为1.1.0 or 1.1.1时设置srs
180
176
  srs: `EPSG:${layer.spatialReference.wkid}`,
181
177
  // 服务版本>= 1.3.0时设置crs
182
178
  crs: `EPSG:${layer.spatialReference.wkid}`,
183
179
  // 瓦片服务的加载范围
184
180
  rectangle
185
181
  })
186
182
  )
187
-
188
-
189
183
 
190
184
 
191
185
  </div>
@@ -124,12 +124,6 @@
124
124
  <pre class="prettyprint"><code>// ES5引入方式
125
125
  url: url
126
126
  // 获取provider的初始化参数
127
127
  const options = initializeOptions(layer, viewer)
128
128
  // 构造provider对象
129
129
  provider = new Cesium.WebMapTileServiceImageryProvider(options)
130
130
  // 添加图层到Cesium视图中
131
131
  cesiumLayer = viewer.imageryLayers.addImageryProvider(provider)
132
132
 
133
133
 
134
- <p class="code-caption"><h7>添加一个WMTS服务:混合接口开发</h7></p>
135
-
136
-
137
- <pre class="prettyprint"><code>// ES5引入方式
138
134
  url: url
139
135
  // 获取自定义的tilingScheme对象
140
136
  const { tileMatrixSetId, tileMatrixSets } = layer.activeLayer
141
137
  const TileMatrixSet = tileMatrixSets.find(
142
138
  (tileMatrix) => tileMatrix.id === tileMatrixSetId
143
139
  )
144
140
  const tileInfo = TileMatrixSet.tileInfo
145
141
  let tilingScheme = getTilingSchemeBySpatialReference(
146
142
  layer.spatialReference,
147
143
  layer.activeLayer.extent,
148
144
  tileInfo
149
145
  )
150
146
  // 获取图层显示范围
151
147
  const extent = getExtent(layer, tilingScheme.rectangle)
152
148
  const rectangle = new Cesium.Rectangle(
153
149
  extent.xmin,
154
150
  extent.ymin,
155
151
  extent.xmax,
156
152
  extent.ymax
157
153
  )
158
154
  // 如果由token则设置token
159
155
  let url = layer.url
160
156
  if (layer.tokenValue &amp;&amp; layer.tokenKey) {
161
157
  url += `?${layer.tokenKey}=${layer.tokenValue}`
162
158
  }
163
159
  // 设置图层加载级数范围
164
160
  const tileMatrixLabels = []
165
161
  for (let i = 0; i &lt; tileInfo.lods.length; i++) {
166
162
  tileMatrixLabels.push(tileInfo.lods[i].level)
167
163
  }
168
164
  // 添加图层到Cesium视图中
169
165
  viewer.imageryLayers.addImageryProvider(
170
166
  new Cesium.WebMapTileServiceImageryProvider({
171
167
  // 服务基地址
172
168
  url,
173
169
  // 图层名称
174
170
  layer: layer.activeLayer.title,
175
171
  // 请求格式
176
172
  format: layer.activeLayer.imageFormat,
177
173
  // 瓦片样式
178
174
  style: layer.activeLayer.styleId,
179
175
  // 比例尺
180
176
  tileMatrixSetID: layer.activeLayer.tileMatrixSetId,
181
177
  // 裁图方式
182
178
  tilingScheme,
183
179
  // 瓦片宽度
184
180
  tileWidth: layer.imageWidth,
185
181
  // 瓦片高度
186
182
  tileHeight: layer.imageHeight,
187
183
  // 瓦片服务的加载范围
188
184
  rectangle,
189
185
  // 设置图层加载级数范围
190
186
  tileMatrixLabels
191
187
  })
192
188
  )
193
-
194
-
195
189
 
196
190
 
197
191
  </div>
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@mapgis/webclient-cesium-plugin",
3
- "version":"17.0.5",
3
+ "version":"17.0.7",
4
4
  "description": "",
5
5
  "main": "dist/webclient-cesium-plugin-es6.min.js",
6
6
  "scripts": {},