106 lines
4.2 KiB
HTML
106 lines
4.2 KiB
HTML
|
<!DOCTYPE html>
|
||
|
|
<html lang="en">
|
||
|
|
|
||
|
|
<head>
|
||
|
|
<meta charset="utf-8">
|
||
|
|
<meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1"> <!-- Use Chrome Frame in IE -->
|
||
|
|
<meta name="viewport"
|
||
|
|
content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no">
|
||
|
|
<meta name="description" content="A sample Vector dataset on terrain rendered with 3D Tiles.">
|
||
|
|
<meta name="cesium-sandcastle-labels" content="Showcases, 3D Tiles">
|
||
|
|
<title>3dtiles加载demo</title>
|
||
|
|
<script type="text/javascript" src="./Build/CesiumUnminified/Cesium.js"></script>
|
||
|
|
<script type="text/javascript" src="./Build/CustomCesiumSDK.js"></script>
|
||
|
|
</head>
|
||
|
|
|
||
|
|
<body class="sandcastle-loading" data-sandcastle-bucket="bucket-requirejs.html">
|
||
|
|
<style>
|
||
|
|
@import url(../Build/Cesium/Widgets/widgets.css);
|
||
|
|
|
||
|
|
html,
|
||
|
|
body,
|
||
|
|
#cesiumContainer {
|
||
|
|
width: 100%;
|
||
|
|
height: 100%;
|
||
|
|
margin: 0;
|
||
|
|
padding: 0;
|
||
|
|
overflow: hidden;
|
||
|
|
}
|
||
|
|
|
||
|
|
.cesium-viewer,
|
||
|
|
.cesium-viewer-cesiumWidgetContainer,
|
||
|
|
.cesium-widget {
|
||
|
|
width: 100%;
|
||
|
|
height: 100%;
|
||
|
|
margin: 0;
|
||
|
|
padding: 0;
|
||
|
|
overflow: hidden;
|
||
|
|
}
|
||
|
|
|
||
|
|
canvas {
|
||
|
|
width: 100%;
|
||
|
|
height: 100%;
|
||
|
|
margin: 0;
|
||
|
|
padding: 0;
|
||
|
|
overflow: hidden;
|
||
|
|
}
|
||
|
|
</style>
|
||
|
|
<div id="cesiumContainer" class="fullSize"></div>
|
||
|
|
<script id="cesium_sandcastle_script">
|
||
|
|
createMap();
|
||
|
|
var viewer;
|
||
|
|
var envelopeModelImageryProvider;
|
||
|
|
function createMap() {
|
||
|
|
viewer = new Cesium.Viewer('cesiumContainer', {
|
||
|
|
selectionIndicator: false,
|
||
|
|
useBrowserRecommendedResolution: true,
|
||
|
|
animation: false, //是否显示动画控件
|
||
|
|
baseLayerPicker: false, //是否显示图层选择控件
|
||
|
|
geocoder: false, //是否显示地名查找控件
|
||
|
|
timeline: false, //是否显示时间线控件
|
||
|
|
sceneModePicker: true, //是否显示投影方式控件
|
||
|
|
navigationHelpButton: false, //是否显示帮助信息控件
|
||
|
|
infoBox: false, //是否显示点击要素之后显示的信息
|
||
|
|
imageryProvider: false,
|
||
|
|
fullscreenButton: true
|
||
|
|
});
|
||
|
|
viewer.scene.globe.preloadAncestors = false;
|
||
|
|
viewer.scene.primitives.destroyPrimitives = false;
|
||
|
|
viewer.scene.globe.depthTestAgainstTerrain = true;
|
||
|
|
var imageryLayers = viewer.imageryLayers;
|
||
|
|
Cesium.viewer = viewer;
|
||
|
|
//加载天地图影像图层
|
||
|
|
var tiandituImageLayer1 = new Cesium.ImageryLayer(new Cesium.WebMapTileServiceImageryProvider({
|
||
|
|
url: "http://{s}.tianditu.gov.cn/img_c/wmts?service=wmts&request=GetTile&version=1.0.0" +
|
||
|
|
"&LAYER=img&tileMatrixSet=c&TileMatrix={TileMatrix}&TileRow={TileRow}&TileCol={TileCol}" +
|
||
|
|
"&style=default&format=tiles&tk=55b4d4eaef95384c946e9bd1b99c5610",
|
||
|
|
layer: "tdtImg_c",
|
||
|
|
style: "default",
|
||
|
|
format: "tiles",
|
||
|
|
tileMatrixSetID: "c",
|
||
|
|
subdomains: ["t0", "t1", "t2", "t3", "t4", "t5", "t6", "t7"],
|
||
|
|
tilingScheme: new Cesium.GeographicTilingScheme(),
|
||
|
|
tileMatrixLabels: ["1", "2", "3", "4", "5", "6", "7", "8", "9", "10", "11", "12", "13", "14", "15", "16", "17", "18", "19", "20", "21", "22", "23"],
|
||
|
|
maximumLevel: 17,
|
||
|
|
}));
|
||
|
|
viewer.imageryLayers.add(tiandituImageLayer1);
|
||
|
|
|
||
|
|
Cesium.ExperimentalFeatures.enableModelExperimental = true;
|
||
|
|
//加载倾斜模型
|
||
|
|
var tile3d = new Cesium.Cesium3DTileset({
|
||
|
|
url: 'http://127.0.0.1:5500/ware/upload/%E6%B2%A7%E5%B7%9E%E6%B8%AF%E8%A5%BF/%E6%B2%A7%E5%B7%9E%E6%B8%AF%E8%A5%BF/merge_tile.json',
|
||
|
|
});
|
||
|
|
viewer.scene.primitives.add(tile3d);
|
||
|
|
|
||
|
|
|
||
|
|
// 地图飞到模型所在位置,如果要手动设置地图位置，请关闭此方法
|
||
|
|
tile3d.readyPromise.then(function (tileset) {
|
||
|
|
viewer.flyTo(tileset);
|
||
|
|
});
|
||
|
|
return
|
||
|
|
}
|
||
|
|
</script>
|
||
|
|
</body>
|
||
|
|
|
||
|
|
</html>
|