|
@@ -167,12 +167,12 @@ export default {
|
|
|
);
|
|
|
},
|
|
|
clickFan: () => {
|
|
|
- this.showFanInfo(this.htmlLayer[0].position);
|
|
|
- this.jkd = this.htmlLayer[0].jkd;
|
|
|
- this.ysl = this.htmlLayer[0].ysl;
|
|
|
- this.lsl = this.htmlLayer[0].lsl;
|
|
|
- this.csl = this.htmlLayer[0].csl;
|
|
|
- this.gzsl = this.htmlLayer[0].gzsl;
|
|
|
+ that.showFanInfo(that.htmlLayer[0].position);
|
|
|
+ that.jkd = that.htmlLayer[0].jkd;
|
|
|
+ that.ysl = that.htmlLayer[0].ysl;
|
|
|
+ that.lsl = that.htmlLayer[0].lsl;
|
|
|
+ that.csl = that.htmlLayer[0].csl;
|
|
|
+ that.gzsl = that.htmlLayer[0].gzsl;
|
|
|
that.clickMapItem(
|
|
|
[
|
|
|
"MHS_FDC_SC",
|
|
@@ -214,12 +214,12 @@ export default {
|
|
|
);
|
|
|
},
|
|
|
clickFan: () => {
|
|
|
- this.showFanInfo(this.htmlLayer[1].position);
|
|
|
- this.jkd = this.htmlLayer[1].jkd;
|
|
|
- this.ysl = this.htmlLayer[1].ysl;
|
|
|
- this.lsl = this.htmlLayer[1].lsl;
|
|
|
- this.csl = this.htmlLayer[1].csl;
|
|
|
- this.gzsl = this.htmlLayer[1].gzsl;
|
|
|
+ that.showFanInfo(that.htmlLayer[1].position);
|
|
|
+ that.jkd = that.htmlLayer[1].jkd;
|
|
|
+ that.ysl = that.htmlLayer[1].ysl;
|
|
|
+ that.lsl = that.htmlLayer[1].lsl;
|
|
|
+ that.csl = that.htmlLayer[1].csl;
|
|
|
+ that.gzsl = that.htmlLayer[1].gzsl;
|
|
|
that.clickMapItem(
|
|
|
[
|
|
|
"NSS_FDC_SC",
|
|
@@ -261,12 +261,12 @@ export default {
|
|
|
);
|
|
|
},
|
|
|
clickFan: () => {
|
|
|
- this.showFanInfo(this.htmlLayer[2].position);
|
|
|
- this.jkd = this.htmlLayer[2].jkd;
|
|
|
- this.ysl = this.htmlLayer[2].ysl;
|
|
|
- this.lsl = this.htmlLayer[2].lsl;
|
|
|
- this.csl = this.htmlLayer[2].csl;
|
|
|
- this.gzsl = this.htmlLayer[2].gzsl;
|
|
|
+ that.showFanInfo(that.htmlLayer[2].position);
|
|
|
+ that.jkd = that.htmlLayer[2].jkd;
|
|
|
+ that.ysl = that.htmlLayer[2].ysl;
|
|
|
+ that.lsl = that.htmlLayer[2].lsl;
|
|
|
+ that.csl = that.htmlLayer[2].csl;
|
|
|
+ that.gzsl = that.htmlLayer[2].gzsl;
|
|
|
that.clickMapItem(
|
|
|
[
|
|
|
"QS_FDC_SC",
|
|
@@ -308,12 +308,12 @@ export default {
|
|
|
);
|
|
|
},
|
|
|
clickFan: () => {
|
|
|
- this.showFanInfo(this.htmlLayer[3].position);
|
|
|
- this.jkd = this.htmlLayer[3].jkd;
|
|
|
- this.ysl = this.htmlLayer[3].ysl;
|
|
|
- this.lsl = this.htmlLayer[3].lsl;
|
|
|
- this.csl = this.htmlLayer[3].csl;
|
|
|
- this.gzsl = this.htmlLayer[3].gzsl;
|
|
|
+ that.showFanInfo(that.htmlLayer[3].position);
|
|
|
+ that.jkd = that.htmlLayer[3].jkd;
|
|
|
+ that.ysl = that.htmlLayer[3].ysl;
|
|
|
+ that.lsl = that.htmlLayer[3].lsl;
|
|
|
+ that.csl = that.htmlLayer[3].csl;
|
|
|
+ that.gzsl = that.htmlLayer[3].gzsl;
|
|
|
that.clickMapItem(
|
|
|
[
|
|
|
"SBQ_FDC_SC",
|
|
@@ -355,12 +355,12 @@ export default {
|
|
|
);
|
|
|
},
|
|
|
clickFan: () => {
|
|
|
- this.showFanInfo(this.htmlLayer[4].position);
|
|
|
- this.jkd = this.htmlLayer[4].jkd;
|
|
|
- this.ysl = this.htmlLayer[4].ysl;
|
|
|
- this.lsl = this.htmlLayer[4].lsl;
|
|
|
- this.csl = this.htmlLayer[4].csl;
|
|
|
- this.gzsl = this.htmlLayer[4].gzsl;
|
|
|
+ that.showFanInfo(that.htmlLayer[4].position);
|
|
|
+ that.jkd = that.htmlLayer[4].jkd;
|
|
|
+ that.ysl = that.htmlLayer[4].ysl;
|
|
|
+ that.lsl = that.htmlLayer[4].lsl;
|
|
|
+ that.csl = that.htmlLayer[4].csl;
|
|
|
+ that.gzsl = that.htmlLayer[4].gzsl;
|
|
|
that.clickMapItem(
|
|
|
[
|
|
|
"XS_FDC_SC",
|
|
@@ -507,12 +507,12 @@ export default {
|
|
|
);
|
|
|
},
|
|
|
clickFan: () => {
|
|
|
- this.showFanInfo(this.htmlLayer[10].position);
|
|
|
- this.jkd = this.htmlLayer[10].jkd;
|
|
|
- this.ysl = this.htmlLayer[10].ysl;
|
|
|
- this.lsl = this.htmlLayer[10].lsl;
|
|
|
- this.csl = this.htmlLayer[10].csl;
|
|
|
- this.gzsl = this.htmlLayer[10].gzsl;
|
|
|
+ that.showFanInfo(that.htmlLayer[10].position);
|
|
|
+ that.jkd = that.htmlLayer[10].jkd;
|
|
|
+ that.ysl = that.htmlLayer[10].ysl;
|
|
|
+ that.lsl = that.htmlLayer[10].lsl;
|
|
|
+ that.csl = that.htmlLayer[10].csl;
|
|
|
+ that.gzsl = that.htmlLayer[10].gzsl;
|
|
|
that.clickMapItem(
|
|
|
[
|
|
|
"SBQ_FDC_SC",
|
|
@@ -605,7 +605,7 @@ export default {
|
|
|
this.$emit("clickMapItem", videoArray, wpId);
|
|
|
},
|
|
|
// Vector3 to screen
|
|
|
- vector3ToScreen: function (position) {
|
|
|
+ vector3ToScreen(position) {
|
|
|
const centerX = this.$el.scrollWidth / 2;
|
|
|
const centerY = this.$el.scrollHeight / 2;
|
|
|
const v3 = new THREE.Vector3(position.x, position.y, position.z);
|
|
@@ -615,12 +615,12 @@ export default {
|
|
|
return { x: screenX, y: screenY };
|
|
|
},
|
|
|
// 场景
|
|
|
- initScene: function () {
|
|
|
+ initScene() {
|
|
|
scene = new THREE.Scene();
|
|
|
// scene.background = new THREE.Color(0xa0a0a0);
|
|
|
},
|
|
|
// 相机
|
|
|
- initCamera: function () {
|
|
|
+ initCamera() {
|
|
|
camera = new THREE.PerspectiveCamera(
|
|
|
45,
|
|
|
this.$el.scrollWidth / this.$el.scrollHeight,
|
|
@@ -630,27 +630,27 @@ export default {
|
|
|
camera.position.set(50, 50, 50);
|
|
|
},
|
|
|
// 坐标轴
|
|
|
- initAxesHelper: function () {
|
|
|
+ initAxesHelper() {
|
|
|
const axesHelper = new THREE.AxesHelper(150);
|
|
|
scene.add(axesHelper);
|
|
|
axesHelper.position.set(0, 0, 0);
|
|
|
},
|
|
|
// 渲染器
|
|
|
- initRender: function () {
|
|
|
+ initRender() {
|
|
|
renderer = new THREE.WebGLRenderer({ antialias: true, alpha: true });
|
|
|
// renderer.setClearAlpha(0);
|
|
|
renderer.setSize(this.$el.scrollWidth, this.$el.scrollHeight);
|
|
|
this.$el.append(renderer.domElement);
|
|
|
},
|
|
|
// 灯光
|
|
|
- initLight: function () {
|
|
|
+ initLight() {
|
|
|
// let light = new THREE.PointLight(0xffffff, 2);
|
|
|
let light = new THREE.AmbientLight(0xffffff, 5);
|
|
|
// light.position.set(50, 50, 50);
|
|
|
scene.add(light);
|
|
|
},
|
|
|
// 控制器
|
|
|
- initControls: function () {
|
|
|
+ initControls() {
|
|
|
controls = new OrbitControls(camera, renderer.domElement);
|
|
|
controls.enablePan = false;
|
|
|
controls.maxPolarAngle = (45 / 180) * Math.PI;
|
|
@@ -669,7 +669,7 @@ export default {
|
|
|
// });
|
|
|
},
|
|
|
// 初始化一个风机动画
|
|
|
- initFanAnimate: function (obj) {
|
|
|
+ initFanAnimate(obj) {
|
|
|
let fanAnimateObj = {
|
|
|
speed: 0.05,
|
|
|
rotate: 0,
|
|
@@ -717,14 +717,13 @@ export default {
|
|
|
this.playAnimation = true;
|
|
|
},
|
|
|
// 内容
|
|
|
- initContent: function () {
|
|
|
+ initContent() {
|
|
|
// 加载3D地面
|
|
|
let loaderGround = new GLTFLoader(); /*实例化加载器*/
|
|
|
loaderGround.load(
|
|
|
"static/3d/fanvar.gltf",
|
|
|
(gltf) => {
|
|
|
gltf.scene.position.set(17, 10, -12);
|
|
|
- // console.log(gltf);
|
|
|
scene.add(gltf.scene);
|
|
|
let rootNode = gltf.scene.children[0];
|
|
|
let fan = gltf.scene.children[0].children[0];
|
|
@@ -740,7 +739,6 @@ export default {
|
|
|
"static/3d/light.gltf",
|
|
|
(gltf) => {
|
|
|
gltf.scene.position.set(17, 10, -12);
|
|
|
- // console.log(gltf);
|
|
|
scene.add(gltf.scene);
|
|
|
let rootNode = gltf.scene.children[0];
|
|
|
let light = gltf.scene.children[0].children[0];
|
|
@@ -776,7 +774,7 @@ export default {
|
|
|
);
|
|
|
},
|
|
|
// 改变元素底盘的颜色(带底盘的)
|
|
|
- changeObjectColor: function (obj, colorName) {
|
|
|
+ changeObjectColor(obj, colorName) {
|
|
|
for (let i = 1; i <= 4; i++) {
|
|
|
let c = obj.getObjectByName(`${obj.name}_c_${i}`);
|
|
|
c.material = new THREE.MeshBasicMaterial({
|
|
@@ -803,7 +801,7 @@ export default {
|
|
|
});
|
|
|
},
|
|
|
// 改变元素的颜色(光伏)
|
|
|
- changeElColor: function (obj, colorName) {
|
|
|
+ changeElColor(obj, colorName) {
|
|
|
// let color = this.colors.find(t => t.colorName == colorName || t.state == colorName || t.stateName == colorName).color;
|
|
|
// for (let i = 1; i <= 6; i++) {
|
|
|
// let el = obj.getObjectByName(`${obj.name}_item_${i}`);
|
|
@@ -815,7 +813,7 @@ export default {
|
|
|
// }
|
|
|
},
|
|
|
// 设置风机name
|
|
|
- setFanName: function (obj, name) {
|
|
|
+ setFanName(obj, name) {
|
|
|
obj.name = name;
|
|
|
obj.userData.name = name;
|
|
|
// "Cylinder881" "Cone277"
|
|
@@ -875,7 +873,7 @@ export default {
|
|
|
group.name = `${name}_leaf`;
|
|
|
},
|
|
|
// 设置风机位置 颜色
|
|
|
- setFanPosition: function (rootNode, obj) {
|
|
|
+ setFanPosition(rootNode, obj) {
|
|
|
// 麻黄山
|
|
|
let fan_mhs = obj.clone(true);
|
|
|
fan_mhs.position.set(10, 5, -4);
|
|
@@ -942,7 +940,7 @@ export default {
|
|
|
this.setEveryHTML();
|
|
|
},
|
|
|
// 设置光伏name
|
|
|
- setLightName: function (obj, name) {
|
|
|
+ setLightName(obj, name) {
|
|
|
obj.name = name;
|
|
|
obj.userData.name = name;
|
|
|
let Box661 = obj.getObjectByName("Box661");
|
|
@@ -965,7 +963,7 @@ export default {
|
|
|
Box670.userData.name = `${name}_item_6`;
|
|
|
},
|
|
|
// 设置光伏位置 颜色
|
|
|
- setLightPosition: function (rootNode, obj) {
|
|
|
+ setLightPosition(rootNode, obj) {
|
|
|
obj.scale.set(200, 200, 200);
|
|
|
// let Box660 = obj.getObjectByName("Box660");
|
|
|
// let Box666 = obj.getObjectByName("Box666");
|
|
@@ -1077,7 +1075,7 @@ export default {
|
|
|
scene.add(cylinder);
|
|
|
},
|
|
|
// 设置每一个html的位置
|
|
|
- setEveryHTML: function () {
|
|
|
+ setEveryHTML() {
|
|
|
this.htmlLayer.forEach((value) => {
|
|
|
if (value.show && value.position) {
|
|
|
const screen = this.vector3ToScreen(value.position);
|
|
@@ -1087,7 +1085,7 @@ export default {
|
|
|
});
|
|
|
},
|
|
|
// 判断时候是可点击对象 返回null 或object
|
|
|
- getClickObject: function (intersects) {
|
|
|
+ getClickObject(intersects) {
|
|
|
const names = ["fan"];
|
|
|
const namesRoot = ["fanvar"];
|
|
|
let x = true;
|
|
@@ -1120,7 +1118,7 @@ export default {
|
|
|
return obj;
|
|
|
},
|
|
|
// 显示风机弹出层
|
|
|
- showFanInfo: function (position) {
|
|
|
+ showFanInfo(position) {
|
|
|
this.fanInfoLayer.position = {
|
|
|
x: position.x,
|
|
|
y: position.y,
|
|
@@ -1132,13 +1130,13 @@ export default {
|
|
|
this.fanInfoLayer.show = true;
|
|
|
},
|
|
|
// 隐藏风机弹出层
|
|
|
- hideFanInfo: function () {
|
|
|
+ hideFanInfo() {
|
|
|
this.fanInfoLayer.show = false;
|
|
|
},
|
|
|
// 初始化云
|
|
|
- initCloud: function () {},
|
|
|
+ initCloud() {},
|
|
|
// 初始化
|
|
|
- initThree: function () {
|
|
|
+ initThree() {
|
|
|
this.initScene();
|
|
|
// this.initAxesHelper();
|
|
|
this.initCamera();
|
|
@@ -1150,7 +1148,7 @@ export default {
|
|
|
renderer.setAnimationLoop(this.animate);
|
|
|
},
|
|
|
// 动画
|
|
|
- animate: function () {
|
|
|
+ animate() {
|
|
|
renderer.render(scene, camera);
|
|
|
},
|
|
|
},
|