Skip to content
Toggle navigation
Projects
Groups
Snippets
Help
Toggle navigation
This project
Loading...
Sign in
platform
/
fanxing_new
Go to a project
Project
Repository
Issues
0
Merge Requests
0
Pipelines
Wiki
Settings
Activity
Graph
Charts
Create a new issue
Jobs
Commits
Issue Boards
Files
Commits
Branches
Tags
Contributors
Graph
Compare
Charts
Commit 2fe5bf34
authored
Mar 06, 2020
by
潘建波
Browse Files
Options
Browse Files
Tag
Download
Email Patches
Plain Diff
修改冲突提交
1 parent
4aaf34ab
Hide whitespace changes
Inline
Side-by-side
Showing
1 changed file
with
378 additions
and
373 deletions
src/views/sceneManage/setting/areaconfig/TraficCanvas.vue
src/views/sceneManage/setting/areaconfig/TraficCanvas.vue
View file @
2fe5bf3
...
...
@@ -341,83 +341,87 @@ export default {
typeFlag
:
1
,
//选择属性弹窗状态
lineNum
:
1
,
//车道线/车道序号
curLayerstate
:
false
,
//行人检测区域属性设置
testLayerstate
:
false
,
//测试检测区域属性设置
testLayerstate
:
false
,
//测试检测区域属性设置
polygon_id
:
""
,
//行人检测区域id
polygon_name
:
""
,
//行人检测区域name
markLineType
:
"0"
,
lanuse
:
'0'
,
//车道属性类型
guidingtype
:
''
,
//车道导向类型
markLineDirect
:
""
,
childUrl
:
""
,
//红绿灯区域截图
scale
:
{},
//红绿灯区域截图放大倍数
lightInfo
:
{
type
:
"1"
,
distribute
:
"1"
,
shap
:
"1"
,
delay
:
3
},
roiBody
:
{},
XMLStr
:
""
,
eventData
:[]
};
},
props
:
[
"bgUrl"
],
components
:
{
LightCanvas
},
methods
:
{
stageInit
:
function
(
params
)
{
console
.
log
(
"init1"
);
this
.
drawState
=
-
1
;
this
.
stage
=
new
Kinetic
.
Stage
({
container
:
"traficCanvas"
,
//<div>的id
width
:
800
,
//创建的舞台宽度
height
:
500
//创建的舞台高度
});
this
.
shadowLayer
=
new
Kinetic
.
Layer
({
id
:
"shadowLayer"
});
this
.
testLayer
=
new
Kinetic
.
Layer
({
id
:
"testLayer"
,
name
:
"layer"
});
this
.
lineLayer
=
new
Kinetic
.
Layer
({
id
:
"lineLayer"
,
name
:
"layer"
});
this
.
roadLayer
=
new
Kinetic
.
Layer
({
id
:
"roadLayer"
,
name
:
"layer"
});
this
.
lightLayer
=
new
Kinetic
.
Layer
({
id
:
"lightLayer"
,
name
:
"layer"
});
this
.
subtendLayer
=
new
Kinetic
.
Layer
({
id
:
"subtendLayer"
,
name
:
"layer"
});
this
.
noStopLayer
=
new
Kinetic
.
Layer
({
id
:
"noStopLayer"
,
name
:
"layer"
});
this
.
bicyLayer
=
new
Kinetic
.
Layer
({
//行人检测区域
id
:
"bicyLayer"
,
name
:
"layer"
});
this
.
densityLayer
=
new
Kinetic
.
Layer
({
//密度
id
:
'densityLayer'
,
name
:
"layer"
});
this
.
foreignLayer
=
new
Kinetic
.
Layer
({
//异物
id
:
'foreignLayer'
,
name
:
"layer"
});
this
.
testRegionLayer
=
new
Kinetic
.
Layer
({
//测试检测区域
id
:
'testRegionLayer'
,
name
:
"layer"
});
lanuse
:
"0"
,
//车道属性类型
guidingtype
:
""
,
//车道导向类型
markLineDirect
:
""
,
childUrl
:
""
,
//红绿灯区域截图
scale
:
{},
//红绿灯区域截图放大倍数
lightInfo
:
{
type
:
"1"
,
distribute
:
"1"
,
shap
:
"1"
,
delay
:
3
},
roiBody
:
{},
XMLStr
:
""
,
eventData
:
[]
};
},
props
:
[
"bgUrl"
],
components
:
{
LightCanvas
},
methods
:
{
stageInit
:
function
(
params
)
{
console
.
log
(
"init1"
);
this
.
drawState
=
-
1
;
this
.
stage
=
new
Kinetic
.
Stage
({
container
:
"traficCanvas"
,
//<div>的id
width
:
800
,
//创建的舞台宽度
height
:
500
//创建的舞台高度
});
this
.
shadowLayer
=
new
Kinetic
.
Layer
({
id
:
"shadowLayer"
});
this
.
testLayer
=
new
Kinetic
.
Layer
({
id
:
"testLayer"
,
name
:
"layer"
});
this
.
lineLayer
=
new
Kinetic
.
Layer
({
id
:
"lineLayer"
,
name
:
"layer"
});
this
.
roadLayer
=
new
Kinetic
.
Layer
({
id
:
"roadLayer"
,
name
:
"layer"
});
this
.
lightLayer
=
new
Kinetic
.
Layer
({
id
:
"lightLayer"
,
name
:
"layer"
});
this
.
subtendLayer
=
new
Kinetic
.
Layer
({
id
:
"subtendLayer"
,
name
:
"layer"
});
this
.
noStopLayer
=
new
Kinetic
.
Layer
({
id
:
"noStopLayer"
,
name
:
"layer"
});
this
.
bicyLayer
=
new
Kinetic
.
Layer
({
//行人检测区域
id
:
"bicyLayer"
,
name
:
"layer"
});
this
.
densityLayer
=
new
Kinetic
.
Layer
({
//密度
id
:
"densityLayer"
,
name
:
"layer"
});
this
.
foreignLayer
=
new
Kinetic
.
Layer
({
//异物
id
:
"foreignLayer"
,
name
:
"layer"
});
this
.
testRegionLayer
=
new
Kinetic
.
Layer
({
//测试检测区域
id
:
"testRegionLayer"
,
name
:
"layer"
});
let
shadow
=
new
Kinetic
.
Rect
({
x
:
0
,
//矩形左上角x坐标
y
:
0
,
//矩形左上角y坐标
...
...
@@ -455,7 +459,7 @@ export default {
this
.
stage
.
add
(
this
.
noStopLayer
);
this
.
stage
.
add
(
this
.
densityLayer
);
this
.
stage
.
add
(
this
.
foreignLayer
);
this
.
stage
.
add
(
this
.
testRegionLayer
)
this
.
stage
.
add
(
this
.
testRegionLayer
);
this
.
layers
=
[
this
.
testLayer
,
this
.
lineLayer
,
...
...
@@ -600,54 +604,56 @@ export default {
let
arrs
=
this
.
roadLayer
.
get
(
".arr"
);
let
arr
=
arrs
[
arrs
.
length
-
1
];
line
.
index
=
ele
.
lane_no
;
let
lane_guid_type
=
0
;
let
lane_use
=
0
;
if
(
obj
.
lanes
.
lane_count
==
1
)
{
lane_guid_type
=
obj
.
lanes
.
lane
.
lane_guiding_type
lane_use
=
obj
.
lanes
.
lane
.
lane_use_type
}
else
{
lane_guid_type
=
obj
.
lanes
.
lane
[
index
].
lane_guiding_type
;
lane_use
=
obj
.
lanes
.
lane
[
index
].
lane_use_type
}
let
lane_guid_type
=
0
;
let
lane_use
=
0
;
if
(
obj
.
lanes
.
lane_count
==
1
)
{
lane_guid_type
=
obj
.
lanes
.
lane
.
lane_guiding_type
;
lane_use
=
obj
.
lanes
.
lane
.
lane_use_type
;
}
else
{
lane_guid_type
=
obj
.
lanes
.
lane
[
index
].
lane_guiding_type
;
lane_use
=
obj
.
lanes
.
lane
[
index
].
lane_use_type
;
}
this
.
roads
[
parseInt
(
ele
.
lane_seq
-
1
)]
=
{
type
:
ele
.
lane_type
,
index
:
ele
.
lane_no
,
direct
:
direct
,
lane_guiding_type
:
lane_guid_type
,
lane_use_type
:
lane_use
};
}
});
}
catch
(
error
)
{
console
.
log
(
error
);
}
lane_guiding_type
:
obj
.
lanes
.
lane
[
index
].
lane_guiding_type
,
lane_use_type
:
obj
.
lanes
.
lane
[
index
].
lane_use_type
};
}
});
}
catch
(
error
)
{
console
.
log
(
error
);
}
//红绿灯
try
{
let
ary
=
obj
.
lights
.
light
;
if
(
!
ary
.
length
)
{
ary
=
[
ary
];
}
ary
.
forEach
((
ele
,
index
)
=>
{
let
points
=
ele
.
light_regions
.
light_region
;
let
left
=
points
.
left
*
800
;
let
top
=
points
.
top
*
500
;
let
right
=
points
.
right
*
800
;
let
bottom
=
points
.
bottom
*
500
;
let
pointsAry
=
[
left
,
top
,
left
,
bottom
,
right
,
bottom
,
right
,
top
];
let
rect
=
this
.
drawRect
(
"morePoints"
,
pointsAry
,
this
.
color
[
3
]);
let
linghtRoi
=
{
light_region_seq
:
1
,
top
:
(
top
/
500
).
toFixed
(
6
),
right
:
(
right
/
800
).
toFixed
(
6
),
bottom
:
(
bottom
/
500
).
toFixed
(
6
),
left
:
(
left
/
800
).
toFixed
(
6
)
};
(
rect
.
light_seq
=
index
+
1
),
(
rect
.
light_type
=
ele
.
light_type
),
(
rect
.
light_distribute
=
ele
.
light_distribute
),
(
rect
.
light_shape
=
ele
.
light_shape
),
(
rect
.
light_delay
=
ele
.
light_yellow_delay
||
ele
.
light_yellow_interval
),
}
//红绿灯
try
{
let
ary
=
obj
.
lights
.
light
;
if
(
!
ary
.
length
)
{
ary
=
[
ary
];
}
ary
.
forEach
((
ele
,
index
)
=>
{
let
points
=
ele
.
light_regions
.
light_region
;
let
left
=
points
.
left
*
800
;
let
top
=
points
.
top
*
500
;
let
right
=
points
.
right
*
800
;
let
bottom
=
points
.
bottom
*
500
;
let
pointsAry
=
[
left
,
top
,
left
,
bottom
,
right
,
bottom
,
right
,
top
];
let
rect
=
this
.
drawRect
(
"morePoints"
,
pointsAry
,
this
.
color
[
3
]);
let
linghtRoi
=
{
light_region_seq
:
1
,
top
:
(
top
/
500
).
toFixed
(
6
),
right
:
(
right
/
800
).
toFixed
(
6
),
bottom
:
(
bottom
/
500
).
toFixed
(
6
),
left
:
(
left
/
800
).
toFixed
(
6
)
};
(
rect
.
light_seq
=
index
+
1
),
(
rect
.
light_type
=
ele
.
light_type
),
(
rect
.
light_distribute
=
ele
.
light_distribute
),
(
rect
.
light_shape
=
ele
.
light_shape
),
(
rect
.
light_delay
=
ele
.
light_yellow_delay
||
ele
.
light_yellow_interval
),
(
rect
.
light_regions
=
{
light_region_count
:
1
,
light_region
:
linghtRoi
...
...
@@ -745,28 +751,28 @@ export default {
}
catch
(
error
)
{
console
.
log
(
error
);
}
//测试检测区域
try
{
let
testarr
=
obj
.
test_result_region
.
polygon
;
if
(
!
testarr
.
length
)
{
testarr
=
[
testarr
];
}
testarr
.
forEach
(
ele
=>
{
let
points
=
ele
.
point
;
let
bicRect
=
[];
for
(
let
i
=
0
;
i
<
points
.
length
;
i
++
)
{
const
point
=
points
[
i
];
bicRect
.
push
(
point
.
x
*
800
);
bicRect
.
push
(
point
.
y
*
500
);
}
let
rect
=
this
.
drawRect
(
"morePoints"
,
bicRect
,
this
.
color
[
9
]);
rect
.
polygon_name
=
ele
.
polygon_name
;
rect
.
polygon_id
=
ele
.
polygon_id
;
this
.
testRegionLayer
.
add
(
rect
);
});
}
catch
(
error
)
{
console
.
log
(
error
);
//测试检测区域
try
{
let
testarr
=
obj
.
test_result_region
.
polygon
;
if
(
!
testarr
.
length
)
{
testarr
=
[
testarr
];
}
testarr
.
forEach
(
ele
=>
{
let
points
=
ele
.
point
;
let
bicRect
=
[];
for
(
let
i
=
0
;
i
<
points
.
length
;
i
++
)
{
const
point
=
points
[
i
];
bicRect
.
push
(
point
.
x
*
800
);
bicRect
.
push
(
point
.
y
*
500
);
}
let
rect
=
this
.
drawRect
(
"morePoints"
,
bicRect
,
this
.
color
[
9
]);
rect
.
polygon_name
=
ele
.
polygon_name
;
rect
.
polygon_id
=
ele
.
polygon_id
;
this
.
testRegionLayer
.
add
(
rect
);
});
}
catch
(
error
)
{
console
.
log
(
error
);
}
this
.
selectedShape
=
null
;
this
.
drawRoad
();
...
...
@@ -963,14 +969,14 @@ export default {
this
.
startChangeShape
(
pos
,
layer
,
this
.
color
[
this
.
drawState
]);
}
break
;
case
9
:
if
(
this
.
needRect
)
{
this
.
endChangeShape
(
evt
);
}
else
{
this
.
needRect
=
true
;
this
.
startChangeShape
(
pos
,
layer
,
this
.
color
[
this
.
drawState
]);
}
break
;
case
9
:
if
(
this
.
needRect
)
{
this
.
endChangeShape
(
evt
);
}
else
{
this
.
needRect
=
true
;
this
.
startChangeShape
(
pos
,
layer
,
this
.
color
[
this
.
drawState
]);
}
break
;
default
:
break
;
}
...
...
@@ -986,7 +992,7 @@ export default {
this
.
markLineType
=
this
.
roads
[
shape
.
roadIndex
].
type
;
this
.
markLineDirect
=
this
.
roads
[
shape
.
roadIndex
].
direct
;
this
.
guidingtype
=
this
.
roads
[
shape
.
roadIndex
].
lane_guiding_type
;
this
.
lanuse
=
this
.
roads
[
shape
.
roadIndex
].
lane_use_type
||
'0'
;
this
.
lanuse
=
this
.
roads
[
shape
.
roadIndex
].
lane_use_type
||
"0"
;
shape
.
setFill
(
"rgba("
+
this
.
color
[
1
]
+
",0.3)"
);
let
gLine
=
this
.
greenLines
[
shape
.
roadIndex
];
if
(
gLine
.
getParent
().
attrs
.
name
==
"arr"
)
{
...
...
@@ -1030,13 +1036,12 @@ export default {
type
:
shape
.
light_type
,
shap
:
shape
.
light_shape
,
distribute
:
shape
.
light_distribute
,
delay
:
shape
.
light_delay
delay
:
shape
.
light_delay
};
}
else
if
(
this
.
drawState
==
6
||
this
.
drawState
==
7
||
this
.
drawState
==
8
||
this
.
drawState
==
9
this
.
drawState
==
8
)
{
this
.
polygon_name
=
shape
.
polygon_name
;
this
.
polygon_id
=
shape
.
polygon_id
;
...
...
@@ -1062,7 +1067,7 @@ export default {
)
{
this
.
blueLines
.
splice
(
this
.
lineNum
-
1
,
0
,
this
.
selectedShape
);
this
.
lineNum
++
;
this
.
roadFlag
=
false
;
this
.
roadFlag
=
false
;
}
this
.
selectedShape
.
line_type
=
this
.
markLineType
;
}
else
if
(
this
.
drawState
==
2
)
{
...
...
@@ -1106,7 +1111,7 @@ export default {
this
.
selectedShape
.
light_type
=
this
.
lightInfo
.
type
;
this
.
selectedShape
.
light_shape
=
this
.
lightInfo
.
shap
;
this
.
selectedShape
.
light_distribute
=
this
.
lightInfo
.
distribute
;
this
.
selectedShape
.
light_delay
=
this
.
lightInfo
.
delay
;
this
.
selectedShape
.
light_delay
=
this
.
lightInfo
.
delay
;
}
this
.
selectedShape
=
null
;
...
...
@@ -1114,23 +1119,23 @@ export default {
this
.
lightInfo
=
{
type
:
"1"
,
distribute
:
"1"
,
shap
:
"1"
,
delay
:
3
};
this
.
layers
[
this
.
drawState
].
draw
();
},
//开始绘制图形(第一次点击)
startChangeShape
:
function
(
pos
,
layer
,
col
)
{
let
ary
=
layer
.
get
(
".circle"
);
if
(
this
.
drawState
==
0
||
this
.
drawState
==
3
||
this
.
drawState
==
4
||
this
.
drawState
==
5
||
this
.
drawState
==
6
||
this
.
drawState
==
7
||
this
.
drawState
==
8
||
this
.
drawState
==
9
shap
:
"1"
,
delay
:
3
};
this
.
layers
[
this
.
drawState
].
draw
();
},
//开始绘制图形(第一次点击)
startChangeShape
:
function
(
pos
,
layer
,
col
)
{
let
ary
=
layer
.
get
(
".circle"
);
if
(
this
.
drawState
==
0
||
this
.
drawState
==
3
||
this
.
drawState
==
4
||
this
.
drawState
==
5
||
this
.
drawState
==
6
||
this
.
drawState
==
7
||
this
.
drawState
==
8
||
this
.
drawState
==
9
)
{
let
rect
=
this
.
drawRect
(
pos
,
pos
,
col
);
rect
.
moveToBottom
();
...
...
@@ -1246,14 +1251,12 @@ export default {
},
0
);
layer
.
draw
();
}
if
(
this
.
drawState
==
6
||
this
.
drawState
==
7
||
this
.
drawState
==
8
)
{
this
.
curLayerstate
=
true
;
}
if
(
this
.
drawState
==
9
){
this
.
testLayerstate
=
true
;
}
if
(
this
.
drawState
==
6
||
this
.
drawState
==
7
||
this
.
drawState
==
8
)
{
this
.
curLayerstate
=
true
;
}
if
(
this
.
drawState
==
9
)
{
this
.
testLayerstate
=
true
;
}
},
lineChange
:
function
name
()
{
let
color
=
"blue"
;
...
...
@@ -1304,7 +1307,7 @@ export default {
layer
.
draw
();
}
},
//行人检测信息/异物检测信息/测试检测区域
//行人检测信息/异物检测信息/测试检测区域
bicyEnter
()
{
let
curLayers
=
this
.
layers
[
this
.
drawState
].
get
(
".rect"
);
let
curlay
=
curLayers
[
curLayers
.
length
-
1
];
...
...
@@ -1312,11 +1315,10 @@ export default {
curlay
.
polygon_name
=
this
.
polygon_name
;
this
.
curLayerstate
=
false
;
//测试区域弹窗
this
.
testLayerstate
=
false
;
this
.
testLayerstate
=
false
;
//清空输入框
this
.
polygon_id
=
""
;
this
.
polygon_name
=
""
;
},
curlayCancel
()
{
let
curLayers
=
this
.
layers
[
this
.
drawState
].
get
(
".rect"
);
...
...
@@ -1442,6 +1444,7 @@ export default {
this
.
roadFlag
=
false
;
break
;
case
2
:
// eslint-disable-next-line no-case-declarations
let
rindex
=
this
.
roads
.
indexOf
(
this
.
selectedShape
);
console
.
log
(
rindex
);
this
.
roads
[
rindex
]
=
""
;
...
...
@@ -1449,6 +1452,7 @@ export default {
case
6
:
this
.
polygon_name
=
""
;
this
.
polygon_id
=
""
;
// eslint-disable-next-line no-fallthrough
default
:
break
;
}
...
...
@@ -1563,7 +1567,7 @@ export default {
(
rect
.
light_type
=
this
.
lightInfo
.
type
),
(
rect
.
light_distribute
=
this
.
lightInfo
.
distribute
),
(
rect
.
light_shape
=
this
.
lightInfo
.
shap
),
(
rect
.
light_delay
=
this
.
lightInfo
.
delay
),
(
rect
.
light_delay
=
this
.
lightInfo
.
delay
),
(
rect
.
light_regions
=
{
light_region_count
:
1
,
light_region
:
linghtRoi
...
...
@@ -1575,7 +1579,7 @@ export default {
type
:
"1"
,
distribute
:
"1"
,
shap
:
"1"
,
delay
:
3
delay
:
3
};
this
.
selectedShape
=
null
;
},
...
...
@@ -1596,22 +1600,22 @@ export default {
width
=
typeof
width
!=
"undefined"
?
width
:
1
;
color
=
typeof
color
!=
"color"
?
color
:
"#000"
;
// 计算各角度和对应的P2,P3坐标
var
angle
=
Math
.
atan2
(
c1
[
1
]
-
c2
[
1
],
c1
[
0
]
-
c2
[
0
])
*
180
/
Math
.
PI
,
angle1
=
(
angle
+
theta
)
*
Math
.
PI
/
180
,
angle2
=
(
angle
-
theta
)
*
Math
.
PI
/
180
,
topX
=
headlen
*
Math
.
cos
(
angle1
),
topY
=
headlen
*
Math
.
sin
(
angle1
),
botX
=
headlen
*
Math
.
cos
(
angle2
),
botY
=
headlen
*
Math
.
sin
(
angle2
);
// 计算各角度和对应的P2,P3坐标
var
angle
=
(
Math
.
atan2
(
c1
[
1
]
-
c2
[
1
],
c1
[
0
]
-
c2
[
0
])
*
180
)
/
Math
.
PI
,
angle1
=
((
angle
+
theta
)
*
Math
.
PI
)
/
180
,
angle2
=
((
angle
-
theta
)
*
Math
.
PI
)
/
180
,
topX
=
headlen
*
Math
.
cos
(
angle1
),
topY
=
headlen
*
Math
.
sin
(
angle1
),
botX
=
headlen
*
Math
.
cos
(
angle2
),
botY
=
headlen
*
Math
.
sin
(
angle2
);
var
arrowX
=
c1
[
0
]
-
topX
,
arrowY
=
c1
[
1
]
-
topY
;
// let line = this.drawLine({x:c1[0],y:c1[1]},{x:c2[0],y:c2[1]},color)
line
.
attrs
.
name
=
"`centerLine`
"
;
arrowX
=
c2
[
0
]
+
topX
;
arrowY
=
c2
[
1
]
+
topY
;
// let line = this.drawLine({x:c1[0],y:c1[1]},{x:c2[0],y:c2[1]},color)
line
.
attrs
.
name
=
"centerLine
"
;
arrowX
=
c2
[
0
]
+
topX
;
arrowY
=
c2
[
1
]
+
topY
;
let
line1
=
this
.
drawLine
(
{
x
:
c2
[
0
],
y
:
c2
[
1
]
},
...
...
@@ -1652,91 +1656,93 @@ export default {
}
this
.
roadLayer
.
draw
();
try
{
// console.log('蓝色车道线')
// console.log(this.blueLines)
this
.
blueLines
.
forEach
((
ele
,
index
)
=>
{
if
(
ele
.
attrs
.
points
[
1
]
-
ele
.
attrs
.
points
[
3
]
>
0
)
{
var
copypoint
=
Array
.
from
(
ele
.
attrs
.
points
);
ele
.
attrs
.
points
[
0
]
=
copypoint
[
2
]
ele
.
attrs
.
points
[
1
]
=
copypoint
[
3
]
ele
.
attrs
.
points
[
2
]
=
copypoint
[
0
]
ele
.
attrs
.
points
[
3
]
=
copypoint
[
1
]
// console.log('*******蓝色车道线*******')
// console.log(ele)
}
})
//车道线根据坐标排序
function
sortBlueLine
(
arr
){
var
len
=
arr
.
length
;
for
(
var
i
=
0
;
i
<
len
;
i
++
)
{
for
(
var
j
=
0
;
j
<
len
-
1
-
i
;
j
++
)
{
if
(
arr
[
j
].
attrs
.
points
[
0
]
>
arr
[
j
+
1
].
attrs
.
points
[
0
])
{
//相邻元素两两对比
var
temp
=
arr
[
j
+
1
];
//元素交换
arr
[
j
+
1
]
=
arr
[
j
];
arr
[
j
]
=
temp
;
}
}
}
return
arr
;
try
{
// console.log('蓝色车道线')
// console.log(this.blueLines)
this
.
blueLines
.
forEach
((
ele
,
index
)
=>
{
if
(
ele
.
attrs
.
points
[
1
]
-
ele
.
attrs
.
points
[
3
]
>
0
)
{
var
copypoint
=
Array
.
from
(
ele
.
attrs
.
points
);
ele
.
attrs
.
points
[
0
]
=
copypoint
[
2
];
ele
.
attrs
.
points
[
1
]
=
copypoint
[
3
];
ele
.
attrs
.
points
[
2
]
=
copypoint
[
0
];
ele
.
attrs
.
points
[
3
]
=
copypoint
[
1
];
// console.log('*******蓝色车道线*******')
// console.log(ele)
}
console
.
log
(
'排序后的蓝色车道线'
)
console
.
log
(
sortBlueLine
(
this
.
blueLines
))
this
.
blueLines
.
forEach
((
ele
,
index
)
=>
{
let
points
=
this
.
sortLinePoints
(
ele
.
attrs
.
points
);
if
(
index
>
0
)
{
//绘制车道
let
lastPoints
=
this
.
sortLinePoints
(
this
.
blueLines
[
index
-
1
].
attrs
.
points
);
let
num1
=
Math
.
pow
(
points
[
0
]
-
lastPoints
[
0
],
2
)
+
Math
.
pow
(
points
[
1
]
-
lastPoints
[
1
],
2
)
+
Math
.
pow
(
points
[
2
]
-
lastPoints
[
2
],
2
)
+
Math
.
pow
(
points
[
3
]
-
lastPoints
[
3
],
2
);
let
num2
=
Math
.
pow
(
points
[
0
]
-
lastPoints
[
2
],
2
)
+
Math
.
pow
(
points
[
1
]
-
lastPoints
[
3
],
2
)
+
Math
.
pow
(
points
[
2
]
-
lastPoints
[
0
],
2
)
+
Math
.
pow
(
points
[
3
]
-
lastPoints
[
1
],
2
);
let
mPoints
;
if
(
num1
<
num2
)
{
mPoints
=
points
.
concat
([
lastPoints
[
2
],
lastPoints
[
3
],
lastPoints
[
0
],
lastPoints
[
1
]
]);
}
else
{
mPoints
=
points
.
concat
([
lastPoints
[
0
],
lastPoints
[
1
],
lastPoints
[
2
],
lastPoints
[
3
]
]);
}
let
rect
=
this
.
drawRect
(
"morePoints"
,
mPoints
,
this
.
color
[
1
],
false
);
rect
.
roadIndex
=
index
-
1
;
this
.
roadLayer
.
add
(
rect
);
//绘制车道中线
if
(
!
this
.
roads
[
index
-
1
])
{
this
.
roads
[
index
-
1
]
=
{};
});
//车道线根据坐标排序
// eslint-disable-next-line no-inner-declarations
function
sortBlueLine
(
arr
)
{
var
len
=
arr
.
length
;
for
(
var
i
=
0
;
i
<
len
;
i
++
)
{
for
(
var
j
=
0
;
j
<
len
-
1
-
i
;
j
++
)
{
if
(
arr
[
j
].
attrs
.
points
[
0
]
>
arr
[
j
+
1
].
attrs
.
points
[
0
])
{
//相邻元素两两对比
var
temp
=
arr
[
j
+
1
];
//元素交换
arr
[
j
+
1
]
=
arr
[
j
];
arr
[
j
]
=
temp
;
}
let
road
=
this
.
roads
[
index
-
1
];
let
cPoints
=
[
(
mPoints
[
0
]
+
mPoints
[
6
])
/
2
,
(
mPoints
[
1
]
+
mPoints
[
7
])
/
2
,
(
mPoints
[
2
]
+
mPoints
[
4
])
/
2
,
(
mPoints
[
3
]
+
mPoints
[
5
])
/
2
,
];
road
.
cPoints
=
cPoints
;
let
cLine
=
this
.
drawLine
(
"morePoints"
,
cPoints
,
this
.
color
[
2
]);
this
.
greenLines
[
index
-
1
]
=
cLine
;
}
}
return
arr
;
}
console
.
log
(
"排序后的蓝色车道线"
);
console
.
log
(
sortBlueLine
(
this
.
blueLines
));
this
.
blueLines
.
forEach
((
ele
,
index
)
=>
{
let
points
=
this
.
sortLinePoints
(
ele
.
attrs
.
points
);
if
(
index
>
0
)
{
//绘制车道
let
lastPoints
=
this
.
sortLinePoints
(
this
.
blueLines
[
index
-
1
].
attrs
.
points
);
let
num1
=
Math
.
pow
(
points
[
0
]
-
lastPoints
[
0
],
2
)
+
Math
.
pow
(
points
[
1
]
-
lastPoints
[
1
],
2
)
+
Math
.
pow
(
points
[
2
]
-
lastPoints
[
2
],
2
)
+
Math
.
pow
(
points
[
3
]
-
lastPoints
[
3
],
2
);
let
num2
=
Math
.
pow
(
points
[
0
]
-
lastPoints
[
2
],
2
)
+
Math
.
pow
(
points
[
1
]
-
lastPoints
[
3
],
2
)
+
Math
.
pow
(
points
[
2
]
-
lastPoints
[
0
],
2
)
+
Math
.
pow
(
points
[
3
]
-
lastPoints
[
1
],
2
);
let
mPoints
;
if
(
num1
<
num2
)
{
mPoints
=
points
.
concat
([
lastPoints
[
2
],
lastPoints
[
3
],
lastPoints
[
0
],
lastPoints
[
1
]
]);
}
else
{
mPoints
=
points
.
concat
([
lastPoints
[
0
],
lastPoints
[
1
],
lastPoints
[
2
],
lastPoints
[
3
]
]);
}
let
rect
=
this
.
drawRect
(
"morePoints"
,
mPoints
,
this
.
color
[
1
],
false
);
rect
.
roadIndex
=
index
-
1
;
this
.
roadLayer
.
add
(
rect
);
//绘制车道中线
if
(
!
this
.
roads
[
index
-
1
])
{
this
.
roads
[
index
-
1
]
=
{};
}
let
road
=
this
.
roads
[
index
-
1
];
let
cPoints
=
[
(
mPoints
[
0
]
+
mPoints
[
6
])
/
2
,
(
mPoints
[
1
]
+
mPoints
[
7
])
/
2
,
(
mPoints
[
2
]
+
mPoints
[
4
])
/
2
,
(
mPoints
[
3
]
+
mPoints
[
5
])
/
2
];
road
.
cPoints
=
cPoints
;
let
cLine
=
this
.
drawLine
(
"morePoints"
,
cPoints
,
this
.
color
[
2
]);
this
.
greenLines
[
index
-
1
]
=
cLine
;
if
(
road
.
direct
==
undefined
)
{
this
.
roadLayer
.
add
(
cLine
);
...
...
@@ -1789,7 +1795,6 @@ export default {
childCancle
:
function
()
{
this
.
$refs
.
lightCanvas
.
cancle
();
},
//生成xml
save
:
function
()
{
this
.
cancleSelectedGroup
();
//车牌检测区域
...
...
@@ -2048,10 +2053,10 @@ export default {
console
.
log
(
"#######################"
);
console
.
log
(
lanaAry
);
console
.
log
(
"#######################"
);
this
.
roiBody
.
lanes
=
{
lane_count
:
lanaAry
.
length
?
lanaAry
.
length
:
0
,
lane
:
lanaAry
?
lanaAry
:
[]
}
this
.
roiBody
.
lanes
=
{
lane_count
:
lanaAry
.
length
?
lanaAry
.
length
:
0
,
lane
:
lanaAry
?
lanaAry
:
[]
};
//对向车道
try
{
this
.
subtendLayer
.
get
(
".rect"
).
forEach
((
el
,
index
)
=>
{
...
...
@@ -2089,22 +2094,22 @@ export default {
// 红绿灯区域
let
lightAry
=
[];
try
{
this
.
lightLayer
.
get
(
".rect"
).
forEach
((
ele
,
index
)
=>
{
lightAry
.
push
({
light_seq
:
index
+
1
,
light_type
:
ele
.
light_type
,
light_id
:
ele
.
light_type
,
light_distribute
:
ele
.
light_distribute
,
light_number_type
:
ele
.
light_distribute
,
light_yellow_delay
:
Number
(
ele
.
light_delay
),
light_yellow_interval
:
Number
(
ele
.
light_delay
),
light_shape
:
ele
.
light_shape
,
light_shape_type
:
ele
.
light_shape
,
light_regions
:
ele
.
light_regions
,
});
});
}
catch
(
error
)
{}
try
{
this
.
lightLayer
.
get
(
".rect"
).
forEach
((
ele
,
index
)
=>
{
lightAry
.
push
({
light_seq
:
index
+
1
,
light_type
:
ele
.
light_type
,
light_id
:
ele
.
light_type
,
light_distribute
:
ele
.
light_distribute
,
light_number_type
:
ele
.
light_distribute
,
light_yellow_delay
:
Number
(
ele
.
light_delay
),
light_yellow_interval
:
Number
(
ele
.
light_delay
),
light_shape
:
ele
.
light_shape
,
light_shape_type
:
ele
.
light_shape
,
light_regions
:
ele
.
light_regions
});
});
}
catch
(
error
)
{}
this
.
roiBody
.
lights
=
{
light_count
:
lightAry
.
length
,
light
:
lightAry
...
...
@@ -2175,7 +2180,7 @@ export default {
this
.
roiBody
.
median_lines
=
{
lane_count
:
roadAry
.
length
?
roadAry
.
length
:
0
,
lane
:
roadAry
?
roadAry
:
[]
};
};
//行人密度检测区域
let
densityAry
=
[];
...
...
@@ -2231,87 +2236,87 @@ export default {
polygon
:
foreignAry
};
//测试检测区域
let
testRegion
=
[];
try
{
this
.
testRegionLayer
.
get
(
".rect"
).
forEach
((
el
,
index
)
=>
{
let
foAry
=
[];
let
points
=
el
.
attrs
.
points
;
for
(
let
i
=
0
;
i
<
points
.
length
;
i
+=
2
)
{
foAry
.
push
({
point_seq
:
i
/
2
+
1
,
x
:
(
points
[
i
]
/
800
).
toFixed
(
6
),
y
:
(
points
[
i
+
1
]
/
500
).
toFixed
(
6
)
});
}
testRegion
.
push
({
polygon_id
:
el
.
polygon_id
,
polygon_name
:
el
.
polygon_name
,
polygon_point_count
:
foAry
.
length
,
point
:
foAry
//测试检测区域
let
testRegion
=
[];
try
{
this
.
testRegionLayer
.
get
(
".rect"
).
forEach
((
el
,
index
)
=>
{
let
foAry
=
[];
let
points
=
el
.
attrs
.
points
;
for
(
let
i
=
0
;
i
<
points
.
length
;
i
+=
2
)
{
foAry
.
push
({
point_seq
:
i
/
2
+
1
,
x
:
(
points
[
i
]
/
800
).
toFixed
(
6
),
y
:
(
points
[
i
+
1
]
/
500
).
toFixed
(
6
)
});
}
testRegion
.
push
({
polygon_id
:
el
.
polygon_id
,
polygon_name
:
el
.
polygon_name
,
polygon_point_count
:
foAry
.
length
,
point
:
foAry
});
}
catch
(
error
)
{}
});
}
catch
(
error
)
{}
this
.
roiBody
.
test_result_region
=
{
region_count
:
foreignAry
.
length
,
polygon
:
testRegion
};
this
.
roiBody
.
test_result_region
=
{
region_count
:
foreignAry
.
length
,
polygon
:
testRegion
};
console
.
log
(
this
.
roiBody
);
return
this
.
oParse
.
writeXML
({
roi
:
this
.
roiBody
});
},
clear
:
function
()
{
(
this
.
blueLines
=
[]),
(
this
.
roads
=
[]),
(
this
.
drawState
=
-
1
),
(
this
.
smallWindow
=
false
),
(
this
.
roadFlag
=
""
),
(
this
.
needRect
=
false
),
(
this
.
needLine
=
false
),
(
this
.
canvasState
=
0
),
(
this
.
polygon_name
=
''
),
(
this
.
polygon_id
=
''
),
(
this
.
polyline
=
0
);
$
(
".modal-lt button"
).
removeClass
(
"active"
);
},
sortLinePoints
(
pointarr
){
try
{
let
newpoint
=
[];
if
((
pointarr
[
1
]
-
pointarr
[
3
])
>
0
){
newpoint
[
0
]
=
pointarr
[
2
]
newpoint
[
1
]
=
pointarr
[
3
]
newpoint
[
2
]
=
pointarr
[
0
]
newpoint
[
3
]
=
pointarr
[
1
]
}
else
{
newpoint
=
pointarr
}
return
newpoint
}
catch
(
err
){
console
.
log
(
err
)
console
.
log
(
this
.
roiBody
);
return
this
.
oParse
.
writeXML
({
roi
:
this
.
roiBody
});
},
clear
:
function
()
{
(
this
.
blueLines
=
[]),
(
this
.
roads
=
[]),
(
this
.
drawState
=
-
1
),
(
this
.
smallWindow
=
false
),
(
this
.
roadFlag
=
""
),
(
this
.
needRect
=
false
),
(
this
.
needLine
=
false
),
(
this
.
canvasState
=
0
),
(
this
.
polygon_name
=
""
),
(
this
.
polygon_id
=
""
),
(
this
.
polyline
=
0
);
$
(
".modal-lt button"
).
removeClass
(
"active"
);
},
sortLinePoints
(
pointarr
)
{
try
{
let
newpoint
=
[];
if
(
pointarr
[
1
]
-
pointarr
[
3
]
>
0
)
{
newpoint
[
0
]
=
pointarr
[
2
];
newpoint
[
1
]
=
pointarr
[
3
];
newpoint
[
2
]
=
pointarr
[
0
];
newpoint
[
3
]
=
pointarr
[
1
];
}
else
{
newpoint
=
pointarr
;
}
},
changetestid
(){
this
.
eventData
.
forEach
(
ele
=>
{
if
(
ele
.
value
==
this
.
polygon_id
){
this
.
polygon_name
=
ele
.
name
}
})
return
newpoint
;
}
catch
(
err
)
{
console
.
log
(
err
);
}
},
mounted
()
{
console
.
log
(
eventJson
)
this
.
eventData
=
eventJson
// this.stageInit()
key
(
'alt+1'
,()
=>
{
if
(
this
.
istest
)
{
this
.
istest
=
false
}
else
{
this
.
istest
=
true
}
})
changetestid
()
{
this
.
eventData
.
forEach
(
ele
=>
{
if
(
ele
.
value
==
this
.
polygon_id
)
{
this
.
polygon_name
=
ele
.
name
;
}
});
}
};
},
mounted
()
{
console
.
log
(
eventJson
);
this
.
eventData
=
eventJson
;
// this.stageInit()
key
(
"alt+1"
,
()
=>
{
if
(
this
.
istest
)
{
this
.
istest
=
false
;
}
else
{
this
.
istest
=
true
;
}
});
}
};
</
script
>
<
style
scoped
>
...
...
Write
Preview
Markdown
is supported
Attach a file
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to post a comment