<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="Cesium/Cesium.js"></script>
<link rel="stylesheet" href="Cesium/Widgets/widgets.css">
<style>
.item{
margin: 10px;
height: 50px;
line-height: 50px;
width: 100px;
background-color: #2874a7;
color: white;
font-size: 20px;
text-align: center;
border-radius: 5%;
cursor:pointer;
box-shadow: 0 0 1px 1px #66ccff;
}
</style>
</head>
<body>
<div id="cesiumContainer"></div>
<div style="position: absolute;z-index:10;top: 10px;left: 10px;">
<div class="item" id="draw">绘制</div>
<div class="item" id="remove">清除</div>
</div>
<!--
cesium 3dtiles 简单模型压平
功能描述：绘制四边形实现3dtiles 模型压平
数据介绍：cesium版本1.105，数据使用ceisumlab3处理，内有3dtiles测试数据，可以替换为自己的倾斜摄影数据。
-->
<!--使用cesiumlab3处理-->
<script>
var viewer = new Cesium.Viewer('cesiumContainer')
let tileset = add3DTiles('Cesium/Cesium3DTiles/shshp/tileset.json')
viewer.zoomTo(tileset)
let polygonPos = []
let polygon = undefined
function add3DTiles(url) {
var primitive = new Cesium.Cesium3DTileset({
url: url,
})
var tileset = viewer.scene.primitives.add(primitive)
return tileset
}
let isDrawing = true
let points=[]
var handler = new Cesium.ScreenSpaceEventHandler(viewer.scene.canvas)
handler.setInputAction(evt=>{
const pickpos = viewer.scene.pickPosition(evt.position)
console.log(pickpos)
if(isDrawing){
if(polygonPos.length > 2 && !polygon){
polygon = viewer.entities.add({
polygon:{
hierarchy:new Cesium.CallbackProperty(()=>{
return new Cesium.PolygonHierarchy(polygonPos)
},false),
material:Cesium.Color.fromCssColorString('#e36d62').withAlpha(0.5),
perPositionHeight :true
}
})
}
if(pickpos){
polygonPos.push(pickpos)
points.push(viewer.entities.add({
position:pickpos,
point:{
color:Cesium.Color.DEEPPINK,
pixelSize:10
}
}))
}
}
},Cesium.ScreenSpaceEventType.LEFT_DOWN)
handler.setInputAction(evt=>{
if(polygon){
polygon.polygon=
{
hierarchy:new Cesium.PolygonHierarchy(polygonPos),
material:Cesium.Color.fromCssColorString('#a8e362').withAlpha(0.2),
perPositionHeight :true
}
let customerShader = new Cesium.CustomShader({
lightingModel:Cesium.LightingModel.UNLIT,
uniforms:{
u1pos:{
type:Cesium.UniformType.VEC3,
value:polygonPos[0]
},
u2pos:{
type:Cesium.UniformType.VEC3,
value:polygonPos[1]
},
u3pos:{
type:Cesium.UniformType.VEC3,
value:polygonPos[2]
},
u4pos:{
type:Cesium.UniformType.VEC3,
value:polygonPos[3]
}
},
vertexShaderText:`
void vertexMain(VertexInput vsInput, inout czm_modelVertexOutput vsOutput) {
vec3 p = vsOutput.positionMC;
float px = p.x;
float pz = p.z;
vec4 u1posMC = czm_inverseModel * vec4(u1pos,1.);
vec4 u2posMC = czm_inverseModel * vec4(u2pos,1.);
vec4 u3posMC = czm_inverseModel * vec4(u3pos,1.);
vec4 u4posMC = czm_inverseModel * vec4(u4pos,1.);
bool flag = false;
vec4 tem1;
vec4 tem2;
for(int i=0;i<4;i++){
if(i == 0) {
tem1 = u1posMC;
tem2 = u4posMC;
}
else if(i == 1){
tem1 = u2posMC;
tem2 = u1posMC;
}
else if(i == 2){
tem1 = u3posMC;
tem2 = u2posMC;
}
else {
tem1 = u4posMC;
tem2 = u3posMC;
}
float sx = tem1.x;
float sz = tem1.z;
float tx = tem2.x;
float tz = tem2.z;
if((sx == px && sz ==pz) ||(tx == px && tz ==pz)){
// return true;
// return
}
if((sz < pz && tz >= pz) || (sz >= pz && tz < pz)) {
float x = sx + (pz - sz) * (tx - sx) / (tz - sz);
if(x == px) {
// return true;
// return
}
if(x > px) {
flag = !flag;
}
}
}//for end
if(flag){
vsOutput.positionMC.y = tem1.y ;
}
}
`
})
tileset.customShader = customerShader
}
isDrawing = false
},Cesium.ScreenSpaceEventType.RIGHT_CLICK)
function draw(){
isDrawing = true
}
function remove(){
console.log('清除')
isDrawing = false
polygonPos =[]
points.forEach(
item=>{
viewer.entities.remove(item)
}
)
points =[]
viewer.entities.remove(polygon)
polygon = undefined
}
document.getElementById('draw').onclick = function (){
draw()
}
document.getElementById('remove').onclick = function (){
remove()
}
</script>
</body>
</html>
cesium模型多边形压平 （379个子文件） 
NoLod_0.b3dm 529KB index.cjs 3.76MB widgets.css 29KB lighter.css 6KB InfoBoxDescription.css 5KB Timeline.css 3KB Animation.css 3KB CesiumInspector.css 3KB BaseLayerPicker.css 2KB Cesium3DTilesInspector.css 2KB CesiumWidget.css 2KB NavigationHelpButton.css 2KB Viewer.css 2KB shared.css 2KB InfoBox.css 2KB lighter.css 2KB Geocoder.css 2KB SceneModePicker.css 2KB ProjectionPicker.css 1KB lighter.css 1KB lighterShared.css 1KB lighter.css 734B lighter.css 495B SelectionIndicator.css 472B VoxelInspector.css 449B lighter.css 438B PerformanceWatchdog.css 371B lighter.css 307B FullscreenButton.css 193B VRButton.css 169B
info-loading.gif 723B
模型压平.html 7KB
waterNormals.jpg 287KB StarBurst.jpg 191KB tycho2t3_80_mz.jpg 164KB tycho2t3_80_py.jpg 149KB tycho2t3_80_pz.jpg 149KB tycho2t3_80_my.jpg 149KB tycho2t3_80_px.jpg 120KB tycho2t3_80_mx.jpg 116KB DirtMask.jpg 111KB waterNormalsSmall.jpg 33KB moonSmall.jpg 18KB 2.jpg 16KB 2.jpg 16KB 2.jpg 16KB 3.jpg 15KB 1.jpg 15KB 3.jpg 15KB 0.jpg 14KB 1.jpg 13KB 1.jpg 13KB 1.jpg 13KB 3.jpg 12KB 1.jpg 12KB 1.jpg 12KB 2.jpg 12KB 0.jpg 12KB 3.jpg 12KB 3.jpg 12KB 3.jpg 12KB 2.jpg 11KB 2.jpg 11KB 1.jpg 11KB 1.jpg 11KB 2.jpg 11KB 3.jpg 11KB 0.jpg 10KB 0.jpg 10KB 0.jpg 10KB 3.jpg 10KB 1.jpg 10KB 1.jpg 10KB 0.jpg 9KB 0.jpg 9KB 1.jpg 9KB 0.jpg 9KB 0.jpg 8KB 0.jpg 8KB 2.jpg 8KB 0.jpg 8KB 0.jpg 7KB 0.jpg 7KB 1.jpg 7KB 0.jpg 6KB Cesium.js 3.71MB index.js 3.71MB google-earth-dbroot-parser.js 214KB Transforms-c842a68c.js 122KB draco_decoder_nodejs.js 57KB Matrix2-7a8e9daf.js 36KB basis_transcoder.js 33KB GeometryPipeline-87cdea8e.js 30KB pako_deflate.min.js 27KB createVerticesFromHeightmap.js 26KB decodeGoogleEarthEnterprisePacket.js 25KB transcodeKTX2.js 24KB Matrix3-b2351961.js 23KB pako_inflate.min.js 21KB FrustumGeometry-2418e7ca.js 19KB共 379 条
- 1
- 2
- 3
- 4
资源评论
