diff --git a/.vscode/launch.json b/.vscode/launch.json
new file mode 100644
index 0000000..a1481f9
--- /dev/null
+++ b/.vscode/launch.json
@@ -0,0 +1,15 @@
+{
+ // 使用 IntelliSense 了解相关属性。
+ // 悬停以查看现有属性的描述。
+ // 欲了解更多信息，请访问: https://go.microsoft.com/fwlink/?linkid=830387
+ "version": "0.2.0",
+ "configurations": [
+ {
+ "type": "pwa-chrome",
+ "request": "launch",
+ "name": "Launch Chrome against localhost",
+ "url": "http://localhost:4200",
+ "webRoot": "${workspaceFolder}"
+ }
+ ]
+}
\ No newline at end of file
diff --git a/src/app/ui/dangerous/dangerous.component.html b/src/app/ui/dangerous/dangerous.component.html
index 8a22dfe..5d15e2d 100644
--- a/src/app/ui/dangerous/dangerous.component.html
+++ b/src/app/ui/dangerous/dangerous.component.html
@@ -1,6 +1,70 @@
-
危化品类型
-
危化品分布
+
危化品类型
+
危化品分布
+
+
+
+
+
+
+
+
+
+
+ | 品名 |
+ 英文名 |
+ 分子式 |
+ 分类 |
+ 查看详情 |
+
+
+ | row 1, cell 1 |
+ row 1, cell 2 |
+ row 1, cell 1 |
+ row 1, cell 2 |
+ 查看详情 |
+
+
+ | row 1, cell 1 |
+ row 1, cell 2 |
+ row 1, cell 1 |
+ row 1, cell 2 |
+ 查看详情 |
+
+
+ | row 1, cell 1 |
+ row 1, cell 2 |
+ row 1, cell 1 |
+ row 1, cell 2 |
+ 查看详情 |
+
+
+
+
+
+
+
+
+
+
+
+
+
+
品名
+
理化属性
+
危害特性
+
灭火剂
+
储运注意事项
+
+
+
+
+
+
diff --git a/src/app/ui/dangerous/dangerous.component.scss b/src/app/ui/dangerous/dangerous.component.scss
index fe3b9a5..f68c763 100644
--- a/src/app/ui/dangerous/dangerous.component.scss
+++ b/src/app/ui/dangerous/dangerous.component.scss
@@ -1,17 +1,141 @@
.box{
width: 100%;
height: 100%;
- border: 1px solid red;
+ // border: 1px solid red;
display: flex;
flex-direction: column;
.title{
flex: 2%;
width: 100%;
+ padding-top: 10px;
div{
display: inline-block;
- width: 200px;
- height: 80%;
- border: #26b5fb;
+ width: 126px;
+ height: 35px;
+ line-height: 35px;
+ text-align: center;
+ border:1px solid #26b5fb;
+ color: white;
+ cursor: pointer;
+ }
+ .selectedBtn{
+ background-color: #e88108;
+ }
+ }
+ .body{
+ width: 99.9%;
+ height: 100%;
+ border:1px solid #26b5fb;
+ .type{
+ width: 100%;
+ height: 100%;
+ display: flex;
+ .leftbox{
+ height: 100%;
+ // flex: 20%;
+ width: 16%;
+ border-right: 1px solid #26b5fb;
+ }
+ .rightbox{
+ width: 100%;
+ height: 100%;
+ table{
+ width: 100%;
+ height: 100%;
+ tr{
+ width: 100%;
+ display: flex;
+ height: 38px;
+ line-height: 38px;
+ th{
+ text-align: center;
+ flex: 1;
+ color: #f7ba2a;
+ font-size: 20px;
+ height: 30px;
+ line-height: 30px;
+ }
+ td{
+ text-align: center;
+ flex: 1;
+ color: white;
+ }
+ td:last-child{
+ cursor: pointer;
+ color: #f0c398;
+ }
+ td:last-child:hover{
+ color: #f7ba2a;
+ }
+ }
+ tr:first-child{
+ margin-top:6px;
+ border-bottom: 1px solid #26b5fb;
+ width: 100%;
+ }
+ }
+
+ }
+ }
+ .size{
+ width: 100%;
+ height: 100%;
+ }
+ .openDiv{
+ z-index: 3000;
+ width:600px;
+ height: 500px;
+ position: fixed;
+ left: 0;
+ top:0;
+ right: 0;
+ bottom: 0;
+ margin:auto;
+ background: #063659;
+ opacity: 0.9;
+ border: 1px solid #26b5fb;
+ .top{
+ width: 100%;
+ height: 32px;
+ line-height: 32px;
+ text-align: center;
+ border-bottom: 1px solid #26b5fb;
+ position: relative;
+ h4{
+ color: red;
+ }
+ .btn{
+ width: 30px;
+ height: 30px;
+ position: absolute;
+ top: 0;
+ right: 0;
+ color: #919191;
+ cursor: pointer;
+ font-size: 18px;
+ }
+ }
+ .details{
+ width: 100%;
+ height: 100%;
+ .left{
+ height: 100%;
+ width: 24%;
+ border-right:1px solid #26b5fb;
+ div{
+ width: 100%;
+ height: 33px;
+ line-height: 33px;
+ text-align: center;
+ color: #8aadce;
+ border-bottom:1px solid #999b9d ;
+ cursor: pointer;
+ }
+ div:hover{
+ background: #041f33;
+ }
+ }
+ }
}
}
}
\ No newline at end of file
diff --git a/src/app/ui/dangerous/dangerous.component.ts b/src/app/ui/dangerous/dangerous.component.ts
index 6401696..11c0e4e 100644
--- a/src/app/ui/dangerous/dangerous.component.ts
+++ b/src/app/ui/dangerous/dangerous.component.ts
@@ -1,5 +1,5 @@
import { Component, OnInit } from '@angular/core';
-
+declare var AMap: any;
@Component({
selector: 'app-dangerous',
templateUrl: './dangerous.component.html',
@@ -8,8 +8,63 @@ import { Component, OnInit } from '@angular/core';
export class DangerousComponent implements OnInit {
constructor() { }
-
+ map:any //地图
ngOnInit(): void {
+
+ }
+ //地图范围圆圈
+ circle = new AMap.Circle({
+ center: [109.656839, 23.098685],
+ radius: 500, //半径
+ strokeOpacity: 1,
+ fillOpacity: 0.4,
+ strokeStyle: 'dashed',
+ strokeDasharray: [10, 10],
+ // 线样式还支持 'dashed'
+ fillColor: '#1791fc',
+ zIndex: 50,
+ })
+ //类型选择
+ istype = true//默认选择危化品类型
+
+ typeSelect(type){
+ if(type ==1 ){
+ this.istype = true
+ }else{
+ this.istype = false
+
+ setTimeout(() => {
+ var satellite = new AMap.TileLayer.Satellite();
+ var roadNet = new AMap.TileLayer.RoadNet();
+ // 创建一个 icon
+ var viaMarker = new AMap.Marker({
+ position: new AMap.LngLat(116.38,39.92),
+ // 将一张图片的地址设置为 icon
+ icon: '//a.amap.com/jsapi_demos/static/demo-center/icons/dir-via-marker.png',
+ // 设置了 icon 以后，设置 icon 的偏移量，以 icon 的 [center bottom] 为原点
+ offset: new AMap.Pixel(-13, -30)
+ });
+ this.map = new AMap.Map('size',{
+ center: [109.656839, 23.098685],//中心点坐标
+ zoom: 16,
+ layers:[
+ satellite,
+ // roadNet
+ ]
+ });
+ this.circle.setMap(this.map)
+ this.map.add([viaMarker]);
+ // this.map.setFitView([ circle ])
+ }, 0);
+ }
+
+ }
+ //查看详情框打开
+ isOpen = false
+ closeDiv(){
+ this.isOpen = false
+ }
+ openDetails(){
+ this.isOpen = true
}
-
}
diff --git a/src/app/ui/disposal-node/disposal-node.component.html b/src/app/ui/disposal-node/disposal-node.component.html
index 5f52123..2d1a5a6 100644
--- a/src/app/ui/disposal-node/disposal-node.component.html
+++ b/src/app/ui/disposal-node/disposal-node.component.html
@@ -1 +1,23 @@
-disposal-node works!
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/src/app/ui/disposal-node/disposal-node.component.scss b/src/app/ui/disposal-node/disposal-node.component.scss
index e69de29..468948e 100644
--- a/src/app/ui/disposal-node/disposal-node.component.scss
+++ b/src/app/ui/disposal-node/disposal-node.component.scss
@@ -0,0 +1,84 @@
+
+.icongray{
+ color: #D9D0DC;
+}
+//头部操作栏
+.headerOperate {
+ position: relative;
+ span{
+ font-size: 18px;
+ }
+ flex: 2%;
+ display: flex;
+ align-items:center;
+ min-height: 40px;
+ box-sizing: border-box;
+ margin: 3px 0;
+
+ .bigeditdeletebtn{
+ border:1px solid #0E79A9;
+ margin-right: 0px;
+ height: 80%;
+ display: flex;
+ flex-direction: column;
+ // align-items:center;/*由于flex-direction: column，因此align-items代表的是水平方向*/
+ justify-content: center;
+ user-select: none;
+ //background-image: url("../../../assets/images/标签正常.png") ;
+ background-size:100% 100%;
+ color: white;
+ span{
+ padding: 13px 13px;
+ //padding-right: 18px;
+ font-size: 24px;
+ }
+ }
+ .bigeditdeletebtn:hover{
+ cursor: pointer;
+ //background-image: url("../../../assets/images/标签经过.png") ;
+ }
+
+ }
+ //中间文字区域
+ .wenzi{
+ overflow:auto;
+ height: 85%;
+ width: 100%;
+ line-height: 35px;
+ .h3{
+ color: #CC5D13;
+ }
+ .scrollbar{
+ width: 30px;
+ height: 300px;
+ margin: 0 auto;
+
+ }
+ .wenzi::-webkit-scrollbar {/*滚动条整体样式*/
+ width: 10px; /*高宽分别对应横竖滚动条的尺寸*/
+ height: 1px;
+ }
+ .wenzi::-webkit-scrollbar-thumb {/*滚动条里面小方块*/
+ border-radius: 10px;
+ //-webkit-box-shadow: inset 0 0 5px rgba(0,0,0,0.2);
+ background: #CC5D13;
+ }
+ .wenzi::-webkit-scrollbar-track {/*滚动条里面轨道*/
+ //-webkit-box-shadow: inset 0 0 5px rgba(0,0,0,0.2);
+ border-radius: 10px;
+ background: #EDEDED;
+ }
+ }
+ .button {
+ border-radius: 2px;
+ background-color: #4CAF50;
+ border: none;
+ color: white;
+ padding: 15px 32px;
+ text-align: center;
+ text-decoration: none;
+ display: inline-block;
+ font-size: 16px;
+ margin: 4px 2px;
+ cursor: pointer;
+}
\ No newline at end of file
diff --git a/src/app/ui/disposal-node/disposal-node.component.ts b/src/app/ui/disposal-node/disposal-node.component.ts
index ef1b830..c337470 100644
--- a/src/app/ui/disposal-node/disposal-node.component.ts
+++ b/src/app/ui/disposal-node/disposal-node.component.ts
@@ -8,8 +8,118 @@ import { Component, OnInit } from '@angular/core';
export class DisposalNodeComponent implements OnInit {
constructor() { }
+ setTimeoutObj//延时器需要清除
ngOnInit(): void {
+ console.log(this.chooseBiaoti)
+ this.setTimeoutObj = window.setTimeout(()=>{
+ this.xianshi(1)
+ },0)
}
+ ngAfterContentInit (){
+ //this.xianshi()
+ }
+ checkedBuildingIndex:number = -1
+ chooseBiaoti=1
+
+ //鼠标移入边框变颜色
+ yiru(yirunum){
+ var tedian=document.getElementById(yirunum)
+ tedian.style.border="1px solid #C8CE4D"
+ }
+ yichu(yichunum){
+ var tedian=document.getElementById(yichunum)
+ tedian.style.border="1px solid #0E79A9"
+ }
+ //点击切换中间显示的文字
+ xianshi(biaotinum){
+ var mianban=document.getElementById('aaa')
+ var tedian=document.getElementById('tedian')
+ var zhuyi=document.getElementById('zhuyi')
+ var chuzhi=document.getElementById('chuzhi')
+ var zuzhi= document.getElementById('zuzhi')
+ var chuzhiYuanze='';
+ if(biaotinum==4){
+ zuzhi.style.border="1px solid #30BBEC"
+ tedian.style.border="1px solid #0E79A9"
+ zhuyi.style.border="1px solid #0E79A9"
+ chuzhi.style.border="1px solid #0E79A9"
+ chuzhiYuanze+=`一、处置原则
`;
+ chuzhiYuanze+='（一）灾情处置应坚持“'
+ chuzhiYuanze+='救人第一、科学施救'
+ chuzhiYuanze+='”的原则，严禁在不熟悉情况时擅自行动，严禁冒险蛮干。'
+ chuzhiYuanze+='（二）现场情况基本清楚，无爆炸等次生灾害风险，灾情易于辨识研判，在技术人员指导下，果断下达指令开展灭火救援行动。'
+ chuzhiYuanze+='（三）燃烧物不清，现场情况不明，难于辨识研判，参战力量要与现场保持足够的安全距离；如有人员被困，且有希望抢救受困人员生命时，指挥员应视情采取救人措施。'
+ chuzhiYuanze+='（四）燃烧物不清，现场情况不明，无人员受困，难以研判决策，现场指挥员应及时采取外部控灾措施，并与现场保持适当安全距离。'
+ chuzhiYuanze+='（五）燃烧物已知，无人员受困，有爆炸伤亡风险，指挥员应采取依托掩体外围抑爆控灾措施，必要时建议指挥部扩大警戒、疏散范围。'
+ chuzhiYuanze+='二、受理报警
'
+ chuzhiYuanze+='（一）危险化学品场所发生火灾爆炸，火警等级不应小于四级；危险化学品发生泄漏事故，容易导致火灾爆炸或中毒事故发生，对人员、财产威胁严重或可能出现二次污染等情况特殊、灾情严重的灾害事故，应急救援等级不应小于三级。'
+ chuzhiYuanze+='（二）事故发生后，指挥中心应迅速准确受理报警，应当询问掌握报警人信息、事故单位基本情况、主要联系方式，'
+ chuzhiYuanze+='问清危险化学品的种类、数量、危害特性和储存方式，以及有无人员被困，周边受威胁危险化学品的有关情况，'
+ chuzhiYuanze+='及时告知救援人员相关情况和注意事项，同时报告指挥长和全勤指挥部成员。'
+ chuzhiYuanze+='（三）指挥中心要不间断与辖区消防救援站、报警群众和单位负责人联系，根据现场情况及时调派增援力量，向参战力量推送危险化学品理化性质、处置措施和注意事项，并将灾情按要求上报上级指挥中心。'
+ chuzhiYuanze+='三、力量调集
'
+ chuzhiYuanze+='（一）指挥中心应及时调集辖区中队、周边化工灭火救援编队到场处置，全勤指挥部和战勤保障力量遂行出动'
+ }
+ else if(biaotinum==1){
+ zuzhi.style.border="1px solid #0E79A9"
+ tedian.style.border="1px solid #30BBEC"
+ zhuyi.style.border="1px solid #0E79A9"
+ chuzhi.style.border="1px solid #0E79A9"
+ chuzhiYuanze+='（1） 爆炸引起燃烧。油罐发生爆炸后，随即易形成稳定燃烧。爆炸后，从罐顶或裂口处流出的油品或因罐体移位流出的油品，易造成地面流淌性燃烧。'
+ chuzhiYuanze+='（2） 燃烧引起爆炸。在形成稳定燃烧的油罐的邻近油罐，在热辐射的作用下易发生爆炸，扩大火势。'
+ chuzhiYuanze+='（3） 火焰高，辐射热强。爆炸后在油罐破裂位置形成的稳定燃烧，其火焰高达几十米，并对其四周产生强烈的热辐射。'
+ chuzhiYuanze+='（4） 易形成沸溢与喷溅。由于重质油品具有“热波特性”，对含有一定水分或有水垫层的重质油品储罐发生火灾后，如果不能及时进行冷却控制，在其“热波特性”的作用下就会使油品内的乳化水或油层下的水垫层产生过热蒸汽，而导致发生油品的沸溢或喷溅现象。'
+ chuzhiYuanze+='（5） 易造成大面积燃烧。重质油品储罐发生的沸溢、喷溅现象，在其压力的作用会将大量的油品喷洒在事故区域内，瞬间即可造成大面积燃烧，同时，对在火场内的消防战斗人员、车辆及其他装置、设备造成极大的威胁。'
+ }
+ else if(biaotinum==2){
+ zuzhi.style.border="1px solid #0E79A9"
+ tedian.style.border="1px solid #0E79A9"
+ zhuyi.style.border="1px solid #30BBEC"
+ chuzhi.style.border="1px solid #0E79A9"
+ chuzhiYuanze+='1、油罐火灾的辐射热强，参战人员应配有防高温、防辐射、防毒的防护装备。'
+ chuzhiYuanze+='2、正确选择停车位置。消防车尽量停在上风或侧上风向，与燃烧油罐保持一定的安全距离。扑救重质油罐火灾时，消防车头应背向油罐，以备紧急撤离。作战行动中的部分车辆动画加上文字配音说明'
+ chuzhiYuanze+='3、注意观察火场情况变化，及时发现沸溢、喷溅征兆。'
+ chuzhiYuanze+='4、充分冷却，防止复燃。燃烧罐的火势被扑灭后，要继续对其实施冷却，直至使罐内油品温度降到燃点以下为止。设有保温层的原油罐可不予以冷却。轻质油品罐不会形成高温层，冷却的重点是液面以上的罐壁。救活的图片加上文字配音说明。'
+ chuzhiYuanze+='5、浮顶油罐在初期火灾时，燃烧仅限于密封围堰部位，应立即启动固定泡沫灭火装置或组织泡沫管枪从固定铁梯进行强攻，消灭围堰内的火灾。作战行动中的动画加文字配音说明。'
+ chuzhiYuanze+='6、注意观察和选择有利地形，尽量选取上风向处，前沿阵地的战斗人员（水枪手等）要注意利用地形地物掩护自己，并穿着铝箔隔热服。防止坍塌及爆炸对人的危害。作战行动中的动画加文字配音说明。'
+ chuzhiYuanze+='7、要与工程技术人员联系，充分工艺手段灭火。'
+ chuzhiYuanze+='8、火情侦察要详细、认真、全面，尤其注意关联设备和邻近装置，注意流淌火的观察和控制，防止沿沟渠蔓延。'
+ chuzhiYuanze+='9、充分利用固定消防设施。'
+ chuzhiYuanze+='10、灭火剂要供应充足，兵力部署要符合灭火战斗要求，集中优势兵力，一举扑灭火灾，切忌供应出现中断和零打碎敲。'
+ chuzhiYuanze+='11、注意第一力量调集，调集兵力的数量要满足灭火需要，但不能过多，以免造成现场拥挤和混乱。7-11用厂区的作战行动动画做背景加上文字配音说明'
+ }
+ else if(biaotinum==3){
+ zuzhi.style.border="1px solid #0E79A9"
+ tedian.style.border="1px solid #0E79A9"
+ zhuyi.style.border="1px solid #0E79A9"
+ chuzhi.style.border="1px solid #30BBEC"
+ chuzhiYuanze+='1、安全防护
'
+ chuzhiYuanze+='①应综合考虑风力风向、工艺流程、地形地势、封闭管井等因素，'
+ chuzhiYuanze+='科学选择车辆站位和阵地设置；'
+ chuzhiYuanze+='②科学设置内、外观察哨，通过单位DCS系统设内观察哨，重点监测着火罐及周边邻近罐的介质、压力、温度、液位以及预警等级；通过在外部设观察哨，实时观察燃烧烟雾、火焰以及罐体外形变化、颤动声响等，确保整个作战行动安全可控；'
+ chuzhiYuanze+='③实施登罐灭火作业，在'
+ chuzhiYuanze+='完成泡沫覆盖完成后，现场人员应迅速佩戴空气呼吸器，第一时间撤离，防止硫化氢中毒。'
+ chuzhiYuanze+='2、泡沫灭火
'
+ chuzhiYuanze+='①登罐灭火最佳时间；着火时间冬季在'
+ chuzhiYuanze+='60 分钟'
+ chuzhiYuanze+='之内，夏季在 '
+ chuzhiYuanze+='40 分钟'
+ chuzhiYuanze+='之内；②登罐灭火作业，必须根据现场风向和液位合理布设进攻阵地，推进灭火过程还需注意风向变化，适时调整左右推进速度； '
+ chuzhiYuanze+='③严禁将移动炮、车载炮、高喷臂架炮的泡沫和冷却水直接打入罐体浮盘中央，'
+ chuzhiYuanze+='防止出现卡盘、沉盘。对着火罐的冷却要均匀，不能留有空白点，防止温差大导致罐体变形、塌陷；④泡沫灭火时，'
+ chuzhiYuanze+='应选用同一种类、比例、倍数的泡沫，'
+ chuzhiYuanze+='必须保证喷射的泡沫打在一侧的罐壁上，流向液面形成覆盖层，严禁不同方向同时喷射泡沫。⑤固定系统操作失误，到场水罐无可利用水源，应再采取冷油循环的基础上，控制灾情。再采取紧急调集远程供水。'
+ chuzhiYuanze+='3、沸溢喷溅
'
+ chuzhiYuanze+='①由于处置方法、处置程序错误或排水不及时，重质油品通常在起火'
+ chuzhiYuanze+='3-6小时'
+ chuzhiYuanze+='后罐内出现水垫层，随着油温传导水垫层气化出现油品沸溢，喷射时间一般晚于沸溢时间，常常先发生沸溢，间隔一段时间，再发生喷溅。现场指挥员要科学把握进攻时机，运用好浮盘中央排水和罐内紧急排水两种方法，加强储罐定时积水排放；'
+ chuzhiYuanze+='②一旦发生沸溢、喷溅征兆时，如罐体颤动、发出嘶撕声、浓黑的烟变白变淡、火焰变高耀眼、油面蠕动涌涨现象明显等，应立即发生撤离信号，指挥部应事先统一撤离信号、撤离的路径方式和集结区。'
+ }
+
+ mianban.innerHTML=chuzhiYuanze
+ }
+
+
}
diff --git a/src/app/ui/plan-assistance/plan-assistance.component.ts b/src/app/ui/plan-assistance/plan-assistance.component.ts
index 184ef01..c706246 100644
--- a/src/app/ui/plan-assistance/plan-assistance.component.ts
+++ b/src/app/ui/plan-assistance/plan-assistance.component.ts
@@ -24,6 +24,8 @@ export class PlanAssistanceComponent implements OnInit, AfterViewInit {
FillMode: 0,
FireElementId: 0,
FixedSize: false,
+ CanConnection: true,
+ ConnectionObjs: [],
Height: 32,
Width: 32,
Id: '5f67f92238f13cd2048cae9d',
@@ -51,6 +53,8 @@ export class PlanAssistanceComponent implements OnInit, AfterViewInit {
FillMode: 0,
FireElementId: 0,
FixedSize: false,
+ CanConnection: true,
+ ConnectionObjs: [],
Height: 32,
Width: 32,
Id: '5f67f92238f13cd2048cae9e',
@@ -78,6 +82,8 @@ export class PlanAssistanceComponent implements OnInit, AfterViewInit {
FillMode: 0,
FireElementId: 0,
FixedSize: false,
+ CanConnection: true,
+ ConnectionObjs: [],
Height: 32,
Width: 32,
Id: '5f67f92238f13cd2048cae9f',
@@ -105,6 +111,8 @@ export class PlanAssistanceComponent implements OnInit, AfterViewInit {
FillMode: 0,
FireElementId: 0,
FixedSize: false,
+ CanConnection: true,
+ ConnectionObjs: [],
Height: 32,
Width: 32,
Id: '5f67f92238f13cd2048caea0',
@@ -132,6 +140,8 @@ export class PlanAssistanceComponent implements OnInit, AfterViewInit {
FillMode: 0,
FireElementId: 0,
FixedSize: false,
+ CanConnection: true,
+ ConnectionObjs: [],
Height: 32,
Width: 32,
Id: '5f67f92238f13cd2048caea1',
@@ -159,6 +169,8 @@ export class PlanAssistanceComponent implements OnInit, AfterViewInit {
FillMode: 0,
FireElementId: 0,
FixedSize: false,
+ CanConnection: true,
+ ConnectionObjs: [],
Height: 32,
Width: 32,
Id: '5f67f92238f13cd2048caea2',
@@ -186,6 +198,8 @@ export class PlanAssistanceComponent implements OnInit, AfterViewInit {
FillMode: 0,
FireElementId: 0,
FixedSize: false,
+ CanConnection: true,
+ ConnectionObjs: [],
Height: 32,
Width: 32,
Id: '5f67f92238f13cd2048caea3',
@@ -213,6 +227,8 @@ export class PlanAssistanceComponent implements OnInit, AfterViewInit {
FillMode: 0,
FireElementId: 0,
FixedSize: false,
+ CanConnection: true,
+ ConnectionObjs: [],
Height: 32,
Width: 32,
Id: '5f67f92238f13cd2048caea4',
@@ -240,6 +256,8 @@ export class PlanAssistanceComponent implements OnInit, AfterViewInit {
FillMode: 0,
FireElementId: 0,
FixedSize: false,
+ CanConnection: true,
+ ConnectionObjs: [],
Height: 32,
Width: 32,
Id: '5f67f92238f13cd2048caea5',
@@ -267,6 +285,8 @@ export class PlanAssistanceComponent implements OnInit, AfterViewInit {
FillMode: 0,
FireElementId: 0,
FixedSize: false,
+ CanConnection: true,
+ ConnectionObjs: [],
Height: 32,
Width: 32,
Id: '5f67f92238f13cd2048caea6',
@@ -294,6 +314,8 @@ export class PlanAssistanceComponent implements OnInit, AfterViewInit {
FillMode: 0,
FireElementId: 0,
FixedSize: false,
+ CanConnection: true,
+ ConnectionObjs: [],
Height: 32,
Width: 32,
Id: '5f67f92238f13cd2048caea7',
@@ -321,6 +343,8 @@ export class PlanAssistanceComponent implements OnInit, AfterViewInit {
FillMode: 0,
FireElementId: 0,
FixedSize: false,
+ CanConnection: true,
+ ConnectionObjs: [],
Height: 32,
Width: 32,
Id: '5f67f92238f13cd2048caea8',
@@ -348,6 +372,8 @@ export class PlanAssistanceComponent implements OnInit, AfterViewInit {
FillMode: 0,
FireElementId: 0,
FixedSize: false,
+ CanConnection: true,
+ ConnectionObjs: [],
Height: 32,
Width: 32,
Id: '5f67f92238f13cd2048caea9',
@@ -375,6 +401,8 @@ export class PlanAssistanceComponent implements OnInit, AfterViewInit {
FillMode: 0,
FireElementId: 0,
FixedSize: false,
+ CanConnection: true,
+ ConnectionObjs: [],
Height: 32,
Width: 32,
Id: '5f67f92238f13cd2048caeaa',
@@ -402,6 +430,8 @@ export class PlanAssistanceComponent implements OnInit, AfterViewInit {
FillMode: 0,
FireElementId: 0,
FixedSize: false,
+ CanConnection: true,
+ ConnectionObjs: [],
Height: 32,
Width: 32,
Id: '5f67f92238f13cd2048caeab',
@@ -429,6 +459,8 @@ export class PlanAssistanceComponent implements OnInit, AfterViewInit {
FillMode: 0,
FireElementId: 0,
FixedSize: false,
+ CanConnection: true,
+ ConnectionObjs: [],
Height: 32,
Width: 32,
Id: '5f67f92238f13cd2048caeac',
@@ -456,6 +488,8 @@ export class PlanAssistanceComponent implements OnInit, AfterViewInit {
FillMode: 0,
FireElementId: 0,
FixedSize: false,
+ CanConnection: true,
+ ConnectionObjs: [],
Height: 32,
Width: 32,
Id: '5f67f92238f13cd2048caead',
@@ -483,6 +517,8 @@ export class PlanAssistanceComponent implements OnInit, AfterViewInit {
FillMode: 0,
FireElementId: 0,
FixedSize: false,
+ CanConnection: true,
+ ConnectionObjs: [],
Height: 32,
Width: 32,
Id: '5f67f92238f13cd2048caeae',
@@ -510,6 +546,8 @@ export class PlanAssistanceComponent implements OnInit, AfterViewInit {
FillMode: 0,
FireElementId: 0,
FixedSize: false,
+ CanConnection: true,
+ ConnectionObjs: [],
Height: 32,
Width: 32,
Id: '5f67f92238f13cd2048caeaf',
@@ -537,6 +575,8 @@ export class PlanAssistanceComponent implements OnInit, AfterViewInit {
FillMode: 0,
FireElementId: 0,
FixedSize: false,
+ CanConnection: true,
+ ConnectionObjs: [],
Height: 32,
Width: 32,
Id: '5f67f92238f13cd2048caeb0',
@@ -564,6 +604,8 @@ export class PlanAssistanceComponent implements OnInit, AfterViewInit {
FillMode: 0,
FireElementId: 0,
FixedSize: false,
+ CanConnection: true,
+ ConnectionObjs: [],
Height: 32,
Width: 32,
Id: '5f67f92238f13cd2048caeb1',
@@ -591,6 +633,8 @@ export class PlanAssistanceComponent implements OnInit, AfterViewInit {
FillMode: 0,
FireElementId: 0,
FixedSize: false,
+ CanConnection: true,
+ ConnectionObjs: [],
Height: 32,
Width: 32,
Id: '5f67f92238f13cd2048caeb2',
@@ -618,6 +662,8 @@ export class PlanAssistanceComponent implements OnInit, AfterViewInit {
FillMode: 0,
FireElementId: 0,
FixedSize: false,
+ CanConnection: true,
+ ConnectionObjs: [],
Height: 32,
Width: 32,
Id: '5f67f92238f13cd2048caeb3',
@@ -645,6 +691,8 @@ export class PlanAssistanceComponent implements OnInit, AfterViewInit {
FillMode: 0,
FireElementId: 0,
FixedSize: false,
+ CanConnection: true,
+ ConnectionObjs: [],
Height: 32,
Width: 32,
Id: '5f67f92238f13cd2048caeb4',
@@ -672,6 +720,8 @@ export class PlanAssistanceComponent implements OnInit, AfterViewInit {
FillMode: 0,
FireElementId: 0,
FixedSize: false,
+ CanConnection: true,
+ ConnectionObjs: [],
Height: 32,
Width: 32,
Id: '5f67f92238f13cd2048caeb5',
@@ -699,6 +749,8 @@ export class PlanAssistanceComponent implements OnInit, AfterViewInit {
FillMode: 0,
FireElementId: 0,
FixedSize: false,
+ CanConnection: true,
+ ConnectionObjs: [],
Height: 32,
Width: 32,
Id: '5f67f92238f13cd2048caeb6',
@@ -726,6 +778,8 @@ export class PlanAssistanceComponent implements OnInit, AfterViewInit {
FillMode: 0,
FireElementId: 0,
FixedSize: false,
+ CanConnection: true,
+ ConnectionObjs: [],
Height: 32,
Width: 32,
Id: '5f67f92238f13cd2048caeb7',
@@ -753,6 +807,8 @@ export class PlanAssistanceComponent implements OnInit, AfterViewInit {
FillMode: 0,
FireElementId: 0,
FixedSize: false,
+ CanConnection: true,
+ ConnectionObjs: [],
Height: 32,
Width: 32,
Id: '5f67f92238f13cd2048caeb8',
@@ -780,6 +836,8 @@ export class PlanAssistanceComponent implements OnInit, AfterViewInit {
FillMode: 0,
FireElementId: 0,
FixedSize: false,
+ CanConnection: true,
+ ConnectionObjs: [],
Height: 32,
Width: 32,
Id: '5f67f92238f13cd2048caeb9',
@@ -807,6 +865,8 @@ export class PlanAssistanceComponent implements OnInit, AfterViewInit {
FillMode: 0,
FireElementId: 0,
FixedSize: false,
+ CanConnection: true,
+ ConnectionObjs: [],
Height: 32,
Width: 32,
Id: '5f67f92238f13cd2048caeba',
@@ -834,6 +894,8 @@ export class PlanAssistanceComponent implements OnInit, AfterViewInit {
FillMode: 0,
FireElementId: 0,
FixedSize: false,
+ CanConnection: true,
+ ConnectionObjs: [],
Height: 32,
Width: 32,
Id: '5f67f92238f13cd2048caebb',
@@ -861,6 +923,8 @@ export class PlanAssistanceComponent implements OnInit, AfterViewInit {
FillMode: 0,
FireElementId: 0,
FixedSize: false,
+ CanConnection: true,
+ ConnectionObjs: [],
Height: 32,
Width: 32,
Id: '5f67f92238f13cd2048caebc',
@@ -888,6 +952,8 @@ export class PlanAssistanceComponent implements OnInit, AfterViewInit {
FillMode: 0,
FireElementId: 0,
FixedSize: false,
+ CanConnection: true,
+ ConnectionObjs: [],
Height: 32,
Width: 32,
Id: '5f67f92238f13cd2048caebd',
@@ -915,6 +981,8 @@ export class PlanAssistanceComponent implements OnInit, AfterViewInit {
FillMode: 0,
FireElementId: 0,
FixedSize: false,
+ CanConnection: true,
+ ConnectionObjs: [],
Height: 32,
Width: 32,
Id: '5f67f92238f13cd2048caebe',
@@ -942,6 +1010,8 @@ export class PlanAssistanceComponent implements OnInit, AfterViewInit {
FillMode: 0,
FireElementId: 0,
FixedSize: false,
+ CanConnection: true,
+ ConnectionObjs: [],
Height: 32,
Width: 32,
Id: '5f67f92238f13cd2048caebf',
@@ -969,6 +1039,8 @@ export class PlanAssistanceComponent implements OnInit, AfterViewInit {
FillMode: 0,
FireElementId: 0,
FixedSize: false,
+ CanConnection: true,
+ ConnectionObjs: [],
Height: 32,
Width: 32,
Id: '5f67f92238f13cd2048caec0',
@@ -996,6 +1068,8 @@ export class PlanAssistanceComponent implements OnInit, AfterViewInit {
FillMode: 0,
FireElementId: 0,
FixedSize: false,
+ CanConnection: true,
+ ConnectionObjs: [],
Height: 32,
Width: 32,
Id: '5f67f92238f13cd2048caec1',
@@ -1023,6 +1097,8 @@ export class PlanAssistanceComponent implements OnInit, AfterViewInit {
FillMode: 0,
FireElementId: 0,
FixedSize: false,
+ CanConnection: true,
+ ConnectionObjs: [],
Height: 32,
Width: 32,
Id: '5f67f92238f13cd2048caec2',
@@ -1050,6 +1126,8 @@ export class PlanAssistanceComponent implements OnInit, AfterViewInit {
FillMode: 0,
FireElementId: 0,
FixedSize: false,
+ CanConnection: true,
+ ConnectionObjs: [],
Height: 32,
Width: 32,
Id: '5f67f92238f13cd2048caec3',
@@ -1077,6 +1155,8 @@ export class PlanAssistanceComponent implements OnInit, AfterViewInit {
FillMode: 0,
FireElementId: 0,
FixedSize: false,
+ CanConnection: true,
+ ConnectionObjs: [],
Height: 32,
Width: 32,
Id: '5f67f92238f13cd2048caec4',
@@ -1104,6 +1184,8 @@ export class PlanAssistanceComponent implements OnInit, AfterViewInit {
FillMode: 0,
FireElementId: 0,
FixedSize: false,
+ CanConnection: true,
+ ConnectionObjs: [],
Height: 32,
Width: 32,
Id: '5f67f92238f13cd2048caec5',
@@ -1131,6 +1213,8 @@ export class PlanAssistanceComponent implements OnInit, AfterViewInit {
FillMode: 0,
FireElementId: 0,
FixedSize: false,
+ CanConnection: true,
+ ConnectionObjs: [],
Height: 32,
Width: 32,
Id: '5f67f92238f13cd2048caec6',
@@ -1158,6 +1242,8 @@ export class PlanAssistanceComponent implements OnInit, AfterViewInit {
FillMode: 0,
FireElementId: 0,
FixedSize: false,
+ CanConnection: true,
+ ConnectionObjs: [],
Height: 32,
Width: 32,
Id: '5f67f92238f13cd2048caec7',
@@ -1185,6 +1271,8 @@ export class PlanAssistanceComponent implements OnInit, AfterViewInit {
FillMode: 0,
FireElementId: 0,
FixedSize: false,
+ CanConnection: true,
+ ConnectionObjs: [],
Height: 32,
Width: 32,
Id: '5f67f92238f13cd2048caec8',
@@ -1212,6 +1300,8 @@ export class PlanAssistanceComponent implements OnInit, AfterViewInit {
FillMode: 0,
FireElementId: 0,
FixedSize: false,
+ CanConnection: true,
+ ConnectionObjs: [],
Height: 32,
Width: 32,
Id: '5f67f92238f13cd2048caec9',
@@ -1239,6 +1329,8 @@ export class PlanAssistanceComponent implements OnInit, AfterViewInit {
FillMode: 0,
FireElementId: 0,
FixedSize: false,
+ CanConnection: true,
+ ConnectionObjs: [],
Height: 32,
Width: 32,
Id: '5f67f92238f13cd2048caeca',
@@ -1266,6 +1358,8 @@ export class PlanAssistanceComponent implements OnInit, AfterViewInit {
FillMode: 0,
FireElementId: 0,
FixedSize: false,
+ CanConnection: true,
+ ConnectionObjs: [],
Height: 32,
Width: 32,
Id: '5f67f92238f13cd2048caecb',
@@ -1293,6 +1387,8 @@ export class PlanAssistanceComponent implements OnInit, AfterViewInit {
FillMode: 0,
FireElementId: 0,
FixedSize: false,
+ CanConnection: true,
+ ConnectionObjs: [],
Height: 32,
Width: 32,
Id: '5f67f92238f13cd2048caecc',
@@ -1320,6 +1416,8 @@ export class PlanAssistanceComponent implements OnInit, AfterViewInit {
FillMode: 0,
FireElementId: 0,
FixedSize: false,
+ CanConnection: true,
+ ConnectionObjs: [],
Height: 32,
Width: 32,
Id: '5f67f92238f13cd2048caecd',
@@ -1347,6 +1445,8 @@ export class PlanAssistanceComponent implements OnInit, AfterViewInit {
FillMode: 0,
FireElementId: 0,
FixedSize: false,
+ CanConnection: true,
+ ConnectionObjs: [],
Height: 32,
Width: 32,
Id: '5f67f92238f13cd2048caece',
@@ -1376,6 +1476,8 @@ export class PlanAssistanceComponent implements OnInit, AfterViewInit {
FillMode: 0,
FireElementId: 0,
FixedSize: false,
+ CanConnection: true,
+ ConnectionObjs: [],
Height: 32,
Width: 32,
Id: '5f67f92238f13cd2048cae9d',
diff --git a/src/app/ui/similar-plans/similar-plans.component.html b/src/app/ui/similar-plans/similar-plans.component.html
index 44bcb13..5863341 100644
--- a/src/app/ui/similar-plans/similar-plans.component.html
+++ b/src/app/ui/similar-plans/similar-plans.component.html
@@ -1 +1,13 @@
-similar-plans works!
+
+
+
+ | 单位名称 |
+ 始建于 |
+ 着火物 |
+ 点火位置 |
+ 相近度 |
+ 详情 |
+
+
+
+
'+"" +' | '
+ res+=''+""+' | '
+ res+=''+this.leisiYuan[i].weizhi+' | '
+ if(parseFloat(this.leisiYuan[i].xiangjin)'
+ }
+ else if(parseFloat(this.leisiYuan[i].xiangjin)<=parseFloat('60%')&&parseFloat(this.leisiYuan[i].xiangjin)>=parseFloat('50%')){
+ res+=''+this.leisiYuan[i].xiangjin+' | '
+ }
+ else{
+ res+=''+this.leisiYuan[i].xiangjin+' | '
+ }
+ res+='查看详情 | '
+ }
+ res+=''
+ var shuju=document.getElementById('shujubody')
+ shuju.innerHTML=res
}
}
diff --git a/src/app/working-area/working-area.component.ts b/src/app/working-area/working-area.component.ts
index e56d813..b49a02e 100644
--- a/src/app/working-area/working-area.component.ts
+++ b/src/app/working-area/working-area.component.ts
@@ -71,6 +71,14 @@ export class WorkingAreaComponent extends EventEmitter implements OnInit, AfterV
* 绘制点集合
*/
public paintPoints: PIXI.Point[] = [];
+ /**
+ * 绘制中的管线
+ */
+ public paintingPipeline: Pipeline = null;
+ /**
+ * 绘制中的箭头
+ */
+ public paintingArrows: Arrows = null;
/**
* 绘制中的多点图标
*/
@@ -148,11 +156,11 @@ export class WorkingAreaComponent extends EventEmitter implements OnInit, AfterV
// 删除 选中的数据
if (item.assetData.IsFromBuilding) {
// console.log(this.canvasData.originaleveryStoreyData.data[item.assetData.Id]);
- delete this.canvasData.originalcompanyBuildingData.data[item.assetData.Id];
+ delete this.canvasData.originalcompanyBuildingData?.data[item.assetData.Id];
// console.log(this.canvasData.originalcompanyBuildingData.data[item.assetData.Id]);
} else {
// console.log(this.canvasData.originaleveryStoreyData.data[item.assetData.Id]);
- delete this.canvasData.originaleveryStoreyData.data[item.assetData.Id];
+ delete this.canvasData.originaleveryStoreyData?.data[item.assetData.Id];
// console.log(this.canvasData.originaleveryStoreyData.data[item.assetData.Id]);
}
// console.log(this.backgroundImage.getChildByName(item.assetData.Id));
@@ -240,19 +248,27 @@ export class WorkingAreaComponent extends EventEmitter implements OnInit, AfterV
// this.createEnterPaintEndButton();
// this.backgroundImage.addChild(this.paintingLine);
this.on('select', obj => {
- if (obj instanceof MultipointIcon) {
- obj.setPointVisiable(true);
- } else if (obj instanceof PolygonIcon) {
- obj.setPointVisiable(true);
+ if (this.allowEdit) {
+ if (obj instanceof MultipointIcon) {
+ obj.setPointVisiable(true);
+ } else if (obj instanceof PolygonIcon) {
+ obj.setPointVisiable(true);
+ } else {
+ obj.filters = [this.outlineFilterGreen];
+ }
} else {
obj.filters = [this.outlineFilterGreen];
}
});
this.on('deselect', obj => {
- if (obj instanceof MultipointIcon) {
- obj.setPointVisiable(false);
- } else if (obj instanceof PolygonIcon) {
- obj.setPointVisiable(false);
+ if (this.allowEdit) {
+ if (obj instanceof MultipointIcon) {
+ obj.setPointVisiable(false);
+ } else if (obj instanceof PolygonIcon) {
+ obj.setPointVisiable(false);
+ } else {
+ obj.filters = [];
+ }
} else {
obj.filters = [];
}
@@ -263,13 +279,16 @@ export class WorkingAreaComponent extends EventEmitter implements OnInit, AfterV
if (item.assetData.FixedSize) {
const data = 1 / scale;
item.scale.set(data);
+ } else {
+ const data = 1 / scale;
+ item.text.scale.set(data);
}
} else if (item instanceof MultipointIcon) {
const data = 1 / scale;
- item.text.scale.set(scale);
+ item.text.scale.set(data);
} else if (item instanceof PolygonIcon) {
const data = 1 / scale;
- item.text.scale.set(scale);
+ item.text.scale.set(data);
}
});
});
@@ -294,6 +313,10 @@ export class WorkingAreaComponent extends EventEmitter implements OnInit, AfterV
this.rectToolGraphics.endFill();
this.rectToolGraphics.closePath();
}
+ if (this.paintingArrows !== null) {
+ this.paintingArrows.data.pointB = new PIXI.Point(this.circleShadow.position.x, this.circleShadow.position.y);
+ this.paintingArrows.refresh();
+ }
});
}
/**
@@ -404,7 +427,6 @@ export class WorkingAreaComponent extends EventEmitter implements OnInit, AfterV
const single = new SinglePointIcon(element, this);
});
this.setNameVisible(false, GameMode.BasicInformation);
- this.allowEdit = true;
const tempData = {
@@ -416,6 +438,8 @@ export class WorkingAreaComponent extends EventEmitter implements OnInit, AfterV
FillMode: 0,
FireElementId: 0,
FixedSize: false,
+ CanConnection: true,
+ ConnectionObjs: [],
Height: 45,
Width: 45,
Id: '5f67f92238f13cd2048cae9d',
@@ -448,9 +472,9 @@ export class WorkingAreaComponent extends EventEmitter implements OnInit, AfterV
IsFromBuilding: false,
GameMode: 2
};
- const tempCar = new SinglePointIcon(tempData, this);
+ const tempCar = new Car(tempData, this);
tempCar.setParent(this.app.stage);
- tempCar.position.set(300, 66);
+ tempCar.position.set(25, 25);
const tempData2 = {
TemplateId: null,
@@ -460,6 +484,8 @@ export class WorkingAreaComponent extends EventEmitter implements OnInit, AfterV
Enabled: true,
FillMode: 0,
FireElementId: 0,
+ CanConnection: true,
+ ConnectionObjs: [],
FixedSize: false,
Height: 45,
Width: 45,
@@ -493,14 +519,15 @@ export class WorkingAreaComponent extends EventEmitter implements OnInit, AfterV
IsFromBuilding: false,
GameMode: 2
};
- const tempCar2 = new SinglePointIcon(tempData2, this);
+ const tempCar2 = new Car(tempData2, this);
tempCar2.setParent(this.app.stage);
- tempCar2.position.set(300, 148);
+ tempCar2.position.set(25, 50);
- this.cancelPaint();
- this.paintMode = PaintMode.connection;
- this.previewSinglePointIcon.texture = PIXI.Texture.from('./assets/images/水罐消防车.png');
+ // 开始绘制管线
+ this.beginPaintPipeline();
+ // this.beginPaintingArrows();
}
+
/**
*
* @param id 图标ID
@@ -708,8 +735,30 @@ export class WorkingAreaComponent extends EventEmitter implements OnInit, AfterV
// }
// this.paintingIcon = new PolygonIcon(this.paintPoints, this);
break;
- case PaintMode.connection:
-
+ case PaintMode.Pipeline:
+ if (this.paintingPipeline !== null) {
+ this.currentClickPoint.position = new PIXI.Point(this.circleShadow.x, this.circleShadow.y);
+ this.paintPoints.push(new PIXI.Point(this.circleShadow.x, this.circleShadow.y));
+ this.paintingPipeline.assetData.MultiPoint = JSON.parse(JSON.stringify(this.paintPoints));
+ this.paintingPipeline.refresh();
+ }
+ // this.emit('backgroundScale', this.backgroundImage.scale.x);
+ break;
+ case PaintMode.Arrows:
+ if (this.paintingArrows === null) {
+ const data = {
+ name: 'string',
+ point: new PIXI.Point(this.circleShadow.x, this.circleShadow.y),
+ pointA: new PIXI.Point(this.circleShadow.x, this.circleShadow.y),
+ pointB: new PIXI.Point(this.circleShadow.x, this.circleShadow.y),
+ source: 'assets/images/进攻方向.png',
+ };
+ this.paintingArrows = new Arrows(data, this);
+ } else {
+ this.paintingArrows.ready = true;
+ this.paintingArrows = null;
+ this.beginPaintPipeline();
+ }
break;
}
} else if (!event.currentTarget.dragging && this.selection.isMultiselection === true) {
@@ -785,7 +834,7 @@ export class WorkingAreaComponent extends EventEmitter implements OnInit, AfterV
*/
public destroyBackgroundImage(): void {
this.app.stage.removeChild(this.backgroundImage);
- this.removeAllListeners('backgroundScale');
+ // this.removeAllListeners('backgroundScale');
}
/**
* 设置背景图缩放
@@ -895,6 +944,25 @@ export class WorkingAreaComponent extends EventEmitter implements OnInit, AfterV
this.previewSinglePointIcon.texture = PIXI.Texture.from(this.canvasData.selectTemplateData.imageUrl);
this.circleShadow.visible = true;
}
+ /**
+ * 开始绘制管线
+ */
+ private beginPaintPipeline(): void {
+ this.paintMode = PaintMode.Pipeline;
+ }
+ public paintingPipelineFinish(): void {
+ if (this.paintMode === PaintMode.Pipeline) {
+ this.paintMode = PaintMode.endPaint;
+ this.paintPoints.splice(0, this.paintPoints.length);
+ this.paintingPipeline = null;
+ }
+ this.beginPaintingArrows();
+ }
+ public beginPaintingArrows(): void {
+ this.paintMode = PaintMode.Arrows;
+ }
+
+
/**
* 取消绘画
*/
@@ -1037,9 +1105,9 @@ enum PaintMode {
singlePointIcon,
lineIcon,
polygonIcon,
- beginPainting,
endPaint,
- connection
+ Pipeline,
+ Arrows
}
/**
* 单点图标
@@ -1062,12 +1130,16 @@ export class SinglePointIcon extends PIXI.Container {
wordWrapWidth: 100,
});
- private text = new PIXI.Text(this.assetData.Name
+ public text = new PIXI.Text(this.assetData.Name
+ '\r\n'
+ this.assetData.PropertyInfos?.find(item => item.PropertyName === '名称/编号')?.PropertyValue, this.style);
private image = PIXI.Sprite.from(this.assetData.ImageUrl);
// 是否可以被链接
- canConnection: boolean;
+ canConnection = false;
+ // 链接对象
+ connectionObjs: any[] = [];
+ // 链接的管线
+ pipelines: any[] = [];
constructor(public assetData: any, private workingArea: WorkingAreaComponent) {
super();
@@ -1076,6 +1148,8 @@ export class SinglePointIcon extends PIXI.Container {
this.y = this.assetData.Point.y;
this.name = this.assetData.Id;
+ this.canConnection = this.assetData.CanConnection === undefined ? false : this.assetData.CanConnection;
+
this.image.angle = this.assetData.Angle;
this.image.x = 0;
@@ -1091,7 +1165,33 @@ export class SinglePointIcon extends PIXI.Container {
console.log(this.assetData);
event.stopPropagation();
this.workingArea.selection.selectOne(this);
- if (this.workingArea.allowEdit || this.assetData.GameMode === 2) {
+ if (this.canConnection && this.parent === this.workingArea.backgroundImage) {
+ if (this.workingArea.paintMode === PaintMode.Pipeline) {
+ if (this.workingArea.paintingPipeline === null) {
+ this.workingArea.previewLineSegment.visible = true;
+ this.workingArea.currentClickPoint.position =
+ new PIXI.Point(this.workingArea.circleShadow.x, this.workingArea.circleShadow.y);
+ this.workingArea.paintPoints.push(new PIXI.Point(this.position.x, this.position.y));
+ const tempData = {
+ Id: ObjectID.default.generate(),
+ MultiPoint: JSON.parse(JSON.stringify(this.workingArea.paintPoints)),
+ Point: new PIXI.Point(0, 0),
+ Name: '管线',
+ };
+ this.workingArea.paintingPipeline = new Pipeline(tempData, this.workingArea);
+ } else {
+ this.workingArea.previewLineSegment.visible = false;
+ this.workingArea.currentClickPoint.position =
+ new PIXI.Point(this.workingArea.circleShadow.x, this.workingArea.circleShadow.y);
+ this.workingArea.paintPoints.push(new PIXI.Point(this.position.x, this.position.y));
+ this.workingArea.paintingPipeline.assetData.MultiPoint = JSON.parse(JSON.stringify(this.workingArea.paintPoints));
+ this.workingArea.paintingPipeline.refresh();
+ this.workingArea.paintingPipelineFinish();
+ }
+ }
+ }
+ // 如果链接对象不为空,禁止移动
+ if ((this.workingArea.allowEdit || this.assetData.GameMode === 2) && this.connectionObjs.length === 0) {
event.currentTarget.parent.data = event.data;
event.currentTarget.parent.alpha = 0.5;
event.currentTarget.parent.dragging = true;
@@ -1646,12 +1746,94 @@ export class PolygonIcon extends PIXI.Container {
this.polygonGraphics.endFill();
}
}
-
-export class Conection extends PIXI.Container {
+export class Car extends SinglePointIcon {
}
-
-
+/**
+ * 管线
+ */
+export class Pipeline extends PIXI.Graphics {
+ constructor(public assetData: any, private workingArea: WorkingAreaComponent) {
+ super();
+ this.name = this.assetData.Id;
+ this.x = this.assetData.Point.x;
+ this.y = this.assetData.Point.y;
+ this.workingArea.backgroundImage.addChild(this);
+ // 画线图标
+ this.refresh();
+ this.interactive = true;
+ this.on('mousedown', event => {
+ console.log(this.assetData);
+ event.stopPropagation();
+ this.workingArea.selection.selectOne(this);
+ });
+ }
+ /**
+ * 刷新
+ */
+ public refresh() {
+ this.clear();
+ this.lineStyle(5, 0x0000ff, 1);
+ for (let i = 0, count = this.assetData.MultiPoint.length; i < count; i++) {
+ const pointA = this.assetData.MultiPoint[i];
+ if (i === 0) {
+ this.moveTo(pointA.x, pointA.y);
+ } else {
+ this.lineTo(pointA.x, pointA.y);
+ }
+ }
+ if (this.assetData.MultiPoint.length >= 2) {
+ const pointA = this.assetData.MultiPoint[0];
+ const pointB = this.assetData.MultiPoint[this.assetData.MultiPoint.length - 1];
+ // const angle = Math.atan2((pointB.y - pointA.y), (pointB.x - pointA.x)) * (5 / Math.PI);
+ this.beginFill(0x0000ff);
+ // this.drawStar(pointB.x, pointB.y, 3, 5, 0, angle);
+ this.drawCircle(pointA.x, pointA.y, 5);
+ this.drawCircle(pointB.x, pointB.y, 5);
+ this.endFill();
+ }
+ }
+}
+/**
+ * 箭头
+ * 创建一个只有2个点组成的箭头
+ */
+export class Arrows extends PIXI.Container {
+ public data: any;
+ public icon: PIXI.TilingSprite;
+ public ready = false;
+ constructor(assetData: any, private workingArea: WorkingAreaComponent) {
+ super();
+ this.workingArea.backgroundImage.addChild(this);
+ this.data = assetData;
+ // 画线图标
+ this.icon = new PIXI.TilingSprite(PIXI.Texture.from(this.data.source), 0, 68);
+ this.addChild(this.icon);
+ this.refresh();
+ this.interactive = true;
+ this.on('mousedown', event => {
+ if (!this.ready) { return; }
+ event.stopPropagation();
+ this.workingArea.selection.selectOne(this);
+ });
+ }
+ /**
+ * 刷新
+ */
+ public refresh() {
+ const angle = Math.atan2((this.data.pointB.y - this.data.pointA.y), (this.data.pointB.x - this.data.pointA.x)) * (180 / Math.PI);
+ const a = this.data.pointB.x - this.data.pointA.x;
+ const b = this.data.pointB.y - this.data.pointA.y;
+ const distance = Math.sqrt(a * a + b * b);
+
+ this.icon.width = distance;
+ this.icon.height = 68;
+ this.icon.anchor.set(0, 0.5);
+ this.icon.x = this.data.pointA.x;
+ this.icon.y = this.data.pointA.y;
+ this.icon.angle = angle;
+ }
+}
/**
* 选择器
*/
@@ -1792,117 +1974,3 @@ export class PropertyInfo {
*/
public PropertyValue: string;
}
-/**
- * demo图标
- */
-export class DemoIcon extends PIXI.Container {
- style = new PIXI.TextStyle({
- fontFamily: 'Arial',
- fontSize: 18,
- fontStyle: 'normal',
- fontWeight: 'bold',
- fill: ['#000000'],
- stroke: '#ffffff',
- strokeThickness: 3,
- dropShadow: true,
- dropShadowColor: '#000000',
- dropShadowBlur: 3,
- dropShadowAngle: Math.PI / 6,
- dropShadowDistance: 1,
- wordWrap: false,
- wordWrapWidth: 100,
- });
-
- private text = new PIXI.Text(this.assetData.Name
- + '\r\n'
- + this.assetData.PropertyInfos.find(item => item.PropertyName === '名称/编号')?.PropertyValue, this.style);
- private image = PIXI.Sprite.from(this.assetData.ImageUrl);
- constructor(public assetData: any, private workingArea: WorkingAreaComponent) {
- super();
- this.workingArea.backgroundImage.addChild(this);
- this.x = this.assetData.Point.x;
- this.y = this.assetData.Point.y;
- this.name = this.assetData.Id;
-
- this.image.angle = this.assetData.Angle;
-
- this.image.x = 0;
- this.image.y = 0;
- this.image.width = this.assetData.Width;
- this.image.height = this.assetData.Height;
-
- this.image.alpha = 1;
- this.image.anchor.set(0.5);
- this.image.interactive = true;
- this.image
- .on('mousedown', event => {
- event.stopPropagation();
- this.workingArea.selection.selectOne(this);
- if (this.workingArea.allowEdit) {
- event.currentTarget.parent.data = event.data;
- event.currentTarget.parent.alpha = 0.5;
- event.currentTarget.parent.dragging = true;
- }
- })
- .on('mouseup', event => {
- if (event.currentTarget.parent.dragging) {
- event.currentTarget.parent.alpha = 1;
- event.currentTarget.parent.dragging = false;
- event.currentTarget.parent.data = null;
- }
- })
- .on('mouseupoutside', event => {
- if (event.currentTarget.parent.dragging) {
- event.currentTarget.parent.alpha = 1;
- event.currentTarget.parent.dragging = false;
- event.currentTarget.parent.data = null;
- }
- })
- .on('mousemove', event => {
- if (event.currentTarget.parent.dragging) {
- const newPosition = event.currentTarget.parent.data.getLocalPosition(event.currentTarget.parent.parent);
- event.currentTarget.parent.x = newPosition.x;
- event.currentTarget.parent.y = newPosition.y;
- this.assetData.Point = new PIXI.Point(this.x, this.y);
- this.workingArea.canvasData.isChange = true;
- }
- })
- .on('rightclick', event => {
-
- })
- .on('mouseover', event => {
-
- });
-
- this.workingArea.on('backgroundScale', data => {
- if (this.assetData.FixedSize) {
- const scale = 1 / data;
- this.scale.set(scale);
- }
- });
-
- this.text.x = this.image.x;
- this.text.y = this.image.y - this.image.height / 2;
- this.text.anchor.set(0.5, 1);
-
- this.addChild(this.text);
- this.addChild(this.image);
- }
- // 设置名称
- public setNameVisible(value: boolean, mode: GameMode) {
- if (this.assetData.GameMode === mode) {
- this.text.visible = value;
- }
- }
- // 刷新
- public refresh() {
- this.image.width = this.assetData.Width;
- this.image.height = this.assetData.Height;
- this.image.angle = this.assetData.Angle;
- this.text.text = this.assetData.Name
- + '\r\n'
- + this.assetData.PropertyInfos.find(item => item.PropertyName === '名称/编号')?.PropertyValue;
- this.text.x = this.image.x;
- this.text.y = this.image.y - this.image.height / 2;
- }
-}
diff --git a/src/assets/images/进攻方向.png b/src/assets/images/进攻方向.png
new file mode 100644
index 0000000..914c848
Binary files /dev/null and b/src/assets/images/进攻方向.png differ