|
|
@@ -3,8 +3,8 @@
|
|
|
:before-close="handleClose">
|
|
|
<div id="mapBox">
|
|
|
|
|
|
-<!-- 原来的直接使用的，修改1111111，将第一行放开，第二行注释-->
|
|
|
-<!-- <div id="mapContainer"></div>-->
|
|
|
+ <!-- 原来的直接使用的，修改1111111，将第一行放开，第二行注释-->
|
|
|
+ <!-- <div id="mapContainer"></div>-->
|
|
|
<iframe :src="src" frameborder="0"></iframe>
|
|
|
</div>
|
|
|
|
|
|
@@ -20,35 +20,35 @@ export default {
|
|
|
src: systemConfig.single_map,
|
|
|
viewer: '',
|
|
|
centerPoint: {},
|
|
|
- cesiumConfig: {
|
|
|
- animation: false, //动画控制不显示
|
|
|
- timeline: false, //时间线不显示
|
|
|
- fullscreenButton: false, //全屏按钮不显示
|
|
|
- imageryProvider: new SkyScenery.SingleTileImageryProvider({
|
|
|
- url: (function createColorCanvas(color) {
|
|
|
- let width = 1,
|
|
|
- height = 1;
|
|
|
- let canvas = document.createElement("canvas");
|
|
|
- canvas.width = width;
|
|
|
- canvas.height = height;
|
|
|
- let ctx = canvas.getContext("2d");
|
|
|
- ctx.fillStyle = color;
|
|
|
- ctx.fillRect(0, 0, width, height);
|
|
|
- return canvas.toDataURL();
|
|
|
- })("#ffffff00"),
|
|
|
- rectangle: SkyScenery.Rectangle.fromDegrees(-180.0, -90.0, 180.0, 90.0),
|
|
|
- }),
|
|
|
- infoBox: false,
|
|
|
- baseLayerPicker: false, //地图切换不显示
|
|
|
- geocoder: false,
|
|
|
- homeButton: false,
|
|
|
- selectionIndicator: false, // 去除绿色选择框
|
|
|
- sceneModePicker: false,
|
|
|
- navigationHelpButton: false,
|
|
|
- navigationInstructionsInitiallyVisible: false,
|
|
|
- scene3DOnly: true, // 仅以3D渲染以节省GPU内存
|
|
|
- useBrowserRecommendedResolution: true, // 以浏览器建议的分辨率渲染
|
|
|
- },
|
|
|
+ // cesiumConfig: {
|
|
|
+ // animation: false, //动画控制不显示
|
|
|
+ // timeline: false, //时间线不显示
|
|
|
+ // fullscreenButton: false, //全屏按钮不显示
|
|
|
+ // imageryProvider: new SkyScenery.SingleTileImageryProvider({
|
|
|
+ // url: (function createColorCanvas(color) {
|
|
|
+ // let width = 1,
|
|
|
+ // height = 1;
|
|
|
+ // let canvas = document.createElement("canvas");
|
|
|
+ // canvas.width = width;
|
|
|
+ // canvas.height = height;
|
|
|
+ // let ctx = canvas.getContext("2d");
|
|
|
+ // ctx.fillStyle = color;
|
|
|
+ // ctx.fillRect(0, 0, width, height);
|
|
|
+ // return canvas.toDataURL();
|
|
|
+ // })("#ffffff00"),
|
|
|
+ // rectangle: SkyScenery.Rectangle.fromDegrees(-180.0, -90.0, 180.0, 90.0),
|
|
|
+ // }),
|
|
|
+ // infoBox: false,
|
|
|
+ // baseLayerPicker: false, //地图切换不显示
|
|
|
+ // geocoder: false,
|
|
|
+ // homeButton: false,
|
|
|
+ // selectionIndicator: false, // 去除绿色选择框
|
|
|
+ // sceneModePicker: false,
|
|
|
+ // navigationHelpButton: false,
|
|
|
+ // navigationInstructionsInitiallyVisible: false,
|
|
|
+ // scene3DOnly: true, // 仅以3D渲染以节省GPU内存
|
|
|
+ // useBrowserRecommendedResolution: true, // 以浏览器建议的分辨率渲染
|
|
|
+ // },
|
|
|
}
|
|
|
},
|
|
|
props: {
|
|
|
@@ -98,10 +98,8 @@ export default {
|
|
|
}
|
|
|
// 加载3DTiles
|
|
|
else if (type === 1) {
|
|
|
- // let url = app.item.url + '/tileset.json'
|
|
|
- // app.add3DTiles(url)
|
|
|
- // http://localhost:8080/map-server/index.html?dataType=threeD&url=http://1.119.143.102:9002/model_data/750/qinghulu/output/tileset.json
|
|
|
- this.src = systemConfig.single_map + "?dataType=threeD&url=" + app.item.url + '/tileset.json'
|
|
|
+ let url = app.item.url + '/tileset.json'
|
|
|
+ app.add3DTiles(url)
|
|
|
}
|
|
|
// 加载gltf
|
|
|
else if (type === 2) {
|
|
|
@@ -130,33 +128,36 @@ export default {
|
|
|
},
|
|
|
// 添加模型
|
|
|
add3DTiles(url) {
|
|
|
- let app = this;
|
|
|
- let tile = undefined;
|
|
|
- if (!url || url == '') {
|
|
|
- app.$message.warning('请检查模型地址');
|
|
|
- app.handleClose()
|
|
|
- return;
|
|
|
- }
|
|
|
- tile = SkyScenery.add3DTilesData(url, viewer);
|
|
|
- tile.tileFailed.addEventListener(function (err) {
|
|
|
- app.$message({ message: '模型加载失败', type: 'error' });
|
|
|
- app.handleClose()
|
|
|
- })
|
|
|
- tile.readyPromise.then(function () {
|
|
|
- viewer.zoomTo(tile, {
|
|
|
- heading: 2.718565,
|
|
|
- pitch: -0.415366,
|
|
|
- roll: 0.0,
|
|
|
- });
|
|
|
- }).catch(err => {
|
|
|
- app.$message({
|
|
|
- dangerouslyUseHTMLString: true,
|
|
|
- message: '模型加载失败，' + err.statusCode + '：' + err.response,
|
|
|
- type: 'error'
|
|
|
- });
|
|
|
- app.handleClose()
|
|
|
- });
|
|
|
- return tile;
|
|
|
+ // http://localhost:8080/map-server/index.html?dataType=threeD&url=http://1.119.143.102:9002/model_data/750/qinghulu/output/tileset.json
|
|
|
+ this.src = systemConfig.single_map + "?dataType=threeD&url=" + url;
|
|
|
+ // return;
|
|
|
+ // let app = this;
|
|
|
+ // let tile = undefined;
|
|
|
+ // if (!url || url == '') {
|
|
|
+ // app.$message.warning('请检查模型地址');
|
|
|
+ // app.handleClose()
|
|
|
+ // return;
|
|
|
+ // }
|
|
|
+ // tile = SkyScenery.add3DTilesData(url, viewer);
|
|
|
+ // tile.tileFailed.addEventListener(function (err) {
|
|
|
+ // app.$message({ message: '模型加载失败', type: 'error' });
|
|
|
+ // app.handleClose()
|
|
|
+ // })
|
|
|
+ // tile.readyPromise.then(function () {
|
|
|
+ // viewer.zoomTo(tile, {
|
|
|
+ // heading: 2.718565,
|
|
|
+ // pitch: -0.415366,
|
|
|
+ // roll: 0.0,
|
|
|
+ // });
|
|
|
+ // }).catch(err => {
|
|
|
+ // app.$message({
|
|
|
+ // dangerouslyUseHTMLString: true,
|
|
|
+ // message: '模型加载失败，' + err.statusCode + '：' + err.response,
|
|
|
+ // type: 'error'
|
|
|
+ // });
|
|
|
+ // app.handleClose()
|
|
|
+ // });
|
|
|
+ // return tile;
|
|
|
},
|
|
|
// 添加gltf
|
|
|
addGltf(url) {
|
|
|
@@ -187,7 +188,7 @@ export default {
|
|
|
});
|
|
|
},
|
|
|
addMap(url, type) {
|
|
|
-// 原来的直接使用的，修改3333333
|
|
|
+ // 原来的直接使用的，修改3333333
|
|
|
|
|
|
// viewer.imageryLayers.removeAll(true);
|
|
|
// if(type==''){
|
|
|
@@ -201,22 +202,22 @@ export default {
|
|
|
// new SkyScenery.UrlTemplateImageryProvider({
|
|
|
// url: url + '/{z}/{x}/{y}.png',
|
|
|
// fileExtension: 'png'
|
|
|
- // })
|
|
|
+ // })flyToPrimitive
|
|
|
// )
|
|
|
// }
|
|
|
|
|
|
// 二维加载
|
|
|
-// if (type == '') {
|
|
|
-// this.src = systemConfig.single_map + "?dataType=twoD&mapType=twoD&mapserverType=arcgis&url=" + url
|
|
|
-// } else if (type == 'xyz') {
|
|
|
-// this.src = systemConfig.single_map + "?dataType=twoD&mapType=twoD&mapserverType=xyz&url=" + url +"/{z}/{x}/{y}.png";
|
|
|
-// }
|
|
|
+ // if (type == '') {
|
|
|
+ // this.src = systemConfig.single_map + "?dataType=twoD&mapType=twoD&mapserverType=arcgis&url=" + url
|
|
|
+ // } else if (type == 'xyz') {
|
|
|
+ // this.src = systemConfig.single_map + "?dataType=twoD&mapType=twoD&mapserverType=xyz&url=" + url +"/{z}/{x}/{y}.png";
|
|
|
+ // }
|
|
|
|
|
|
// 三维加载
|
|
|
if (type == '') {
|
|
|
this.src = systemConfig.single_map + "?dataType=twoD&mapType=threeD&mapserverType=arcgis&url=" + url
|
|
|
} else if (type == 'xyz') {
|
|
|
- this.src = systemConfig.single_map + "?dataType=twoD&mapType=threeD&mapserverType=xyz&url=" + url +"/{z}/{x}/{y}.png";
|
|
|
+ this.src = systemConfig.single_map + "?dataType=twoD&mapType=threeD&mapserverType=xyz&url=" + url + "/{z}/{x}/{y}.png";
|
|
|
}
|
|
|
},
|
|
|
flyToPrimitive(obj) {
|
|
|
@@ -250,7 +251,7 @@ export default {
|
|
|
|
|
|
iframe {
|
|
|
width: 100%;
|
|
|
- height:500px;
|
|
|
+ height: 500px;
|
|
|
}
|
|
|
|
|
|
#mapContainer {
|
zhanhan