mirror of
https://github.com/jiawanlong/Cesium-Examples.git
synced 2025-11-04 01:04:17 +00:00
127 lines
11 KiB
HTML
127 lines
11 KiB
HTML
|
<!--********************************************************************
|
|||
|
|
* by jiawanlong
|
|||
|
|
*********************************************************************-->
|
|||
|
|
<!DOCTYPE html>
|
|||
|
|
<html>
|
|||
|
|
|
|||
|
|
<head>
|
|||
|
|
<meta charset="UTF-8" />
|
|||
|
|
<link rel="stylesheet" href="./../../libs/cesium/Cesium1.98/Widgets/widgets.css">
|
|||
|
|
<script type="text/javascript" src="./../../libs/cesium/Cesium1.98/Cesium.js"></script>
|
|||
|
|
</head>
|
|||
|
|
|
|||
|
|
<body style="margin: 0; overflow: hidden; background: #fff; width: 100%; height: 100%; position: absolute; top: 0">
|
|||
|
|
<div id="map" style="margin: 0 auto; width: 100%; height: 100%"></div>
|
|||
|
|
|
|||
|
|
<script>
|
|||
|
|
window.viewer = new Cesium.Viewer('map', {
|
|||
|
|
imageryProvider: false,
|
|||
|
|
baseLayerPicker: false,
|
|||
|
|
});
|
|||
|
|
var xyz = new Cesium.UrlTemplateImageryProvider({
|
|||
|
|
"credit": "安徽",
|
|||
|
|
"url": '///data.mars3d.cn/tile/img/{z}/{x}/{y}.jpg'
|
|||
|
|
})
|
|||
|
|
viewer.imageryLayers.addImageryProvider(xyz)
|
|||
|
|
|
|||
|
|
viewer.camera.setView({
|
|||
|
|
destination: new Cesium.Cartesian3(-2003945.3424044803, 4773507.038891283, 3715452.5835408773)
|
|||
|
|
});
|
|||
|
|
|
|||
|
|
initBoxByPoint();
|
|||
|
|
|
|||
|
|
// 获取法线
|
|||
|
|
function calculateFlatNormalsForUniqueVertices(positions, indices) {
|
|||
|
|
const normals = new Float32Array(positions.length);
|
|||
|
|
|
|||
|
|
// 遍历每个三角形（每次处理3个顶点）
|
|||
|
|
for (let i = 0; i < indices.length; i += 3) {
|
|||
|
|
const idx0 = indices[i] * 3;
|
|||
|
|
const idx1 = indices[i + 1] * 3;
|
|||
|
|
const idx2 = indices[i + 2] * 3;
|
|||
|
|
|
|||
|
|
// 获取三个顶点
|
|||
|
|
const v0 = new Cesium.Cartesian3(
|
|||
|
|
positions[idx0], positions[idx0 + 1], positions[idx0 + 2]
|
|||
|
|
);
|
|||
|
|
const v1 = new Cesium.Cartesian3(
|
|||
|
|
positions[idx1], positions[idx1 + 1], positions[idx1 + 2]
|
|||
|
|
);
|
|||
|
|
const v2 = new Cesium.Cartesian3(
|
|||
|
|
positions[idx2], positions[idx2 + 1], positions[idx2 + 2]
|
|||
|
|
);
|
|||
|
|
|
|||
|
|
// 计算面法线
|
|||
|
|
const edge1 = Cesium.Cartesian3.subtract(v1, v0, new Cesium.Cartesian3());
|
|||
|
|
const edge2 = Cesium.Cartesian3.subtract(v2, v0, new Cesium.Cartesian3());
|
|||
|
|
const normal = Cesium.Cartesian3.cross(edge1, edge2, new Cesium.Cartesian3());
|
|||
|
|
Cesium.Cartesian3.normalize(normal, normal);
|
|||
|
|
|
|||
|
|
// 为当前三角形的三个顶点分配相同的法线
|
|||
|
|
normals[idx0] = normal.x;
|
|||
|
|
normals[idx0 + 1] = normal.y;
|
|||
|
|
normals[idx0 + 2] = normal.z;
|
|||
|
|
|
|||
|
|
normals[idx1] = normal.x;
|
|||
|
|
normals[idx1 + 1] = normal.y;
|
|||
|
|
normals[idx1 + 2] = normal.z;
|
|||
|
|
|
|||
|
|
normals[idx2] = normal.x;
|
|||
|
|
normals[idx2 + 1] = normal.y;
|
|||
|
|
normals[idx2 + 2] = normal.z;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
return normals;
|
|||
|
|
}
|
|||
|
|
function initBoxByPoint() {
|
|||
|
|
let data = [-2003945.3424044803, 4773507.038891283, 3715452.5835408773, -2004171.8367897924, 4774097.084890106, 3714578.0835560053, -2004542.2096753595, 4773946.193350379, 3714572.2005745447, -2003945.3424044803, 4773507.038891283, 3715452.5835408773, -2004542.2096753595, 4773946.193350379, 3714572.2005745447, -2004631.714509523, 4773270.00446036, 3715387.2892478365, -2003945.3424044803, 4773507.038891283, 3715452.5835408773, -2006477.844799862, 4773574.330908435, 3718277.6524704783, -2004631.714509523, 4773270.00446036, 3715387.2892478365, -2006008.4909140684, 4769972.560882526, 3718854.071208643, -2003945.3424044803, 4773507.038891283, 3715452.5835408773, -2006477.844799862, 4773574.330908435, 3718277.6524704783, -2006008.4909140684, 4769972.560882526, 3718854.071208643, -2006477.844799862, 4773574.330908435, 3718277.6524704783, -2006172.8188565937, 4770349.896287658, 3718285.2088177577, -2006008.4909140684, 4769972.560882526, 3718854.071208643, -2006172.8188565937, 4770349.896287658, 3718285.2088177577, -2008423.103866201, 4770213.024152933, 3717252.812132867, -2006008.4909140684, 4769972.560882526, 3718854.071208643, -2008423.103866201, 4770213.024152933, 3717252.812132867, -2008869.9510247037, 4769803.862714468, 3717534.485377227, -2008423.103866201, 4770213.024152933, 3717252.812132867, -2009574.201254783, 4771576.616040394, 3715066.506344073, -2008869.9510247037, 4769803.862714468, 3717534.485377227, -2008423.103866201, 4770213.024152933, 3717252.812132867, -2009092.7870780064, 4771712.772315694, 3714980.6600793265, -2009574.201254783, 4771576.616040394, 3715066.506344073, -2008423.103866201, 4770213.024152933, 3717252.812132867, -2007879.3550177275, 4773799.2068911, 3717239.239944381, -2009092.7870780064, 4771712.772315694, 3714980.6600793265, -2006172.8188565937, 4770349.896287658, 3718285.2088177577, -2007879.3550177275, 4773799.2068911, 3717239.239944381, -2008423.103866201, 4770213.024152933, 3717252.812132867, -2006172.8188565937, 4770349.896287658, 3718285.2088177577, -2006477.844799862, 4773574.330908435, 3718277.6524704783, -2007879.3550177275, 4773799.2068911, 3717239.239944381, -2006477.844799862, 4773574.330908435, 3718277.6524704783, -2005769.8956437844, 4773653.226262081, 3714287.8984415266, -2007879.3550177275, 4773799.2068911, 3717239.239944381, -2004631.714509523, 4773270.00446036, 3715387.2892478365, -2005769.8956437844, 4773653.226262081, 3714287.8984415266, -2006477.844799862, 4773574.330908435, 3718277.6524704783, -2004631.714509523, 4773270.00446036, 3715387.2892478365, -2004542.2096753595, 4773946.193350379, 3714572.2005745447, -2005769.8956437844, 4773653.226262081, 3714287.8984415266, -2004542.2096753595, 4773946.193350379, 3714572.2005745447, -2004682.816532249, 4774312.491676953, 3714029.1569458223, -2005769.8956437844, 4773653.226262081, 3714287.8984415266, -2005769.8956437844, 4773653.226262081, 3714287.8984415266, -2004682.816532249, 4774312.491676953, 3714029.1569458223, -2006081.9480042446, 4773742.278952149, 3714006.8029777, -2006445.794754688, 4773739.351211261, 3713815.3055837494, -2005769.8956437844, 4773653.226262081, 3714287.8984415266, -2006081.9480042446, 4773742.278952149, 3714006.8029777, -2006445.794754688, 4773739.351211261, 3713815.3055837494, -2007879.3550177275, 4773799.2068911, 3717239.239944381, -2005769.8956437844, 4773653.226262081, 3714287.8984415266, -2007879.3550177275, 4773799.2068911, 3717239.239944381, -2008900.4899347625, 4772474.087523398, 3714112.4482767247, -2006445.794754688, 4773739.351211261, 3713815.3055837494, -2007879.3550177275, 4773799.2068911, 3717239.239944381, -2008900.4899347625, 4772474.087523398, 3714112.4482767247, -2009092.7870780064, 4771712.772315694, 3714980.6600793265, -2009092.7870780064, 4771712.772315694, 3714980.6600793265, -2008900.4899347625, 4772474.087523398, 3714112.4482767247, -2009632.1911288982, 4772064.660800657, 3714071.0000892845, -2009092.7870780064, 4771712.772315694, 3714980.6600793265, -2009632.1911288982, 4772064.660800657, 3714071.0000892845, -2009664.5507714734, 4772006.666697331, 3714127.6225422225,
|
|||
|
|
const vertices = new Float64Array(data)
|
|||
|
|
|
|||
|
|
let indices = []
|
|||
|
|
for (let index = 0; index < data.length; index++) {
|
|||
|
|
indices.push(index)
|
|||
|
|
}
|
|||
|
|
let indicess = new Uint16Array(indices)
|
|||
|
|
|
|||
|
|
const geometry = new Cesium.Geometry({
|
|||
|
|
attributes: {
|
|||
|
|
position: new Cesium.GeometryAttribute({
|
|||
|
|
componentDatatype: Cesium.ComponentDatatype.DOUBLE,
|
|||
|
|
componentsPerAttribute: 3,
|
|||
|
|
values: vertices
|
|||
|
|
}),
|
|||
|
|
normal: new Cesium.GeometryAttribute({
|
|||
|
|
componentDatatype: Cesium.ComponentDatatype.FLOAT,
|
|||
|
|
componentsPerAttribute: 3,
|
|||
|
|
values: calculateFlatNormalsForUniqueVertices(vertices, indicess)
|
|||
|
|
})
|
|||
|
|
},
|
|||
|
|
indices: indicess,
|
|||
|
|
primitiveType: Cesium.PrimitiveType.TRIANGLES,
|
|||
|
|
boundingSphere: Cesium.BoundingSphere.fromVertices(vertices)
|
|||
|
|
})
|
|||
|
|
const instance = new Cesium.GeometryInstance({
|
|||
|
|
geometry: geometry,
|
|||
|
|
})
|
|||
|
|
viewer.scene.primitives.add(new Cesium.Primitive({
|
|||
|
|
geometryInstances: instance,
|
|||
|
|
asynchronous: false, // 关闭异步
|
|||
|
|
|
|||
|
|
appearance: new Cesium.MaterialAppearance({
|
|||
|
|
material: Cesium.Material.fromType('Color', {
|
|||
|
|
color: Cesium.Color.fromCssColorString(`rgba(68,138,145, 1)`)
|
|||
|
|
}),
|
|||
|
|
faceForward: true, // 确保法线朝向正确
|
|||
|
|
}),
|
|||
|
|
asynchronous: false,
|
|||
|
|
compressVertices: false,
|
|||
|
|
}))
|
|||
|
|
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
|
|||
|
|
</script>
|
|||
|
|
|
|||
|
|
</body>
|
|||
|
|
|
|||
|
|
</html>
|