Skip to content

Commit 672d9d0

Browse files
zhurczhurc
committed
fix 部分接口注释&&更改mbgl three图层示例底图为iserver地图
1 parent efb5488 commit 672d9d0

File tree

10 files changed

+158
-38
lines changed

10 files changed

+158
-38
lines changed

‎dist/iclient9-mapboxgl.js

Lines changed: 17 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -58360,7 +58360,7 @@ var ThreeLayer = exports.ThreeLayer = function (_mapboxgl$Evented) {
5836058360
value: function remove() {
5836158361
var map = this._map,
5836258362
me = this;
58363-
map.off('move', me._update.bind(me));
58363+
map.off('render', me._update.bind(me));
5836458364
map.off('resize', me._resize.bind(me));
5836558365
me.renderer.remove();
5836658366
me._map = null;
@@ -58403,12 +58403,12 @@ var ThreeLayer = exports.ThreeLayer = function (_mapboxgl$Evented) {
5840358403
this.renderer.renderScene();
5840458404
/**
5840558405
* renderScene 事件，场景渲染后触发
58406-
* @event mapboxgl.supermap.ThreeLayer#renderScene
58406+
* @event mapboxgl.supermap.ThreeLayer#renderscene
5840758407
* @type {Object}
58408-
* @property {string} type - renderScene
58408+
* @property {string} type - renderscene
5840958409
* @property {Object} target - layer
5841058410
*/
58411-
this.fire("renderScene");
58411+
this.fire("renderscene");
5841258412
return this;
5841358413
}
5841458414
}, {
@@ -58646,9 +58646,17 @@ var GraphicLayer = exports.GraphicLayer = function () {
5864658646
function GraphicLayer(id, options) {
5864758647
_classCallCheck(this, GraphicLayer);
5864858648

58649+
var opt = _Util.Util.extend(this, defaultProps, options);
58650+
/**
58651+
* @member mapboxgl.supermap.GraphicLayer.prototype.id - {string}
58652+
* @description 高效率点图层id
58653+
*/
5864958654
this.id = id || _iclientCommon.CommonUtil.createUniqueID("graphicLayer_");
58650-
this.graphics = options.graphics;
58651-
_Util.Util.extend(this, defaultProps, options);
58655+
/**
58656+
* @member mapboxgl.supermap.GraphicLayer.prototype.graphics - {Array<mapboxgl.supermap.Graphic>}
58657+
* @description 点要素对象数组
58658+
*/
58659+
this.graphics = opt.graphics;
5865258660
}
5865358661

5865458662
/**
@@ -58744,6 +58752,8 @@ var GraphicLayer = exports.GraphicLayer = function () {
5874458752
}, {
5874558753
key: 'remove',
5874658754
value: function remove() {
58755+
this.map.off('move', this._moveEvent.bind(this));
58756+
this.map.off('resize', this._resizeEvent.bind(this));
5874758757
this.map.getCanvasContainer().removeChild(this.canvas);
5874858758
}
5874958759

@@ -58756,7 +58766,7 @@ var GraphicLayer = exports.GraphicLayer = function () {
5875658766
}, {
5875758767
key: 'removeFromMap',
5875858768
value: function removeFromMap() {
58759-
this.map.getCanvasContainer().removeChild(this.canvas);
58769+
this.remove();
5876058770
}
5876158771

5876258772
/**

‎dist/iclient9-mapboxgl.min.js

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎examples/mapboxgl/js/ThreeApplication.js

Lines changed: 8 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -75,10 +75,15 @@ var SceneBuilder = {
7575
var material = new THREE.MultiMaterial(materials);
7676
for (var i = 0; i < materials.length; i++) {
7777
materials[i].transparent = true;
78+
materials[i].vertexColors = THREE.FaceColors;
7879
}
7980

8081
scaleGeometry(geometry);
8182

83+
for (var i = 0; i < geometry.faces.length; i++) {
84+
geometry.faces[i].color = new THREE.Color(0x08acff);
85+
geometry.colorsNeedUpdate = true;
86+
}
8287
app.buildingMesh = new THREE.Mesh(geometry, material);
8388
app.buildingMesh.geometry.computeBoundingSphere();
8489
}
@@ -351,10 +356,8 @@ function BuildingView(app) {
351356
scene.add(buildingMesh);
352357

353358
// line helper (building)
354-
var edgeHelper = new THREE.EdgesHelper(buildingMesh, 0x000000, 80);
355-
edgeHelper.material.transparent = true;
356-
edgeHelper.material.opacity = 0.3;
357-
edgeHelper.material.linewidth = 1;
359+
var edgeHelper = new THREE.EdgesHelper(buildingMesh, 0x02f7f8, 1);
360+
edgeHelper.material.linewidth = 10;
358361
correctionObject3D(edgeHelper);
359362
scene.add(edgeHelper);
360363

@@ -368,7 +371,7 @@ function BuildingView(app) {
368371
scene.add(roofMesh);
369372

370373
// line helper (roof)
371-
roofEdgeHelper = new THREE.EdgesHelper(roofMesh, 0x000000, 20);
374+
roofEdgeHelper = new THREE.EdgesHelper(roofMesh, 0x02f7f8, 20);
372375
roofEdgeHelper.material.transparent = true;
373376
roofEdgeHelper.material.opacity = 0.2;
374377
roofEdgeHelper.material.linewidth = 1;

‎examples/mapboxgl/js/obj/building/building.js

Lines changed: 0 additions & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎examples/mapboxgl/threejsLayer_airplane.html

Lines changed: 25 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -26,13 +26,36 @@
2626
<script type="text/javascript" include="three,LoaderSupport,GLTFLoader" src="../../dist/include-mapboxgl.js"></script>
2727
<script>
2828

29-
mapboxgl.accessToken = 'pk.eyJ1IjoibW9ua2VyIiwiYSI6ImNpd2Z6aTE5YTAwdHEyb2tpOWs2ZzRydmoifQ.LwQMRArUP8Q9P7QApuOIHg';
29+
var attribution = "<a href='https://www.mapbox.com/about/maps/' target='_blank'>© Mapbox </a>" +
30+
"| Map Data <span>© <a href='http://support.supermap.com.cn/product/iServer.aspx' target='_blank'>SuperMap iServer</a></span> " +
31+
" with <span>© <a href='http://iclient.supermap.io' target='_blank'>SuperMap iClient</a></span>";
32+
33+
var host = window.isLocal ? window.server : "http://support.supermap.com.cn:8090",
34+
url = host + "/iserver/services/map-china400/rest/maps/ChinaDark";
35+
3036
var map, threeLayer,
3137
position = [104.0688174135384, 30.548051075500908];
3238

3339
map = new mapboxgl.Map({
3440
container: 'map',
35-
style: 'mapbox://styles/mapbox/dark-v9',
41+
style: {
42+
"version": 8,
43+
"sources": {
44+
"raster-tiles": {
45+
"attribution": attribution,
46+
"type": "raster",
47+
"tiles": [url + '/zxyTileImage.png?z={z}&x={x}&y={y}'],
48+
"tileSize": 256,
49+
},
50+
},
51+
"layers": [{
52+
"id": "simple-tiles",
53+
"type": "raster",
54+
"source": "raster-tiles",
55+
"minzoom": 0,
56+
"maxzoom": 22
57+
}]
58+
},
3659
center: [104.0693966828, 30.5760411152],
3760
zoom: 13.23,
3861
bearing: 0.8568,

‎examples/mapboxgl/threejsLayer_bird.html

Lines changed: 25 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -66,12 +66,35 @@
6666
</script>
6767
<script>
6868

69-
mapboxgl.accessToken = 'pk.eyJ1IjoibW9ua2VyIiwiYSI6ImNpd2Z6aTE5YTAwdHEyb2tpOWs2ZzRydmoifQ.LwQMRArUP8Q9P7QApuOIHg';
69+
var attribution = "<a href='https://www.mapbox.com/about/maps/' target='_blank'>© Mapbox </a>" +
70+
"| Map Data <span>© <a href='http://support.supermap.com.cn/product/iServer.aspx' target='_blank'>SuperMap iServer</a></span> " +
71+
" with <span>© <a href='http://iclient.supermap.io' target='_blank'>SuperMap iClient</a></span>";
72+
73+
var host = window.isLocal ? window.server : "http://support.supermap.com.cn:8090",
74+
url = host + "/iserver/services/map-china400/rest/maps/ChinaDark";
75+
7076
var map, threeLayer, position = [104.05108830860604, 30.57183314034];
7177

7278
map = new mapboxgl.Map({
7379
container: 'map',
74-
style: 'mapbox://styles/mapbox/streets-v9',
80+
style: {
81+
"version": 8,
82+
"sources": {
83+
"raster-tiles": {
84+
"attribution": attribution,
85+
"type": "raster",
86+
"tiles": [url + '/zxyTileImage.png?z={z}&x={x}&y={y}'],
87+
"tileSize": 256,
88+
},
89+
},
90+
"layers": [{
91+
"id": "simple-tiles",
92+
"type": "raster",
93+
"source": "raster-tiles",
94+
"minzoom": 0,
95+
"maxzoom": 22
96+
}]
97+
},
7598
center: [104.05108830860604, 30.57183314034],
7699
zoom: 18.02,
77100
bearing: 18.13,

‎examples/mapboxgl/threejsLayer_buildings.html

Lines changed: 36 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -27,17 +27,40 @@
2727
<script type="text/javascript" src="./js/ThreeApplication.js"></script>
2828
<script>
2929

30-
mapboxgl.accessToken = 'pk.eyJ1IjoibW9ua2VyIiwiYSI6ImNpd2Z6aTE5YTAwdHEyb2tpOWs2ZzRydmoifQ.LwQMRArUP8Q9P7QApuOIHg';
30+
31+
var attribution = "<a href='https://www.mapbox.com/about/maps/' target='_blank'>© Mapbox </a>" +
32+
"| Map Data <span>© <a href='http://support.supermap.com.cn/product/iServer.aspx' target='_blank'>SuperMap iServer</a></span> " +
33+
" with <span>© <a href='http://iclient.supermap.io' target='_blank'>SuperMap iClient</a></span>";
34+
35+
var host = window.isLocal ? window.server : "http://support.supermap.com.cn:8090",
36+
url = host + "/iserver/services/map-china400/rest/maps/ChinaDark";
3137

3238
var map, threeLayer;
3339

3440
map = new mapboxgl.Map({
3541
container: 'map',
36-
style: 'mapbox://styles/mapbox/streets-v9',
37-
center: [104.0712824591451, 30.560567575197524],
38-
zoom: 17.42,
42+
style: {
43+
"version": 8,
44+
"sources": {
45+
"raster-tiles": {
46+
"attribution": attribution,
47+
"type": "raster",
48+
"tiles": [url + '/zxyTileImage.png?z={z}&x={x}&y={y}'],
49+
"tileSize": 256,
50+
},
51+
},
52+
"layers": [{
53+
"id": "simple-tiles",
54+
"type": "raster",
55+
"source": "raster-tiles",
56+
"minzoom": 0,
57+
"maxzoom": 22
58+
}]
59+
},
60+
center: [104.07099170795755, 30.560115990796447],
61+
zoom: 19.54,
3962
pitch: 60,
40-
bearing: 28
63+
bearing: 36
4164
});
4265

4366
addThreeLayer();
@@ -47,17 +70,20 @@
4770
//gl参数表示使用webgl渲染，forceRefresh强制不断刷新three的场景
4871
threeLayer = new mapboxgl.supermap.ThreeLayer('three');
4972
threeLayer.on("initialized", render);
73+
threeLayer.addTo(map);
5074

5175
function render() {
5276
var renderer = threeLayer.getThreeRenderer(),
5377
scene = threeLayer.getScene(),
5478
camera = threeLayer.getCamera();
5579

56-
this.light = new THREE.PointLight(0xeeeeee, 0.8);
80+
this.light = new THREE.PointLight(0xffffff, 0.8);
5781
this.light.position.copy(camera.position);
5882
scene.add(this.light);
59-
scene.add(new THREE.AmbientLight(0x333333));
60-
83+
scene.add(new THREE.AmbientLight(0x04589e));
84+
var directionalLight = new THREE.DirectionalLight(0xffffff, 1);
85+
directionalLight.position.set(0, 0, 0);
86+
scene.add(directionalLight);
6187
ThreeApplication
6288
.register(renderer, scene, camera)
6389
.setTargetLayer(threeLayer)
@@ -67,10 +93,10 @@
6793

6894
//均匀光照，与相机位置同步
6995
threeLayer.on("render", function () {
70-
threeLayer.light.position.copy(threeLayer.renderer.camera.position);
96+
// threeLayer.light.position.copy(threeLayer.renderer.camera.position);
97+
threeLayer.light.position.set(0, 0, 0);
7198
});
7299

73-
threeLayer.addTo(map);
74100
}
75101

76102
</script>

‎examples/mapboxgl/threejsLayer_facility.html

Lines changed: 28 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -28,12 +28,37 @@
2828

2929
<script>
3030

31-
mapboxgl.accessToken = 'pk.eyJ1IjoibW9ua2VyIiwiYSI6ImNpd2Z6aTE5YTAwdHEyb2tpOWs2ZzRydmoifQ.LwQMRArUP8Q9P7QApuOIHg';
31+
var attribution = "<a href='https://www.mapbox.com/about/maps/' target='_blank'>© Mapbox </a>" +
32+
"| Map Data <span>© <a href='http://support.supermap.com.cn/product/iServer.aspx' target='_blank'>SuperMap iServer</a></span> " +
33+
" with <span>© <a href='http://iclient.supermap.io' target='_blank'>SuperMap iClient</a></span>";
34+
3235
var map, threeLayer, position = [116.466502, 39.990706];
3336

37+
var host = window.isLocal ? window.server : "http://117.122.248.69:8090",
38+
url = host + "/iserver/services/map-china400/rest/maps/ChinaDark";
39+
40+
3441
map = new mapboxgl.Map({
3542
container: 'map',
36-
style: 'mapbox://styles/mapbox/streets-v9',
43+
style: {
44+
"version": 8,
45+
"sources": {
46+
"raster-tiles": {
47+
"attribution": attribution,
48+
"type": "raster",
49+
"tiles": [url + '/zxyTileImage.png?z={z}&x={x}&y={y}'],
50+
"tileSize": 256,
51+
},
52+
},
53+
"layers": [{
54+
"id": "simple-tiles",
55+
"type": "raster",
56+
"source": "raster-tiles",
57+
"minzoom": 0,
58+
"maxzoom": 22
59+
}],
60+
"glyphs": host + "/iserver/services/map-beijing/rest/maps/beijingMap/tileFeature/sdffonts/{fontstack}/{range}.pbf",
61+
},
3762
center: [116.46548484988489, 39.990389660427695],
3863
zoom: 15.91,
3964
bearing: 59.19,
@@ -75,7 +100,6 @@
75100
threeLayer = new mapboxgl.supermap.ThreeLayer('three');
76101

77102
threeLayer.on("initialized", render);
78-
threeLayer.addTo(map);
79103

80104
function render() {
81105
var renderer = threeLayer.getThreeRenderer(),
@@ -94,6 +118,7 @@
94118
threeLayer.on("render", function () {
95119
threeLayer.light.position.copy(threeLayer.renderer.camera.position);
96120
});
121+
threeLayer.addTo(map);
97122
}
98123

99124
function loadOverlays() {

‎src/mapboxgl/overlay/GraphicLayer.js

Lines changed: 14 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -38,9 +38,18 @@ const defaultProps = {
3838
export class GraphicLayer {
3939

4040
constructor(id, options) {
41+
let opt = Util.extend(this, defaultProps, options);
42+
/**
43+
* @member mapboxgl.supermap.GraphicLayer.prototype.id - {string}
44+
* @description 高效率点图层id
45+
*/
4146
this.id = id || CommonUtil.createUniqueID("graphicLayer_");
42-
this.graphics = options.graphics;
43-
Util.extend(this, defaultProps, options);
47+
/**
48+
* @member mapboxgl.supermap.GraphicLayer.prototype.graphics - {Array<mapboxgl.supermap.Graphic>}
49+
* @description 点要素对象数组
50+
*/
51+
this.graphics = opt.graphics;
52+
4453
}
4554

4655
/**
@@ -130,6 +139,8 @@ export class GraphicLayer {
130139
* @description 删除该图层
131140
*/
132141
remove() {
142+
this.map.off('move', this._moveEvent.bind(this));
143+
this.map.off('resize', this._resizeEvent.bind(this));
133144
this.map.getCanvasContainer().removeChild(this.canvas);
134145
}
135146

@@ -139,7 +150,7 @@ export class GraphicLayer {
139150
* @description 删除该图层
140151
*/
141152
removeFromMap() {
142-
this.map.getCanvasContainer().removeChild(this.canvas);
153+
this.remove();
143154
}
144155

145156
/**

‎src/mapboxgl/overlay/ThreeLayer.js

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -360,7 +360,7 @@ export class ThreeLayer extends mapboxgl.Evented {
360360
*/
361361
remove() {
362362
let map = this._map, me = this;
363-
map.off('move', me._update.bind(me));
363+
map.off('render', me._update.bind(me));
364364
map.off('resize', me._resize.bind(me));
365365
me.renderer.remove();
366366
me._map = null;
@@ -397,12 +397,12 @@ export class ThreeLayer extends mapboxgl.Evented {
397397
this.renderer.renderScene();
398398
/**
399399
* renderScene 事件，场景渲染后触发
400-
* @event mapboxgl.supermap.ThreeLayer#renderScene
400+
* @event mapboxgl.supermap.ThreeLayer#renderscene
401401
* @type {Object}
402-
* @property {string} type - renderScene
402+
* @property {string} type - renderscene
403403
* @property {Object} target - layer
404404
*/
405-
this.fire("renderScene");
405+
this.fire("renderscene");
406406
return this;
407407
}
408408

0 commit comments

Comments
 (0)
pFad - Phonifier reborn

Pfad - The Proxy pFad of © 2024 Garber Painting. All rights reserved.

Note: This service is not intended for secure transactions such as banking, social media, email, or purchasing. Use at your own risk. We assume no liability whatsoever for broken pages.


Alternative Proxies:

Alternative Proxy

pFad Proxy

pFad v3 Proxy

pFad v4 Proxy