three.js webgl3D光伏,3D太阳能能源,3D智慧光伏、光伏发电、清洁能源三维可视化解决方案——第十六课( 五 )


拓扑图主要在管线的走向 , 这里走向较多 , 只列举一个
//创建路径var path=[{"x":0,"y":0,"z":0},{"x":0,"y":0,"z":-150},{"x":0,"y":-1,"z":-150},{"x":0,"y":-250,"z":-150},{"x":-1,"y":-250,"z":-150},{"x":-350,"y":-250,"z":-150},{"x":-350,"y":-250,"z":-149},{"x":-350,"y":-250,"z":30},{"x":-350,"y":-251,"z":30},{"x":-350,"y":-680,"z":30}];
var model={"show":true,"uuid":"","name":"dev_flowtube_2_3","objType":"flowTube","points":path,"position":{"x":1560.492,"y":976.703,"z":605.466},"scale":{"x":1,"y":1,"z":1},"rotation":[{"direction":"x","degree":0},{"direction":"y","degree":0},{"direction":"z","degree":0}],"style":{"skinColor":16772846,"imgurl":"../../img/3dImg/lightL2.png","opacity":1,"canvasSkin":{"cwidth":512,"cheight":8,"cwNub":16,"chNub":2,"cMarginW":0.5,"cMarginH":0,"speed":2,"fps":40,"direction":"w","forward":"f","side":1,"run":true,"bgcolor":"rgba(0,221,255,0.39)"}},"segments":9,"radialSegments":6,"closed":false,"radius":2,"showSortNub":100,"customType1":"","customType2":"","animation":null,"dbclickEvents":null,"BindDevId":null,"BindDevName":null,"devInfo":null,"BindMeteId":null,"BindMeteName":null,"copyFrom":"dev_flowtube_2_2"}
//创建模型
WT3Dobj.createLineByModelJSon(model)
2.2、数据接入
2.2.1、创建Ajax请求通用库
var httpInvoke = function (url, type, data, successCb, failedCb, userData, async) {return $.ajax({url: url,type: type,data: data,headers: {},async: async,times: 0,beforeSend: function (request) { },success: function (response, status, hreq) {if(response.code==401){//写这里layer.msg('登录失效,请重新登录~')window.location.href = 'https://www.huyubaike.com/jigongly/login'return}if (successCb != null) {successCb(response, status, userData);}},error: function (err) {console.log(err);if (failedCb != null) {failedCb(err.statusCode(), userData);}}})}2.2.2、创建API仓库
function WebAPI() {this.serverHead = "";this.serverHead2 = "";/*站点介绍/station空调系统/air?name=1-1消防系统/fire-ctrl?name=1-1PCS系统/pcs?name=1-1电池柜基本信息/battery-basic?name=1-1/3Dapi/cnz/battery-power?name=1-1月电量趋势图/electric-month充放电功率/dis-chargeSOC/soc月收益趋势图/profit-month日负荷曲线/load*/this.urls = {station: this.serverHead2+"/station",airConditioner: this.serverHead2+"/air",fireControl: this.serverHead2 +"/fire-ctrl",pcs: this.serverHead2+"/pcs",batteryCabinetBasic: this.serverHead2 + "/battery-basic",batteryPower: this.serverHead2 + "/battery-power",powerMonth: this.serverHead2 + "/electric-month",chargeDischarge: this.serverHead2 + "/dis-charge",so: this.serverHead2 + "/soc",profitmonth: this.serverHead2 + "/profit-month",load: this.serverHead2 + "/load",surplus: this.serverHead2 + "/surplus-power/",hostPowerMonth: this.serverHead2+"/ac/host-power-month",powerYear: this.serverHead2+"/ac/power-year",abstract: this.serverHead2+"/ac/abstract",consumptionDay: this.serverHead2+"/consumption-day/",chargeDay: this.serverHead2+"/charge-day/",temperatures: "../demoData/tempTureData.json",//}}例如请求温度信息:
WebAPI.prototype.TempsCache = {};WebAPI.prototype.getTemptureValue = https://www.huyubaike.com/biancheng/function (sunFunc) {var _this = this;var url = this.serverHead + this.urls.temperatures +"?positionId=" + _this.roomid;httpGet(url, function (response) {if (response && response.data && sunFunc) {if (response.data && response.data.length > 0) {$.each(response.data, function (_index, _obj) {_obj.id = _obj.name;_obj.type = 0;_obj.temptureValue = https://www.huyubaike.com/biancheng/_obj.t1MValue;_obj.temptureValueUp = _obj.t1UValue;_obj.temptureValueDown = _obj.t1DValue;_obj.lastUptime = new Date().getTime();_obj.allBearing = 0;_this.TempsCache["temp_" + _obj.name] = _obj});}sunFunc(response.data);/*{"pbPValue":1.40,"paIValue":5.32,"t1DValue":21.20,"paVValue":231.10,"t1MValue":21.70,"t2MValue":22.81,"t2UValue":25.25,"positionId":18,"assetId":1449,"t1UValue":23.68,"name":"M211-01-01-01","t2DValue":21.11,"id":1,"pbIValue":6.07,"pbVValue":231.20,"paPValue":1.22}*/}}, function () {layer.msg("获取数据异常");});} 2.3、主要逻辑
2.3.1、创建模型
上述章节已讲,不做赘述
2.3.2、创建数据与模型的关系
数据绑定
var data = https://www.huyubaike.com/biancheng/[];for (var i = 1; i <= 3; i++) {for (var j = 1; j <= 20; j++) {var modelname ="dev_cqpdx_" + i + "_" + j;if (i == 1) {modelname = "dev_cqpdx_" + j;}data.push({"dataId": i + "_" + j,"type": "pdg","name": modelname,})}}return data;2.3.3、业务操控实现
从载入模型,到实例化,再到获取到模型对象,控制 。
T3DModel = new T3D();// 实例化 3D 核心对象var initOption = {far:100000000,antialias: true, // 启用平滑、抗锯齿效果loadSyn: false, // 是否启用异步加载showHelpGrid: false, // 是否显示网格线clearCoolr: 0x4068b0,// 背景色clearColorOp: 0,// 透明度};var Aobjects = {// 给3D对象绑定事件objects: AllModelJsons,events: {dbclick: [{obj_name: "ALL",obj_event: function (_obj, face,objs) { // 被选中的对象 被选中的面....}},],mouseDown: [{obj_name: "ALL",obj_event: function (_obj, face, objs) { // 被选中的对象 被选中的面...}},],mouseMove: [{obj_name: "doorLeft",obj_event: function (_obj, face, objs) {....}},]}}

推荐阅读