本帖最后由 18979425409 于 2023-6-27 16:20 编辑
功能：在地图场景下，点击按钮，销毁地图场景并切换到园区场景；在园区场景下，点击另一个按钮销毁园区场景并切换回地图场景。
1.准备工作
通过创建App对象，对3D场景进行初始化，创建地图场景，创建两个按钮切换按钮
- var app = new THING.App()
- app.background = [0, 0, 0]
- var map //地图场景
- var campus // 园区场景
- THING.Utils.dynamicLoad(['https://www.thingjs.com/uearth/history/uearth.min.v1.7.20.js'], function () {
- // 新建一个地图
- map = app.create({
- type: 'Map',
- style: {
- night: false
- },
- attribution: '高德'
- });
- // 新建一个瓦片图层
- var tileLayer = app.create({
- type: 'TileLayer',
- name: 'tileLayer1',
- url: 'https://webst0{1,2,3,4}.is.autonavi.com/appmaptile?style=6&x={x}&y={y}&z={z}',
- maximumLevel: 16,
- });
- // 将瓦片图层添加到map中
- map.addLayer(tileLayer);
- new THING.widget.Button('切换园区', changeToCam)
- new THING.widget.Button('切换城市', changeToMap)
- })
2.由地图场景切换到园区场景
- function changeToCam(){
- // 销毁地图
- map.destroy()
- // 加载场景代码
- app = new THING.App({
- url: 'https://www.thingjs.com/static/models/factory', // 场景地址
- background: '#000000',
- env: 'Seaside',
- });
- campus = app.query(".Campus")[0]
- app.level.change(app.query(".Campus")[0])
- //设置/获取摄像机 UP 方向，默认值为 [0,1,0]
- app.camera.up = [0, 1, 0]
- //观察某物体
- app.camera.fit(campus);
- }
3.由园区场景切换到地图场景
- function changeToMap(){
- // 销毁园区场景
- campus.destroy()
- app = new THING.App();
- map = app.create({
- type: 'Map',
- // 地图场景地址
- url: 'https://city.thingjs.com/ra/city/mapProject/config/TVRRNE9UYzRNZz09Q2l0eUJ1aWxkZXJAMjAxOQ==',
- complete: function (event) {
- }
- });
- //设置/获取摄像机 UP 方向，默认值为 [0,1,0]
- app.camera.up = [0, 1, 0]
- //观察某物体
- app.camera.fit(map)
- })
- }
app.camera.up文档地址：https://support.thingjs.com/book/thingjs-api10/62a8170c6634aa32be547d1e#up
app.camera.fit()文档地址：https://support.thingjs.com/book/thingjs-api10/62a8170c6634aa32be547d1e#fit(param)
|
|
|
|
|
|
|
|
|
|
1943
0
