Cesium加载3DTileset
2024-04-07 本文已影响0人
zhuyx0304
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Cesium加载3DTileset</title>
<link rel="stylesheet" href="../Cesium/Widgets/widgets.css" />
<script src="../Cesium/Cesium.js"></script>
<style>
html,
body {
margin: 0;
width: 100%;
height: 100%;
}
#cesiumContainer {
width: 100%;
height: 100%;
background-color: #f2f2f2;
}
</style>
</head>
<body>
<div id="cesiumContainer"></div>
<script>
Cesium.Ion.defaultAccessToken = "eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJqdGkiOiI4ZmI2Njk5Zi00NjdmLTRiMzctODZiYS1hYTQ0MGFhMjQxMGIiLCJpZCI6MzE2ODksInNjb3BlcyI6WyJhc3IiLCJnYyJdLCJpYXQiOjE1OTU4MzQzNzV9.ee2r1thnG3Ajot3BYpFXfNKUP8SUtWpYDx2na02mT0A";
var viewer = new Cesium.Viewer("cesiumContainer");
var tileSet = new Cesium.Cesium3DTileset({
url: "https://earthsdk.com/v/last/Apps/assets/dayanta/tileset.json",
});
var tx = 200;
var ty = 0;
var tz = -430;
var rx = 0;
var ry = 0;
var rz = 0;
var scale = 1;
tileSet.readyPromise.then(function (argument) {
viewer.scene.primitives.add(tileSet);
var cartographic = Cesium.Cartographic.fromCartesian(
tileSet.boundingSphere.center
);
var surface = Cesium.Cartesian3.fromRadians(
cartographic.longitude,
cartographic.latitude,
cartographic.height
);
var m = Cesium.Transforms.eastNorthUpToFixedFrame(surface);
//平移
var _tx = tx ? tx : 0;
var _ty = ty ? ty : 0;
var _tz = tz ? tz : 0;
var tempTranslation = new Cesium.Cartesian3(_tx, _ty, _tz);
var offset = Cesium.Matrix4.multiplyByPoint(
m,
tempTranslation,
new Cesium.Cartesian3(0, 0, 0)
);
var translation = Cesium.Cartesian3.subtract(
offset,
surface,
new Cesium.Cartesian3()
);
tileSet.modelMatrix = Cesium.Matrix4.fromTranslation(translation);
//旋转及缩放
if (rx) {
var mx = Cesium.Matrix3.fromRotationX(Cesium.Math.toRadians(rx));
var rotate = Cesium.Matrix4.fromRotationTranslation(mx);
Cesium.Matrix4.multiply(m, rotate, m);
}
if (ry) {
var my = Cesium.Matrix3.fromRotationY(Cesium.Math.toRadians(ry));
var rotate = Cesium.Matrix4.fromRotationTranslation(my);
Cesium.Matrix4.multiply(m, rotate, m);
}
if (rz) {
var mz = Cesium.Matrix3.fromRotationZ(Cesium.Math.toRadians(rz));
var rotate = Cesium.Matrix4.fromRotationTranslation(mz);
Cesium.Matrix4.multiply(m, rotate, m);
}
if (scale) {
var _scale = Cesium.Matrix4.fromUniformScale(scale);
Cesium.Matrix4.multiply(m, _scale, m);
}
tileSet._root.transform = m;
viewer.flyTo(tileSet);
//参照点
var entity = {
id: "test",
point: new Cesium.PointGraphics({
heightReference: Cesium.HeightReference.CLAMP_TO_GROUND,
color: Cesium.Color.fromCssColorString("#ff0033"),
pixelSize: 30,
outlineColor: Cesium.Color.fromCssColorString("#ff0033"),
outlineWidth: 1,
}),
position: surface,
};
viewer.entities.add(entity);
});
</script>
</body>
</html>
