huangmh
/
client_iot-daoshi-template-v
1
0
Fork 1
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

fix: 贴图

ShangHai_LongXiang
高志龙 3 years ago
parent
a8fed07d67
commit
df095d8b1e
1 changed files with 296 additions and 147 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 441
      public/static/qm/MainMap_QM_go.js

441
public/static/qm/MainMap_QM_go.js
View File

@ -243,7 +243,7 @@ QMUtil = function () {
{ key: 'ludeng', url: 'static/img/model/ludeng.glb', colorModel: 'gama', rot: { x: 1.5708, y: 0, z: 0 }, size: { x: 20, y: 20, z: 20 }, load: false },
{ key: 'taiyangsan', url: 'static/img/model/taiyangsan.glb', colorModel: 'gama', rot: { x: 1.5708, y: 0, z: 0 }, size: { x: 20, y: 20, z: 20 }, load: false },
{ key: 'honglvdeng', url: 'static/img/model/honglvdeng.glb', colorModel: 'gama', rot: { x: 1.5708, y: 0, z: 0 }, size: { x: 20, y: 20, z: 20 }, load: false },
{ key: 'park_paly', url: 'static/img/model/park_paly.glb', colorModel: 'gama', rot: { 'x': 1.5708, 'y': 0, 'z': 0 }, size: { 'x': 80, 'y': 80, 'z': 80 }, load:false},
{
key: 'chongdianzhuang',
url: 'static/img/model/chongdianzhuang.glb',
@ -335,24 +335,104 @@ QMUtil = function () {
this.rightPoint //右侧平行线交点
}
this.assignUVs = function (geometry) {
geometry.computeBoundingBox()
var max = geometry.boundingBox.max,
min = geometry.boundingBox.min
var offset = new THREE.Vector2(0 - min.x, 0 - min.y)
var range = new THREE.Vector2(max.x - min.x, max.y - min.y)
var faces = geometry.faces
geometry.faceVertexUvs[0] = []
for (var i = 0; i < faces.length; i++) {
var v1 = geometry.vertices[faces[i].a],
v2 = geometry.vertices[faces[i].b],
v3 = geometry.vertices[faces[i].c]
geometry.faceVertexUvs[0].push([
new THREE.Vector2((v1.x + offset.x) / range.x, (v1.y + offset.y) / range.y),
new THREE.Vector2((v2.x + offset.x) / range.x, (v2.y + offset.y) / range.y),
new THREE.Vector2((v3.x + offset.x) / range.x, (v3.y + offset.y) / range.y)
])
}
geometry.uvsNeedUpdate = true
geometry.computeBoundingBox();
let max = geometry.boundingBox.max,
min = geometry.boundingBox.min;
let offset = new THREE.Vector2(0 - min.x, 0 - min.y);
let range = new THREE.Vector2(max.x - min.x, max.y - min.y);
let addX=1, addY=1;
range.x/range.y < 1 ? (addX = range.x/range.y) : (addY = range.y/range.x)
geometry.faceVertexUvs[0] = [];
for (let face of geometry.faces) {
let v1 = geometry.vertices[face.a],
v2 = geometry.vertices[face.b],
v3 = geometry.vertices[face.c];
if(face.normal.z == 0){ //侧面
if(range.x/range.y >= 1){
let repY = range.y/256 >= 2 ? 256:range.y;
face.materialIndex = Math.abs(face.normal.x) < 0.7 ? 2 : 1;
geometry.faceVertexUvs[0].push(face.materialIndex == 1 ? [
new THREE.Vector2((v1.y + offset.y) / repY, v1.z / 512),
new THREE.Vector2((v2.y + offset.y) / repY, v2.z / 512),
new THREE.Vector2((v3.y + offset.y) / repY, v3.z / 512)
] : [
new THREE.Vector2((v1.x + offset.x) / range.x, v1.z / 64),
new THREE.Vector2((v2.x + offset.x) / range.x, v2.z / 64),
new THREE.Vector2((v3.x + offset.x) / range.x, v3.z / 64)
]);
}else{
face.materialIndex = Math.abs(face.normal.x) < 0.7 ? 1 : 2;
geometry.faceVertexUvs[0].push(face.materialIndex == 1 ? [
new THREE.Vector2((v1.x + offset.x) / range.x, v1.z / 512),
new THREE.Vector2((v2.x + offset.x) / range.x, v2.z / 512),
new THREE.Vector2((v3.x + offset.x) / range.x, v3.z / 512)
] : [
new THREE.Vector2((v1.y + offset.y) / range.y, v1.z / 64),
new THREE.Vector2((v2.y + offset.y) / range.y, v2.z / 64),
new THREE.Vector2((v3.y + offset.y) / range.y, v3.z / 64)
]);
}
}else{ //顶面和底面
face.materialIndex = 0;
geometry.faceVertexUvs[0].push([
new THREE.Vector2((v1.x + offset.x) / range.x*addX, (v1.y + offset.y) / range.y*addY),
new THREE.Vector2((v2.x + offset.x) / range.x*addX, (v2.y + offset.y) / range.y*addY),
new THREE.Vector2((v3.x + offset.x) / range.x*addX, (v3.y + offset.y) / range.y*addY)
]);
}
}
geometry.uvsNeedUpdate = true;
}
this.packUv = function (geometry){
geometry.computeBoundingBox();
let max = geometry.boundingBox.max,
min = geometry.boundingBox.min;
let offset = new THREE.Vector2(0 - min.x, 0 - min.y);
let range = new THREE.Vector2(max.x - min.x, max.y - min.y);
geometry.faceVertexUvs[0] = [];
let allReag = 0;
for(let i=0; i< geometry.faces.length; i+=2){
let v1 = geometry.vertices[geometry.faces[i].a],
v2 = geometry.vertices[geometry.faces[i].b];
if(geometry.faces[i].normal.z == 0){ //侧面
if(Math.abs(geometry.faces[i].normal.x) < 0.7){ //左右
allReag+=Math.abs(v2.x-v1.x);
}else{
allReag+=Math.abs(v2.y-v1.y);
}
}
}
for (let face of geometry.faces) {
let v1 = geometry.vertices[face.a],
v2 = geometry.vertices[face.b],
v3 = geometry.vertices[face.c];
if(face.normal.z == 0){ //侧面
face.materialIndex = 1;
if(Math.abs(face.normal.x) < 0.7){ //前后
geometry.faceVertexUvs[0].push([
new THREE.Vector2((v1.x + offset.x) / allReag, v1.z / 512),
new THREE.Vector2((v2.x + offset.x) / allReag, v2.z / 512),
new THREE.Vector2((v3.x + offset.x) / allReag, v3.z / 512)
])
}else{
geometry.faceVertexUvs[0].push([
new THREE.Vector2((v1.y + offset.y) / allReag, v1.z / 512),
new THREE.Vector2((v2.y + offset.y) / allReag, v2.z / 512),
new THREE.Vector2((v3.y + offset.y) / allReag, v3.z / 512)
])
}
}else{ //顶面和底面
face.materialIndex = 0;
geometry.faceVertexUvs[0].push([
new THREE.Vector2((v1.x + offset.x) / range.x, (v1.y + offset.y) / range.y),
new THREE.Vector2((v2.x + offset.x) / range.x, (v2.y + offset.y) / range.y),
new THREE.Vector2((v3.x + offset.x) / range.x, (v3.y + offset.y) / range.y)
]);
}
}
}
/**
* 检测点是否在多边形区域内
@ -2007,7 +2087,7 @@ MainMap_QM.prototype = {
}
})
object.scene.children[0].scale.set(sopce.util.modelStr[sopce.index].size.x, sopce.util.modelStr[sopce.index].size.y, Map_QM.util.modelStr[sopce.index].size.z)
sopce.util.fbxModels.push({ key: sopce.util.modelStr[sopce.index].key, obj: object.scene, operation: Map_QM.util.modelStr[sopce.index] })
sopce.util.fbxModels.push({ key: sopce.util.modelStr[sopce.index].key, obj: object, operation: Map_QM.util.modelStr[sopce.index] })
if (sopce.index < sopce.util.modelStr.length - 1) {
sopce.index++
sopce.initTreeModel()
@ -5176,12 +5256,18 @@ FloorMap_QM.prototype = {
for (let t = 0; t < mapData.models.length; t++) {
for (let i = 0; i < Map_QM.util.fbxModels.length; i++) {
if (mapData.models[t].type == Map_QM.util.fbxModels[i].key) {
let obj = Map_QM.util.fbxModels[i].obj.clone()
obj.position.set(mapData.models[t].x, -1 * mapData.models[t].y, mapData.models[t].site)
obj.scale.set(mapData.models[t].scale, mapData.models[t].scale, mapData.models[t].scale)
obj.rotateX(Map_QM.util.fbxModels[i].operation.rot.x)
obj.rotateY((-1 * mapData.models[t].angle * Math.PI) / 180)
this.allObj.add(obj)
let obj = Map_QM.util.fbxModels[i].obj.scene.clone();
obj.position.set(mapData.models[t].x, -1 * mapData.models[t].y, mapData.models[t].site);
obj.scale.set(mapData.models[t].scale, mapData.models[t].scale, mapData.models[t].scale);
obj.rotateX(Map_QM.util.fbxModels[i].operation.rot.x);
obj.rotateY(-1 * mapData.models[t].angle * Math.PI / 180);
obj.renderOrder = 100;
for (let k = 0; k < Map_QM.util.fbxModels[i].obj.animations.length; k++) {
let mixer = new THREE.AnimationMixer(obj)
mixer.clipAction(Map_QM.util.fbxModels[i].obj.animations[k]).play()
Map_QM.mixers.push(mixer)
}
this.allObj.add(obj);
}
}
}
@ -5844,16 +5930,16 @@ FloorMap_QM.prototype = {
}
}
//显示车位编号
if (mapData.parkArea[i].parkNum != 'NaN' && i % 10 == 0) {
let shopDiv = document.createElement('div')
shopDiv.style.cssText = css_LR
shopDiv.style.visibility = 'hidden'
shopDiv.textContent = mapData.parkArea[i].parkNum
let shopLabel = new THREE.CSS2DObject(shopDiv)
shopLabel.name = mapData.parkArea[i].name
shopLabel.position.set(mapData.parkArea[i].xaxis >> 0, (-1 * mapData.parkArea[i].yaxis) >> 0, parseInt(mapData.parkArea[i].toHeight) + 1)
this.labelObj.add(shopLabel)
}
// if (mapData.parkArea[i].parkNum != 'NaN' && i % 10 == 0) {
// let shopDiv = document.createElement('div')
// shopDiv.style.cssText = css_LR
// shopDiv.style.visibility = 'hidden'
// shopDiv.textContent = mapData.parkArea[i].parkNum
// let shopLabel = new THREE.CSS2DObject(shopDiv)
// shopLabel.name = mapData.parkArea[i].name
// shopLabel.position.set(mapData.parkArea[i].xaxis >> 0, (-1 * mapData.parkArea[i].yaxis) >> 0, parseInt(mapData.parkArea[i].toHeight) + 1)
// this.labelObj.add(shopLabel)
// }
}
}
let mahc = this.Model_QM.MyParkShape(shapeArr, materials, parkHeight, borderColor)
@ -5901,98 +5987,170 @@ MyModel_QM.prototype.MyParkShape = function (shapes, materials, toHeight = 5, bo
}
MyModel_QM.prototype.MyModelShape = function (areaArr, howllowArr, opObj, entityColor = 0xdadada, lineColor = 0xeeeeee, indexOrder = 1) {
let len = areaArr.length
if (len == 0) {
return
}
let alphaModle = opObj.alphaModle / 100 || 0
// 实例化shape对象
let shape = new THREE.Shape()
// 设置开始点的位置
shape.moveTo(areaArr[0][0], -1 * areaArr[0][1])
for (let i = 0; i < areaArr.length; i++) {
if (areaArr[i].length == 4) {
shape.lineTo(areaArr[i][2], -1 * areaArr[i][3])
} else {
shape.bezierCurveTo(areaArr[i][2], -1 * areaArr[i][3], areaArr[i][4], -1 * areaArr[i][5], areaArr[i][6], -1 * areaArr[i][7])
}
}
let material;
let matcolor = new THREE.Color(lineColor)
for (let k = 0; k < Map_QM.util.lineBasicMaterialArr.length; k++) {
if (Map_QM.util.lineBasicMaterialArr[k].color.equals(matcolor)) {
material = Map_QM.util.lineBasicMaterialArr[k]
}
}
if (!material) {
material = new THREE.LineBasicMaterial({
color: lineColor,
opacity: 0.8,
let len = areaArr.length;
if (len == 0) {
return;
}
let alphaModle = opObj.alphaModle / 100 || 0;
// 实例化shape对象
let shape = new THREE.Shape();
// 设置开始点的位置
shape.moveTo(areaArr[0][0], -1 * areaArr[0][1]);
for (let i = 0; i < areaArr.length; i++) {
if (areaArr[i].length == 4) {
shape.lineTo(areaArr[i][2], -1 * areaArr[i][3]);
} else {
shape.bezierCurveTo(areaArr[i][2], -1 * areaArr[i][3], areaArr[i][4], -1 * areaArr[i][5], areaArr[i][6], -1 * areaArr[i][7]);
}
}
let material;
let matcolor = new THREE.Color(lineColor)
for (let k = 0; k < Map_QM.util.lineBasicMaterialArr.length; k++) {
if (Map_QM.util.lineBasicMaterialArr[k].color.equals(matcolor)) {
material = Map_QM.util.lineBasicMaterialArr[k];
}
}
if (!material) {
material = new THREE.LineBasicMaterial({
color: lineColor,
opacity: 0.8,
transparent: true
}) //材质对象lineColor
Map_QM.util.lineBasicMaterialArr.push(material)
}
if (howllowArr && howllowArr.length > 0) {
for (let n = 0; n < howllowArr.length; n++) {
let hole = new THREE.Path() // 添加孔洞
hole.moveTo(howllowArr[n][0][0], -1 * howllowArr[n][0][1])
for (let k = 0; k < howllowArr[n].length; k++) {
if (howllowArr[n][k].length == 4) {
hole.lineTo(howllowArr[n][k][2], -1 * howllowArr[n][k][3])
} else {
hole.bezierCurveTo(howllowArr[n][k][2], -1 * howllowArr[n][k][3], howllowArr[n][k][4], -1 * howllowArr[n][k][5], howllowArr[n][k][6], -1 * howllowArr[n][k][7])
}
}
shape.holes.push(hole)
}
}
let scanGeometry,
meshMaterial,
options = {
depth: parseInt(opObj.toHeight),
bevelEnabled: false,
curveSegments: 12
}
}); //材质对象lineColor
Map_QM.util.lineBasicMaterialArr.push(material);
}
if (howllowArr && howllowArr.length > 0) {
for (let n = 0; n < howllowArr.length; n++) {
let hole = new THREE.Path(); // 添加孔洞
hole.moveTo(howllowArr[n][0][0], -1 * howllowArr[n][0][1]);
for (let k = 0; k < howllowArr[n].length; k++) {
if (howllowArr[n][k].length == 4) {
hole.lineTo(howllowArr[n][k][2], -1 * howllowArr[n][k][3]);
} else {
hole.bezierCurveTo(howllowArr[n][k][2], -1 * howllowArr[n][k][3], howllowArr[n][k][4], -1 * howllowArr[n][k][5], howllowArr[n][k][6], -1 * howllowArr[n][k][7]);
}
}
shape.holes.push(hole);
}
}
scanGeometry = new THREE.ExtrudeGeometry(shape, options)
let color2 = new THREE.Color(entityColor)
for (let e = 0; e < Map_QM.util.meshMaterialArr.length; e++) {
if (Map_QM.util.meshMaterialArr[e].color.equals(color2) && Map_QM.util.meshMaterialArr[e].opacity == alphaModle) {
meshMaterial = Map_QM.util.meshMaterialArr[e]
}
}
if (!meshMaterial) {
meshMaterial = new THREE.MeshPhongMaterial({
//MeshStandardMaterial MeshPhongMaterial
color: entityColor,
transparent: true,
opacity: alphaModle,
side: THREE.DoubleSide,
depthTest: true
})
//meshMaterial.color.convertLinearToGamma(0.4);
Map_QM.util.meshMaterialArr.push(meshMaterial)
}
if (opObj.angleY || opObj.angleZ) {
Map_QM.util.rotateYZ(scanGeometry, (opObj.angleY * Math.PI) / 180, (opObj.angleZ * Math.PI) / 180)
}
// 创建模型
let mesh = new THREE.Mesh(scanGeometry, meshMaterial)
if (!Map_QM.util.toMapModel && opObj.type != 'wall') {
let cubeEdges = new THREE.EdgesGeometry(scanGeometry, 60)
let cubeLine = new THREE.LineSegments(cubeEdges, material)
cubeLine.renderOrder = indexOrder - 5
mesh.add(cubeLine)
}
if (opObj.name != 'floor') {
mesh.position.z = opObj.site || 0
} else {
mesh.position.z = -1 * parseInt(opObj.toHeight) - 1
}
mesh.castShadow = true
mesh.renderOrder = indexOrder
mesh.name = opObj.name || ''
return mesh
let scanGeometry, meshMaterial, options = {
depth: parseInt(opObj.toHeight),
bevelEnabled: false,
curveSegments: 12,
bevelThickness: 0,
bevelSize: 0,
bevelSegments: 0,
material: 0, //frontMaterial = green
extrudeMaterial: 1, //sideMaterial = gray
};
scanGeometry = new THREE.ExtrudeGeometry(shape, options);
let meshColor = new THREE.Color(entityColor);
for (let e = 0; e < Map_QM.util.meshMaterialArr.length; e++) {
if (Map_QM.util.meshMaterialArr[e].color.equals(meshColor) && Map_QM.util.meshMaterialArr[e].opacity == alphaModle && !Map_QM.util.meshMaterialArr[e].userData.map) {
meshMaterial = Map_QM.util.meshMaterialArr[e];
}
}
if (!meshMaterial) {
meshMaterial = new THREE.MeshPhongMaterial({ //MeshStandardMaterial MeshPhongMaterial MeshBasicMaterial
color: entityColor,
transparent: true,
opacity: alphaModle,
side: THREE.DoubleSide,
depthTest: true
});
Map_QM.util.meshMaterialArr.push(meshMaterial);
}
if (opObj.angleY || opObj.angleZ) {
Map_QM.util.rotateYZ(scanGeometry, opObj.angleY * Math.PI / 180, opObj.angleZ * Math.PI / 180);
}
// 创建模型
let mesh;
if(opObj.map == "home"){
Map_QM.util.assignUVs(scanGeometry);
let mapMaterial,ceMaterial;
for (let e = 0; e < Map_QM.util.meshMaterialArr.length; e++) {
if (Map_QM.util.meshMaterialArr[e].userData.map == "front" && Map_QM.util.meshMaterialArr[e].opacity == alphaModle) {
mapMaterial = Map_QM.util.meshMaterialArr[e];
}
if (Map_QM.util.meshMaterialArr[e].userData.map == "c50" && Map_QM.util.meshMaterialArr[e].opacity == alphaModle) {
ceMaterial = Map_QM.util.meshMaterialArr[e];
}
}
if(!mapMaterial){
let texture = new THREE.TextureLoader().load(Map_QM.util.beforPath + "static/img/map/front.png");
texture.wrapS = THREE.ClampToEdgeWrapping;
texture.wrapT = THREE.RepeatWrapping;
mapMaterial = new THREE.MeshPhongMaterial({
color: entityColor,
map: texture,
transparent: true,
opacity: alphaModle,
side: THREE.DoubleSide,
depthTest: true
});
mapMaterial.userData.map = "front";
Map_QM.util.meshMaterialArr.push(mapMaterial);
}
if(!ceMaterial){
let texture2 = new THREE.TextureLoader().load(Map_QM.util.beforPath + "static/img/map/c50.png");
texture2.wrapS = THREE.RepeatWrapping;
texture2.wrapT = THREE.ClampToEdgeWrapping;
ceMaterial = new THREE.MeshPhongMaterial({
color: entityColor,
map: texture2,
transparent: true,
opacity: alphaModle,
side: THREE.DoubleSide,
depthTest: true
});
ceMaterial.userData.map = "c50";
Map_QM.util.meshMaterialArr.push(ceMaterial);
}
mesh = new THREE.Mesh(scanGeometry, [meshMaterial,ceMaterial,mapMaterial]);
} else if(opObj.map){
Map_QM.util.packUv(scanGeometry);
let ceMaterial;
for (let e = 0; e < Map_QM.util.meshMaterialArr.length; e++) {
if (Map_QM.util.meshMaterialArr[e].userData.map == opObj.map && Map_QM.util.meshMaterialArr[e].opacity == alphaModle) {
ceMaterial = Map_QM.util.meshMaterialArr[e];
}
}
if(!ceMaterial){
let texture2 = new THREE.TextureLoader().load(Map_QM.util.beforPath + "static/img/map/"+opObj.map+".png");
texture2.wrapS = THREE.RepeatWrapping;
texture2.wrapT = THREE.ClampToEdgeWrapping;
ceMaterial = new THREE.MeshPhongMaterial({
color: entityColor,
map: texture2,
transparent: true,
opacity: alphaModle,
side: THREE.DoubleSide,
depthTest: true
});
ceMaterial.userData.map = opObj.map;
Map_QM.util.meshMaterialArr.push(ceMaterial);
}
mesh = new THREE.Mesh(scanGeometry, [meshMaterial,ceMaterial]);
}else{
mesh = new THREE.Mesh(scanGeometry, meshMaterial);
}
if (opObj.type != "wall") {
let cubeEdges = new THREE.EdgesGeometry(scanGeometry, 60);
let cubeLine = new THREE.LineSegments(cubeEdges, material);
cubeLine.renderOrder = indexOrder - 5;
mesh.add(cubeLine);
}
if (opObj.name != "floor") {
mesh.position.z = opObj.site || 0;
} else {
mesh.position.z = -1 * parseInt(opObj.toHeight) - 1;
}
mesh.castShadow = true;
mesh.renderOrder = indexOrder;
mesh.name = opObj.name || "";
return mesh;
}
//绘制平面
@ -6046,26 +6204,17 @@ MyModel_QM.prototype.MyPlaneShape = function (areaArr, howllowArr, opObj, entity
scanGeometry = new THREE.ShapeGeometry(shape, 8);
Map_QM.util.assignUVs(scanGeometry);
if(opObj.map){
for (let e = 0; e < Map_QM.util.meshMaterialArr.length; e++) {
if (Map_QM.util.meshMaterialArr[e].userData.map == opObj.map) {
meshMaterial = Map_QM.util.meshMaterialArr[e];
}
}
if (!meshMaterial) {
let texture = new THREE.TextureLoader().load(Map_QM.util.beforPath + "static/img/map/" + opObj.map + ".jpg");
texture.wrapT = THREE.RepeatWrapping;
texture.repeat.y = 1;
meshMaterial = new THREE.MeshPhongMaterial({ //MeshStandardMaterial MeshPhongMaterial olor: entityColor,
color: entityColor,
map: texture,
transparent: true,
opacity: alphaModle,
side: THREE.DoubleSide,
depthTest: true
});
meshMaterial.userData.map = opObj.map;
Map_QM.util.meshMaterialArr.push(meshMaterial);
}
let texture = new THREE.TextureLoader().load(Map_QM.util.beforPath + "static/img/map/" + opObj.map + ".png");
meshMaterial = new THREE.MeshPhongMaterial({ //MeshStandardMaterial MeshPhongMaterial olor: entityColor,
color: entityColor,
map: texture,
transparent: true,
opacity: alphaModle,
side: THREE.DoubleSide,
depthTest: true
});
meshMaterial.userData.map = opObj.map;
Map_QM.util.meshMaterialArr.push(meshMaterial);
}else{
for (let e = 0; e < Map_QM.util.meshMaterialArr.length; e++) {
let color2 = new THREE.Color(entityColor);

Write Preview
Loading…
Cancel
Save