Skip to content
Projects
Groups
Snippets
Help
Loading...
Help
Support
Submit feedback
Contribute to GitLab
Sign in / Register
Toggle navigation
卡
卡车调度系统
Project
Project
Details
Activity
Releases
Cycle Analytics
Repository
Repository
Files
Commits
Branches
Tags
Contributors
Graph
Compare
Charts
Issues
0
Issues
0
List
Boards
Labels
Milestones
Merge Requests
0
Merge Requests
0
CI / CD
CI / CD
Pipelines
Jobs
Schedules
Charts
Wiki
Wiki
Snippets
Snippets
Members
Members
Collapse sidebar
Close sidebar
Activity
Graph
Charts
Create a new issue
Jobs
Commits
Issue Boards
Open sidebar
caicaicai
卡车调度系统
Commits
2128f067
Commit
2128f067
authored
Apr 07, 2022
by
caicaicai
Browse files
Options
Browse Files
Download
Email Patches
Plain Diff
修改
parent
dcce6961
Changes
5
Hide whitespace changes
Inline
Side-by-side
Showing
5 changed files
with
1229 additions
and
13 deletions
+1229
-13
Map.vue
src/components/mars3d/Map.vue
+3
-3
Map2.vue
src/components/mars3d/Map2.vue
+561
-0
Map3.vue
src/components/mars3d/Map3.vue
+561
-0
index.vue
src/views/carManagement/carTrajectory/index.vue
+46
-3
index.vue
src/views/regionalManagement/regionalInformation/index.vue
+58
-7
No files found.
src/components/mars3d/Map.vue
View file @
2128f067
...
...
@@ -138,7 +138,7 @@ export default {
let
that
=
this
;
HttpReq
.
truckDispatching
.
screenMapSetUpQuery
({
size
:
9999
}).
then
((
res
)
=>
{
if
(
true
){;
//
console.log(res);
console
.
log
(
res
);
let
data1
=
[];
for
(
let
key
in
res
){
that
.
weilanName
.
push
(
key
);
...
...
@@ -153,8 +153,8 @@ export default {
data1
.
push
(
arrays
)
}
that
.
zuobianData
=
data1
//
console.log("zuobianData",that.zuobianData);
//
console.log("weilanName",that.weilanName);
console
.
log
(
"
zuobianData
"
,
that
.
zuobianData
);
console
.
log
(
"
weilanName
"
,
that
.
weilanName
);
if
(
this
.
appendToBody
)
{
document
.
body
.
appendChild
(
this
.
$el
)
...
...
src/components/mars3d/Map2.vue
0 → 100644
View file @
2128f067
<
template
>
<div
style=
"wight:100%;height:100%;"
>
<div
:id=
"`mars3d-container$
{mapKey}`"
:class="['mars3d-container', customClass, { 'mars3d-container-compare-rh' : compare }]">
</div>
<!--
<div
class=
"infoview"
>
<el-button
type=
"primary"
@
click=
"btnStartDraw()"
>
设置围栏
</el-button>
<el-button
type=
"primary"
@
click=
"uploaded()"
>
上传围栏
</el-button>
<div
style=
"display: inline-block;color:red;font-weight:bolder;"
>
每次只允许上传一个围栏,并且围栏必须是封闭图形
</div>
</div>
-->
</div>
</
template
>
<
script
>
import
Vue
from
'
vue
'
import
{
Tools
,
HttpReq
,
CAMap
}
from
'
@/assets/js/common.js
'
;
// 使用免费开源版本
import
'
mars3d/dist/mars3d.css
'
import
*
as
mars3d
from
'
mars3d
'
import
*
as
Cesium
from
'
mars3d-cesium/Build/Cesium/Cesium
'
import
{
initGraphicManager
,
initLayerManager
,
bindLayerContextMenu
}
from
'
./js/graphicManager
'
// 导入插件(其他插件类似,插件清单访问:http://mars3d.cn/dev/guide/start/install.html)
// echarts插件
// import 'mars3d-echarts'
// 为了方便使用,绑定到原型链,在其他vue文件,直接 this.mars3d 来使用
Vue
.
prototype
.
mars3d
=
mars3d
Vue
.
prototype
.
Cesium
=
mars3d
.
Cesium
var
map
;
export
default
{
name
:
'
mars3dViewer
'
,
created
(){
this
.
getCoordinate
();
},
data
(){
return
{
persons
:[
[
"
115.358833
"
,
"
39.276448
"
,
"
500
"
],
[
"
115.358638
"
,
"
39.272818
"
,
"
500
"
],
[
"
115.368738
"
,
"
39.272818
"
,
"
500
"
],
[
"
115.368638
"
,
"
39.278518
"
,
"
500
"
],
[
"
115.358538
"
,
"
39.278818
"
,
"
500
"
],
[
"
115.348538
"
,
"
39.275818
"
,
"
500
"
],
[
"
115.351538
"
,
"
39.273318
"
,
"
500
"
],
[
"
115.357833
"
,
"
39.275448
"
,
"
500
"
],
[
"
115.358833
"
,
"
39.276448
"
,
"
500
"
],
[
"
115.358638
"
,
"
39.272818
"
,
"
500
"
],
[
"
115.368738
"
,
"
39.272818
"
,
"
500
"
],
[
"
115.368638
"
,
"
39.278518
"
,
"
500
"
],
[
"
115.358538
"
,
"
39.278818
"
,
"
500
"
],
[
"
115.348538
"
,
"
39.275818
"
,
"
500
"
],
[
"
115.351538
"
,
"
39.273318
"
,
"
500
"
],
[
"
115.357833
"
,
"
39.275448
"
,
"
500
"
],
[
"
115.358833
"
,
"
39.276448
"
,
"
500
"
],
[
"
115.358638
"
,
"
39.272818
"
,
"
500
"
],
[
"
115.368738
"
,
"
39.272818
"
,
"
500
"
],
[
"
115.368638
"
,
"
39.278518
"
,
"
500
"
],
[
"
115.358538
"
,
"
39.278818
"
,
"
500
"
],
[
"
115.348538
"
,
"
39.275818
"
,
"
500
"
],
[
"
115.351538
"
,
"
39.273318
"
,
"
500
"
],
[
"
115.357833
"
,
"
39.275448
"
,
"
500
"
],
[
"
115.358833
"
,
"
39.276448
"
,
"
500
"
],
[
"
115.358638
"
,
"
39.272818
"
,
"
500
"
],
[
"
115.368738
"
,
"
39.272818
"
,
"
500
"
],
[
"
115.368638
"
,
"
39.278518
"
,
"
500
"
],
[
"
115.358538
"
,
"
39.278818
"
,
"
500
"
],
[
"
115.348538
"
,
"
39.275818
"
,
"
500
"
],
[
"
115.351538
"
,
"
39.273318
"
,
"
500
"
],
[
"
115.357833
"
,
"
39.275448
"
,
"
500
"
],
[
"
115.358833
"
,
"
39.276448
"
,
"
500
"
],
[
"
115.358638
"
,
"
39.272818
"
,
"
500
"
],
[
"
115.368738
"
,
"
39.272818
"
,
"
500
"
],
[
"
115.368638
"
,
"
39.278518
"
,
"
500
"
],
[
"
115.358538
"
,
"
39.278818
"
,
"
500
"
],
[
"
115.348538
"
,
"
39.275818
"
,
"
500
"
],
[
"
115.351538
"
,
"
39.273318
"
,
"
500
"
],
[
"
115.357833
"
,
"
39.275448
"
,
"
500
"
],
],
zuobianData
:[],
toJavaCoordinates
:[],
weilanName
:[],
}
},
props
:
{
// 初始化配置参数
url
:
String
,
// 地图唯一性标识
mapKey
:
{
type
:
String
,
default
:
''
},
// 自定义参数
options
:
Object
,
// 是否分屏显示
compare
:
{
type
:
Boolean
,
default
:
false
},
// 是否插入到body元素上
appendToBody
:
{
type
:
Boolean
,
default
:
false
},
// 自定义css类名
customClass
:
{
type
:
String
,
default
:
''
}
},
destroy
()
{
this
[
`map
${
this
.
mapKey
}
`
].
destroy
()
delete
this
[
`map
${
this
.
mapKey
}
`
]
},
methods
:
{
//后台获取数据
getCoordinate
()
{
let
that
=
this
;
// HttpReq.truckDispatching.screenMapSetUpQuery({size:9999}).then((res) => {
// if(true){;
// //console.log(res);
// let data1 = [];
// for(let key in res){
// that.weilanName.push(key);
// let arrays = [];
// res[key].forEach(function(item){
// var arr = [];
// arr[0] = item.lon;
// arr[1] = item.lat;
// arr[2] = "500";
// arrays.push(arr);
// })
// data1.push(arrays)
// }
// that.zuobianData = data1
//console.log("zuobianData",that.zuobianData);
//console.log("weilanName",that.weilanName);
if
(
this
.
appendToBody
)
{
document
.
body
.
appendChild
(
this
.
$el
)
}
if
(
this
.
mapKey
)
{
this
.
initMars3d
(
this
.
options
)
}
else
{
mars3d
.
Resource
.
fetchJson
({
url
:
this
.
url
}).
then
((
data
)
=>
{
this
.
initMars3d
(
data
.
map3d
)
// 构建地图
})
}
// }
// })
},
//上传围栏数据
uploaded
(){
let
newData
=
[...
this
.
toJavaCoordinates
];
newData
.
pop
();
if
(
this
.
toJavaCoordinates
.
length
==
0
){
this
.
$message
({
type
:
'
warning
'
,
message
:
'
请绘制电子围栏
'
});
}
else
{
this
.
$prompt
(
'
电子围栏名称不得为空且不能与之前围栏名称重复
'
,
'
请输入电子围栏名称
'
,
{
confirmButtonText
:
'
确定
'
,
cancelButtonText
:
'
取消
'
,
inputErrorMessage
:
'
输入不能为空
'
,
inputValidator
:
(
value
)
=>
{
// 点击按钮时,对文本框里面的值进行验证
if
(
!
value
)
{
return
'
输入不能为空
'
;
}
},
}).
then
(({
value
})
=>
{
let
allObj
=
{};
allObj
.
name
=
value
;
allObj
.
zuobiao
=
newData
;
this
.
toJavaCoordinates
=
[];
console
.
log
(
allObj
);
//发送添加电子围栏请求
HttpReq
.
truckDispatching
.
screenMapSetUpAdd
(
allObj
).
then
((
res
)
=>
{
if
(
res
.
code
==
200
){
this
.
$notify
({
title
:
'
上传电子围栏成功!
'
,
type
:
'
success
'
,
duration
:
2500
});
}
else
{
this
.
$notify
({
title
:
res
.
msg
,
type
:
'
error
'
,
duration
:
2500
})
}
}).
catch
(
function
(
error
)
{
});
}).
catch
(()
=>
{
this
.
$message
({
type
:
'
info
'
,
message
:
'
取消输入
'
});
});
}
},
//创建地图
initMars3d
(
options
)
{
let
that
=
this
;
if
(
this
[
`map
${
this
.
mapKey
}
`
])
return
const
mapOptions
=
{
...
options
,
...
this
.
options
,
control
:
{
defaultContextMenu
:
false
,
//右键菜单
},
}
// 创建三维地球场景
map
=
new
mars3d
.
Map
(
`mars3d-container
${
this
.
mapKey
}
`
,
mapOptions
)
this
[
`map
${
this
.
mapKey
}
`
]
=
map
//围栏回显
that
.
zuobianData
.
forEach
(
function
(
item
,
index
){
var
graphicLayer
=
new
mars3d
.
layer
.
GraphicLayer
();
map
.
addLayer
(
graphicLayer
);
initLayerManager
(
graphicLayer
,
that
.
weilanName
[
index
]);
that
.
addGraphic_01
(
graphicLayer
,
item
,
that
.
weilanName
[
index
]);
})
//创建矢量数据图层2
var
graphicLayer1
=
new
mars3d
.
layer
.
GraphicLayer
();
map
.
addLayer
(
graphicLayer1
);
var
item
=
`<table style="width: auto;">
<tr>
<th scope="col" colspan="2" style="text-align:center;font-size:15px;">卡车号码:鲁K12345</th>
</tr>
<tr>
<td>名称:卡车一</td>
</tr>
</table>`
;
initGraphicManager
(
graphicLayer1
,
item
);
this
.
addGraphic_02
(
graphicLayer1
,
this
.
persons
);
// 抛出事件
this
.
$emit
(
'
onload
'
,
map
)
},
//围栏设置
btnStartDraw
(){
this
.
toJavaCoordinates
=
[];
let
that
=
this
;
var
graphicLayer3
=
new
mars3d
.
layer
.
GraphicLayer
();
graphicLayer3
.
on
(
mars3d
.
EventType
.
click
,
function
(
event
)
{
var
mpt
=
mars3d
.
LatLngPoint
.
fromCartesian
(
event
.
cartesian
);
that
.
toJavaCoordinates
.
push
(
mpt
.
toString
().
split
(
'
,
'
));
console
.
log
(
that
.
toJavaCoordinates
);
});
map
.
addLayer
(
graphicLayer3
);
initLayerManager
(
graphicLayer3
);
graphicLayer3
.
startDraw
({
type
:
"
polyline
"
,
style
:
{
color
:
"
red
"
,
width
:
5
,
clampToGround
:
false
,
label
:
{
text
:
"
围栏区域
"
,
font_size
:
18
,
color
:
"
#ffffff
"
,
distanceDisplayCondition
:
true
,
distanceDisplayCondition_far
:
500000
,
distanceDisplayCondition_near
:
0
,
},
},
});
},
//围栏回显
addGraphic_01
(
graphicLayer
,
positions
,
weilanName
){
let
graphic
=
new
mars3d
.
graphic
.
PolygonEntity
({
positions
:
positions
,
style
:
{
color
:
"
red
"
,
opacity
:
0.5
,
outline
:
true
,
outlineWidth
:
3
,
outlineColor
:
"
#ffffff
"
,
label
:
{
text
:
weilanName
,
font_size
:
18
,
color
:
"
#ffffff
"
,
distanceDisplayCondition
:
true
,
distanceDisplayCondition_far
:
500000
,
distanceDisplayCondition_near
:
0
,
},
},
});
graphicLayer
.
addGraphic
(
graphic
);
//还可以另外一种写法: graphic.addTo(graphicLayer)
},
//车辆轨迹
addGraphic_02
(
graphicLayer1
,
positions
)
{
var
property
=
new
Cesium
.
SampledPositionProperty
();
var
tempTime
;
//起点
tempTime
=
map
.
clock
.
currentTime
;
//开始时间
property
.
addSample
(
tempTime
,
Cesium
.
Cartesian3
.
fromDegrees
(
positions
[
0
][
0
],
positions
[
0
][
1
],
positions
[
0
][
2
]));
for
(
let
i
=
1
;
i
<
positions
.
length
;
i
++
){
tempTime
=
Cesium
.
JulianDate
.
addSeconds
(
tempTime
,
120
,
new
Cesium
.
JulianDate
());
property
.
addSample
(
tempTime
,
Cesium
.
Cartesian3
.
fromDegrees
(
positions
[
i
][
0
],
positions
[
i
][
1
],
positions
[
i
][
2
],));
}
var
graphic
=
new
mars3d
.
graphic
.
PathEntity
({
position
:
property
,
style
:
{
width
:
3
,
color
:
"
#8a2e3b
"
,
opacity
:
1.0
,
leadTime
:
0
,
// 前方的路线不显示
//高亮时的样式(默认为鼠标移入,也可以指定type:'click'单击高亮),构造后也可以openHighlight、closeHighlight方法来手动调用
highlight
:
{
type
:
mars3d
.
EventType
.
click
,
color
:
"
#ff0000
"
,
},
},
label
:
{
text
:
"
卡车一
"
,
font_size
:
19
,
font_family
:
"
楷体
"
,
color
:
Cesium
.
Color
.
AZURE
,
outline
:
true
,
outlineColor
:
Cesium
.
Color
.
BLACK
,
outlineWidth
:
2
,
horizontalOrigin
:
Cesium
.
HorizontalOrigin
.
CENTER
,
verticalOrigin
:
Cesium
.
VerticalOrigin
.
BOTTOM
,
pixelOffset
:
new
Cesium
.
Cartesian2
(
10
,
-
25
),
//偏移量
},
model
:
{
url
:
"
//data.mars3d.cn/gltf/mars/car/tufangche.glb
"
,
scale
:
0.1
,
minimumPixelSize
:
50
,
},
});
graphicLayer1
.
addGraphic
(
graphic
);
//还可以另外一种写法: graphic.addTo(graphicLayer)
},
getSampledPositionProperty
(
points
){
let
property
=
new
Cesium
.
SampledPositionProperty
();
let
start
=
this
.
map
.
clock
.
currentTime
;
let
positions
=
mars3d
.
LatLngArray
.
toCartesians
(
points
);
for
(
let
i
=
0
;
i
<
positions
.
length
;
i
++
)
{
let
time
=
Cesium
.
JulianDate
.
addSeconds
(
start
,
i
*
20
,
new
Cesium
.
JulianDate
());
let
position
=
positions
[
i
];
property
.
addSample
(
time
,
position
);
}
return
property
;
},
}
}
</
script
>
<!-- Add "scoped" attribute to limit CSS to this component only -->
<
style
>
.cesium-viewer-toolbar
{
display
:
none
!important
;
}
.mars3d-compass
{
display
:
none
!important
;
}
.mars3d-locationbar
{
display
:
none
!important
;
}
.mars3d-distance-legend
{
display
:
none
!important
;
}
.mars3d-container
{
height
:
100%
;
width
:
100vw
;
overflow
:
hidden
;
}
/* 重写Cesium的css */
/**cesium按钮背景色*/
.cesium-button
{
background-color
:
#3f4854
;
color
:
#e6e6e6
;
fill
:
#e6e6e6
;
box-shadow
:
0
1px
4px
rgba
(
0
,
0
,
0
,
0.3
);
line-height
:
32px
;
}
.cesium-viewer-geocoderContainer
.cesium-geocoder-input
{
background-color
:
rgba
(
63
,
72
,
84
,
0.7
);
}
.cesium-viewer-geocoderContainer
.cesium-geocoder-input
:focus
{
background-color
:
rgba
(
63
,
72
,
84
,
0.9
);
}
.cesium-viewer-geocoderContainer
.search-results
{
background-color
:
#3f4854
;
}
.cesium-geocoder-searchButton
{
background-color
:
#3f4854
;
}
.cesium-infoBox-title
{
background-color
:
#3f4854
;
}
.cesium-infoBox
{
background
:
rgba
(
63
,
72
,
84
,
0.9
);
}
.cesium-toolbar-button
img
{
height
:
100%
;
}
.cesium-performanceDisplay-defaultContainer
{
top
:
auto
;
bottom
:
35px
;
right
:
50px
;
}
.cesium-performanceDisplay-ms
,
.cesium-performanceDisplay-fps
{
color
:
#fff
;
}
/**cesium工具栏位置*/
.cesium-viewer-toolbar
{
top
:
auto
;
left
:
auto
;
right
:
12px
;
bottom
:
35px
;
}
.cesium-viewer-toolbar
>
.cesium-toolbar-button
,
.cesium-navigationHelpButton-wrapper
,
.cesium-viewer-geocoderContainer
{
margin-bottom
:
5px
;
float
:
right
;
clear
:
both
;
text-align
:
center
;
}
.cesium-baseLayerPicker-dropDown
{
bottom
:
0
;
right
:
40px
;
max-height
:
700px
;
margin-bottom
:
5px
;
}
.cesium-navigation-help
{
top
:
auto
;
bottom
:
0
;
right
:
40px
;
transform-origin
:
right
bottom
;
}
.cesium-sceneModePicker-wrapper
{
width
:
auto
;
}
.cesium-sceneModePicker-wrapper
.cesium-sceneModePicker-dropDown-icon
{
float
:
left
;
margin
:
0
3px
;
}
.cesium-viewer-geocoderContainer
.search-results
{
left
:
0
;
right
:
40px
;
width
:
auto
;
position
:
absolute
;
z-index
:
999
;
}
.cesium-infoBox-title
{
background-color
:
#3f4854
;
}
.cesium-infoBox
{
top
:
50px
;
background
:
rgba
(
63
,
72
,
84
,
0.9
);
}
/**左下工具栏菜单*/
.toolbar-dropdown-menu-div
{
background
:
rgba
(
43
,
44
,
47
,
0.8
);
border
:
1px
solid
#2b2c2f
;
z-index
:
999
;
position
:
absolute
;
right
:
60px
;
bottom
:
40px
;
display
:
none
;
}
.toolbar-dropdown-menu
{
min-width
:
110px
;
padding
:
0
;
}
.toolbar-dropdown-menu
>
li
{
padding
:
0
3px
;
margin
:
2px
0
;
}
.toolbar-dropdown-menu
>
li
>
a
{
color
:
#edffff
;
display
:
block
;
padding
:
4px
10px
;
clear
:
both
;
font-weight
:
normal
;
line-height
:
1.6
;
white-space
:
nowrap
;
text-decoration
:
none
;
}
.toolbar-dropdown-menu
>
li
>
a
:hover
,
.dropdown-menu
>
li
>
a
:focus
{
color
:
#fff
;
background-color
:
#444d59
;
}
.toolbar-dropdown-menu
>
.active
>
a
,
.dropdown-menu
>
.active
>
a
:hover
,
.dropdown-menu
>
.active
>
a
:focus
{
color
:
#fff
;
background-color
:
#444d59
;
}
.toolbar-dropdown-menu
i
{
padding-right
:
5px
;
}
.infoview
{
position
:
absolute
;
top
:
100px
;
left
:
500px
;
width
:
50vw
;
z-index
:
1000
;
}
</
style
>
src/components/mars3d/Map3.vue
0 → 100644
View file @
2128f067
<
template
>
<div
style=
"wight:100%;height:100%;position: relative;"
>
<div
:id=
"`mars3d-container$
{mapKey}`"
:class="['mars3d-container', customClass, { 'mars3d-container-compare-rh' : compare }]">
</div>
<div
class=
"infoview"
>
<el-button
type=
"primary"
@
click=
"btnStartDraw()"
>
设置围栏
</el-button>
<el-button
type=
"primary"
@
click=
"uploaded()"
>
上传围栏
</el-button>
<div
style=
"display: inline-block;color:red;font-weight:bolder;"
>
每次只允许上传一个围栏,并且围栏必须是封闭图形
</div>
</div>
</div>
</
template
>
<
script
>
import
Vue
from
'
vue
'
import
{
Tools
,
HttpReq
,
CAMap
}
from
'
@/assets/js/common.js
'
;
// 使用免费开源版本
import
'
mars3d/dist/mars3d.css
'
import
*
as
mars3d
from
'
mars3d
'
import
*
as
Cesium
from
'
mars3d-cesium/Build/Cesium/Cesium
'
import
{
initGraphicManager
,
initLayerManager
,
bindLayerContextMenu
}
from
'
./js/graphicManager
'
// 导入插件(其他插件类似,插件清单访问:http://mars3d.cn/dev/guide/start/install.html)
// echarts插件
// import 'mars3d-echarts'
// 为了方便使用,绑定到原型链,在其他vue文件,直接 this.mars3d 来使用
Vue
.
prototype
.
mars3d
=
mars3d
Vue
.
prototype
.
Cesium
=
mars3d
.
Cesium
var
map
;
export
default
{
name
:
'
mars3dViewer
'
,
created
(){
this
.
getCoordinate
();
},
data
(){
return
{
persons
:[
[
"
115.358833
"
,
"
39.276448
"
,
"
500
"
],
[
"
115.358638
"
,
"
39.272818
"
,
"
500
"
],
[
"
115.368738
"
,
"
39.272818
"
,
"
500
"
],
[
"
115.368638
"
,
"
39.278518
"
,
"
500
"
],
[
"
115.358538
"
,
"
39.278818
"
,
"
500
"
],
[
"
115.348538
"
,
"
39.275818
"
,
"
500
"
],
[
"
115.351538
"
,
"
39.273318
"
,
"
500
"
],
[
"
115.357833
"
,
"
39.275448
"
,
"
500
"
],
[
"
115.358833
"
,
"
39.276448
"
,
"
500
"
],
[
"
115.358638
"
,
"
39.272818
"
,
"
500
"
],
[
"
115.368738
"
,
"
39.272818
"
,
"
500
"
],
[
"
115.368638
"
,
"
39.278518
"
,
"
500
"
],
[
"
115.358538
"
,
"
39.278818
"
,
"
500
"
],
[
"
115.348538
"
,
"
39.275818
"
,
"
500
"
],
[
"
115.351538
"
,
"
39.273318
"
,
"
500
"
],
[
"
115.357833
"
,
"
39.275448
"
,
"
500
"
],
[
"
115.358833
"
,
"
39.276448
"
,
"
500
"
],
[
"
115.358638
"
,
"
39.272818
"
,
"
500
"
],
[
"
115.368738
"
,
"
39.272818
"
,
"
500
"
],
[
"
115.368638
"
,
"
39.278518
"
,
"
500
"
],
[
"
115.358538
"
,
"
39.278818
"
,
"
500
"
],
[
"
115.348538
"
,
"
39.275818
"
,
"
500
"
],
[
"
115.351538
"
,
"
39.273318
"
,
"
500
"
],
[
"
115.357833
"
,
"
39.275448
"
,
"
500
"
],
[
"
115.358833
"
,
"
39.276448
"
,
"
500
"
],
[
"
115.358638
"
,
"
39.272818
"
,
"
500
"
],
[
"
115.368738
"
,
"
39.272818
"
,
"
500
"
],
[
"
115.368638
"
,
"
39.278518
"
,
"
500
"
],
[
"
115.358538
"
,
"
39.278818
"
,
"
500
"
],
[
"
115.348538
"
,
"
39.275818
"
,
"
500
"
],
[
"
115.351538
"
,
"
39.273318
"
,
"
500
"
],
[
"
115.357833
"
,
"
39.275448
"
,
"
500
"
],
[
"
115.358833
"
,
"
39.276448
"
,
"
500
"
],
[
"
115.358638
"
,
"
39.272818
"
,
"
500
"
],
[
"
115.368738
"
,
"
39.272818
"
,
"
500
"
],
[
"
115.368638
"
,
"
39.278518
"
,
"
500
"
],
[
"
115.358538
"
,
"
39.278818
"
,
"
500
"
],
[
"
115.348538
"
,
"
39.275818
"
,
"
500
"
],
[
"
115.351538
"
,
"
39.273318
"
,
"
500
"
],
[
"
115.357833
"
,
"
39.275448
"
,
"
500
"
],
],
zuobianData
:[],
toJavaCoordinates
:[],
weilanName
:[],
}
},
props
:
{
// 初始化配置参数
url
:
String
,
// 地图唯一性标识
mapKey
:
{
type
:
String
,
default
:
''
},
// 自定义参数
options
:
Object
,
// 是否分屏显示
compare
:
{
type
:
Boolean
,
default
:
false
},
// 是否插入到body元素上
appendToBody
:
{
type
:
Boolean
,
default
:
false
},
// 自定义css类名
customClass
:
{
type
:
String
,
default
:
''
}
},
destroy
()
{
this
[
`map
${
this
.
mapKey
}
`
].
destroy
()
delete
this
[
`map
${
this
.
mapKey
}
`
]
},
methods
:
{
//后台获取数据
getCoordinate
()
{
let
that
=
this
;
// HttpReq.truckDispatching.screenMapSetUpQuery({size:9999}).then((res) => {
// if(true){;
// //console.log(res);
// let data1 = [];
// for(let key in res){
// that.weilanName.push(key);
// let arrays = [];
// res[key].forEach(function(item){
// var arr = [];
// arr[0] = item.lon;
// arr[1] = item.lat;
// arr[2] = "500";
// arrays.push(arr);
// })
// data1.push(arrays)
// }
// that.zuobianData = data1
//console.log("zuobianData",that.zuobianData);
//console.log("weilanName",that.weilanName);
if
(
this
.
appendToBody
)
{
document
.
body
.
appendChild
(
this
.
$el
)
}
if
(
this
.
mapKey
)
{
this
.
initMars3d
(
this
.
options
)
}
else
{
mars3d
.
Resource
.
fetchJson
({
url
:
this
.
url
}).
then
((
data
)
=>
{
this
.
initMars3d
(
data
.
map3d
)
// 构建地图
})
}
// }
// })
},
//上传围栏数据
uploaded
(){
let
newData
=
[...
this
.
toJavaCoordinates
];
newData
.
pop
();
if
(
this
.
toJavaCoordinates
.
length
==
0
){
this
.
$message
({
type
:
'
warning
'
,
message
:
'
请绘制电子围栏
'
});
}
else
{
this
.
$prompt
(
'
电子围栏名称不得为空且不能与之前围栏名称重复
'
,
'
请输入电子围栏名称
'
,
{
confirmButtonText
:
'
确定
'
,
cancelButtonText
:
'
取消
'
,
inputErrorMessage
:
'
输入不能为空
'
,
inputValidator
:
(
value
)
=>
{
// 点击按钮时,对文本框里面的值进行验证
if
(
!
value
)
{
return
'
输入不能为空
'
;
}
},
}).
then
(({
value
})
=>
{
let
allObj
=
{};
allObj
.
name
=
value
;
allObj
.
zuobiao
=
newData
;
this
.
toJavaCoordinates
=
[];
console
.
log
(
allObj
);
//发送添加电子围栏请求
HttpReq
.
truckDispatching
.
screenMapSetUpAdd
(
allObj
).
then
((
res
)
=>
{
if
(
res
.
code
==
200
){
this
.
$notify
({
title
:
'
上传电子围栏成功!
'
,
type
:
'
success
'
,
duration
:
2500
});
}
else
{
this
.
$notify
({
title
:
res
.
msg
,
type
:
'
error
'
,
duration
:
2500
})
}
}).
catch
(
function
(
error
)
{
});
}).
catch
(()
=>
{
this
.
$message
({
type
:
'
info
'
,
message
:
'
取消输入
'
});
});
}
},
//创建地图
initMars3d
(
options
)
{
let
that
=
this
;
if
(
this
[
`map
${
this
.
mapKey
}
`
])
return
const
mapOptions
=
{
...
options
,
...
this
.
options
,
control
:
{
defaultContextMenu
:
false
,
//右键菜单
},
}
// 创建三维地球场景
map
=
new
mars3d
.
Map
(
`mars3d-container
${
this
.
mapKey
}
`
,
mapOptions
)
this
[
`map
${
this
.
mapKey
}
`
]
=
map
//围栏回显
that
.
zuobianData
.
forEach
(
function
(
item
,
index
){
var
graphicLayer
=
new
mars3d
.
layer
.
GraphicLayer
();
map
.
addLayer
(
graphicLayer
);
initLayerManager
(
graphicLayer
,
that
.
weilanName
[
index
]);
that
.
addGraphic_01
(
graphicLayer
,
item
,
that
.
weilanName
[
index
]);
})
//创建矢量数据图层2
var
graphicLayer1
=
new
mars3d
.
layer
.
GraphicLayer
();
map
.
addLayer
(
graphicLayer1
);
var
item
=
`<table style="width: auto;">
<tr>
<th scope="col" colspan="2" style="text-align:center;font-size:15px;">卡车号码:鲁K12345</th>
</tr>
<tr>
<td>名称:卡车一</td>
</tr>
</table>`
;
initGraphicManager
(
graphicLayer1
,
item
);
//this.addGraphic_02(graphicLayer1,this.persons);
// 抛出事件
this
.
$emit
(
'
onload
'
,
map
)
},
//围栏设置
btnStartDraw
(){
this
.
toJavaCoordinates
=
[];
let
that
=
this
;
var
graphicLayer3
=
new
mars3d
.
layer
.
GraphicLayer
();
graphicLayer3
.
on
(
mars3d
.
EventType
.
click
,
function
(
event
)
{
var
mpt
=
mars3d
.
LatLngPoint
.
fromCartesian
(
event
.
cartesian
);
that
.
toJavaCoordinates
.
push
(
mpt
.
toString
().
split
(
'
,
'
));
console
.
log
(
that
.
toJavaCoordinates
);
});
map
.
addLayer
(
graphicLayer3
);
initLayerManager
(
graphicLayer3
);
graphicLayer3
.
startDraw
({
type
:
"
polyline
"
,
style
:
{
color
:
"
red
"
,
width
:
5
,
clampToGround
:
false
,
label
:
{
text
:
"
围栏区域
"
,
font_size
:
18
,
color
:
"
#ffffff
"
,
distanceDisplayCondition
:
true
,
distanceDisplayCondition_far
:
500000
,
distanceDisplayCondition_near
:
0
,
},
},
});
},
//围栏回显
addGraphic_01
(
graphicLayer
,
positions
,
weilanName
){
let
graphic
=
new
mars3d
.
graphic
.
PolygonEntity
({
positions
:
positions
,
style
:
{
color
:
"
red
"
,
opacity
:
0.5
,
outline
:
true
,
outlineWidth
:
3
,
outlineColor
:
"
#ffffff
"
,
label
:
{
text
:
weilanName
,
font_size
:
18
,
color
:
"
#ffffff
"
,
distanceDisplayCondition
:
true
,
distanceDisplayCondition_far
:
500000
,
distanceDisplayCondition_near
:
0
,
},
},
});
graphicLayer
.
addGraphic
(
graphic
);
//还可以另外一种写法: graphic.addTo(graphicLayer)
},
//车辆轨迹
addGraphic_02
(
graphicLayer1
,
positions
)
{
var
property
=
new
Cesium
.
SampledPositionProperty
();
var
tempTime
;
//起点
tempTime
=
map
.
clock
.
currentTime
;
//开始时间
property
.
addSample
(
tempTime
,
Cesium
.
Cartesian3
.
fromDegrees
(
positions
[
0
][
0
],
positions
[
0
][
1
],
positions
[
0
][
2
]));
for
(
let
i
=
1
;
i
<
positions
.
length
;
i
++
){
tempTime
=
Cesium
.
JulianDate
.
addSeconds
(
tempTime
,
120
,
new
Cesium
.
JulianDate
());
property
.
addSample
(
tempTime
,
Cesium
.
Cartesian3
.
fromDegrees
(
positions
[
i
][
0
],
positions
[
i
][
1
],
positions
[
i
][
2
],));
}
var
graphic
=
new
mars3d
.
graphic
.
PathEntity
({
position
:
property
,
style
:
{
width
:
3
,
color
:
"
#8a2e3b
"
,
opacity
:
1.0
,
leadTime
:
0
,
// 前方的路线不显示
//高亮时的样式(默认为鼠标移入,也可以指定type:'click'单击高亮),构造后也可以openHighlight、closeHighlight方法来手动调用
highlight
:
{
type
:
mars3d
.
EventType
.
click
,
color
:
"
#ff0000
"
,
},
},
label
:
{
text
:
"
卡车一
"
,
font_size
:
19
,
font_family
:
"
楷体
"
,
color
:
Cesium
.
Color
.
AZURE
,
outline
:
true
,
outlineColor
:
Cesium
.
Color
.
BLACK
,
outlineWidth
:
2
,
horizontalOrigin
:
Cesium
.
HorizontalOrigin
.
CENTER
,
verticalOrigin
:
Cesium
.
VerticalOrigin
.
BOTTOM
,
pixelOffset
:
new
Cesium
.
Cartesian2
(
10
,
-
25
),
//偏移量
},
model
:
{
url
:
"
//data.mars3d.cn/gltf/mars/car/tufangche.glb
"
,
scale
:
0.1
,
minimumPixelSize
:
50
,
},
});
graphicLayer1
.
addGraphic
(
graphic
);
//还可以另外一种写法: graphic.addTo(graphicLayer)
},
getSampledPositionProperty
(
points
){
let
property
=
new
Cesium
.
SampledPositionProperty
();
let
start
=
this
.
map
.
clock
.
currentTime
;
let
positions
=
mars3d
.
LatLngArray
.
toCartesians
(
points
);
for
(
let
i
=
0
;
i
<
positions
.
length
;
i
++
)
{
let
time
=
Cesium
.
JulianDate
.
addSeconds
(
start
,
i
*
20
,
new
Cesium
.
JulianDate
());
let
position
=
positions
[
i
];
property
.
addSample
(
time
,
position
);
}
return
property
;
},
}
}
</
script
>
<!-- Add "scoped" attribute to limit CSS to this component only -->
<
style
>
.cesium-viewer-toolbar
{
display
:
none
!important
;
}
.mars3d-compass
{
display
:
none
!important
;
}
.mars3d-locationbar
{
display
:
none
!important
;
}
.mars3d-distance-legend
{
display
:
none
!important
;
}
.mars3d-container
{
height
:
100%
;
width
:
100vw
;
overflow
:
hidden
;
}
/* 重写Cesium的css */
/**cesium按钮背景色*/
.cesium-button
{
background-color
:
#3f4854
;
color
:
#e6e6e6
;
fill
:
#e6e6e6
;
box-shadow
:
0
1px
4px
rgba
(
0
,
0
,
0
,
0.3
);
line-height
:
32px
;
}
.cesium-viewer-geocoderContainer
.cesium-geocoder-input
{
background-color
:
rgba
(
63
,
72
,
84
,
0.7
);
}
.cesium-viewer-geocoderContainer
.cesium-geocoder-input
:focus
{
background-color
:
rgba
(
63
,
72
,
84
,
0.9
);
}
.cesium-viewer-geocoderContainer
.search-results
{
background-color
:
#3f4854
;
}
.cesium-geocoder-searchButton
{
background-color
:
#3f4854
;
}
.cesium-infoBox-title
{
background-color
:
#3f4854
;
}
.cesium-infoBox
{
background
:
rgba
(
63
,
72
,
84
,
0.9
);
}
.cesium-toolbar-button
img
{
height
:
100%
;
}
.cesium-performanceDisplay-defaultContainer
{
top
:
auto
;
bottom
:
35px
;
right
:
50px
;
}
.cesium-performanceDisplay-ms
,
.cesium-performanceDisplay-fps
{
color
:
#fff
;
}
/**cesium工具栏位置*/
.cesium-viewer-toolbar
{
top
:
auto
;
left
:
auto
;
right
:
12px
;
bottom
:
35px
;
}
.cesium-viewer-toolbar
>
.cesium-toolbar-button
,
.cesium-navigationHelpButton-wrapper
,
.cesium-viewer-geocoderContainer
{
margin-bottom
:
5px
;
float
:
right
;
clear
:
both
;
text-align
:
center
;
}
.cesium-baseLayerPicker-dropDown
{
bottom
:
0
;
right
:
40px
;
max-height
:
700px
;
margin-bottom
:
5px
;
}
.cesium-navigation-help
{
top
:
auto
;
bottom
:
0
;
right
:
40px
;
transform-origin
:
right
bottom
;
}
.cesium-sceneModePicker-wrapper
{
width
:
auto
;
}
.cesium-sceneModePicker-wrapper
.cesium-sceneModePicker-dropDown-icon
{
float
:
left
;
margin
:
0
3px
;
}
.cesium-viewer-geocoderContainer
.search-results
{
left
:
0
;
right
:
40px
;
width
:
auto
;
position
:
absolute
;
z-index
:
999
;
}
.cesium-infoBox-title
{
background-color
:
#3f4854
;
}
.cesium-infoBox
{
top
:
50px
;
background
:
rgba
(
63
,
72
,
84
,
0.9
);
}
/**左下工具栏菜单*/
.toolbar-dropdown-menu-div
{
background
:
rgba
(
43
,
44
,
47
,
0.8
);
border
:
1px
solid
#2b2c2f
;
z-index
:
999
;
position
:
absolute
;
right
:
60px
;
bottom
:
40px
;
display
:
none
;
}
.toolbar-dropdown-menu
{
min-width
:
110px
;
padding
:
0
;
}
.toolbar-dropdown-menu
>
li
{
padding
:
0
3px
;
margin
:
2px
0
;
}
.toolbar-dropdown-menu
>
li
>
a
{
color
:
#edffff
;
display
:
block
;
padding
:
4px
10px
;
clear
:
both
;
font-weight
:
normal
;
line-height
:
1.6
;
white-space
:
nowrap
;
text-decoration
:
none
;
}
.toolbar-dropdown-menu
>
li
>
a
:hover
,
.dropdown-menu
>
li
>
a
:focus
{
color
:
#fff
;
background-color
:
#444d59
;
}
.toolbar-dropdown-menu
>
.active
>
a
,
.dropdown-menu
>
.active
>
a
:hover
,
.dropdown-menu
>
.active
>
a
:focus
{
color
:
#fff
;
background-color
:
#444d59
;
}
.toolbar-dropdown-menu
i
{
padding-right
:
5px
;
}
.infoview
{
position
:
absolute
;
top
:
10px
;
left
:
10px
;
width
:
50vw
;
z-index
:
1000
;
}
</
style
>
src/views/carManagement/carTrajectory/index.vue
View file @
2128f067
...
...
@@ -55,8 +55,8 @@
<el-button
type=
"primary"
plain
style=
"font-size:15px;"
>
显示所有轨迹
</el-button>
</el-form>
<div
class=
"playbackView
"
>
<
img
src=
"../../../assets/images/cutGraph/examplePic12.png"
>
<div
id=
"centerDiv"
class=
"mapcontainer
"
>
<
mars3dViewerMap
:url=
"configUrl"
@
onload=
"onMapload"
/
>
</div>
</div>
</div>
...
...
@@ -67,11 +67,18 @@
<
script
>
import
{
Tools
,
HttpReq
,
Dates
}
from
'
@/assets/js/common.js
'
;
import
mars3dViewerMap
from
'
../../../components/mars3d/Map2.vue
'
//地图
export
default
{
name
:
'
CarTrajectory
'
,
components
:
{
mars3dViewerMap
,
},
data
()
{
const
basePathUrl
=
window
.
basePathUrl
||
''
return
{
//地图图片
configUrl
:
basePathUrl
+
'
config/config.json
'
,
query
:{
startTime
:
''
,
endTime
:
''
,
...
...
@@ -114,6 +121,42 @@ export default {
})
},
// 地图构造完成回调
onMapload
(
map
)
{
// 以下为演示代码
// 创建entity图层
const
graphicLayer
=
new
this
.
mars3d
.
layer
.
GraphicLayer
()
map
.
addLayer
(
graphicLayer
)
// 2.在layer上绑定监听事件
graphicLayer
.
on
(
this
.
mars3d
.
EventType
.
click
,
function
(
event
)
{
console
.
log
(
'
监听layer,单击了矢量对象
'
,
event
)
})
graphicLayer
.
on
(
this
.
mars3d
.
EventType
.
mouseOver
,
function
(
event
)
{
console
.
log
(
'
监听layer,鼠标移入了矢量对象
'
,
event
)
})
graphicLayer
.
on
(
this
.
mars3d
.
EventType
.
mouseOut
,
function
(
event
)
{
console
.
log
(
'
监听layer,鼠标移出了矢量对象
'
,
event
)
})
// 可在图层上绑定popup,对所有加到这个图层的矢量数据都生效
graphicLayer
.
bindPopup
(
'
我是layer上绑定的Popup
'
,
{
anchor
:
[
0
,
-
10
]
})
// 可在图层绑定右键菜单,对所有加到这个图层的矢量数据都生效
graphicLayer
.
bindContextMenu
([
{
text
:
'
删除对象
'
,
iconCls
:
'
fa fa-trash-o
'
,
callback
:
function
(
e
)
{
const
graphic
=
e
.
graphic
if
(
graphic
)
{
graphicLayer
.
removeGraphic
(
graphic
)
}
}
}
])
},
}
}
</
script
>
...
...
@@ -138,7 +181,7 @@ export default {
}
}
}
.
playbackView
{
.
mapcontainer
{
width
:
80vw
;
height
:
65
.5vh
;
overflow
:
hidden
;
...
...
src/views/regionalManagement/regionalInformation/index.vue
View file @
2128f067
...
...
@@ -15,7 +15,7 @@
<el-table-column
prop=
"code"
label=
"编码"
align=
"center"
></el-table-column>
<el-table-column
prop=
"name"
label=
"区域名称"
align=
"center"
></el-table-column>
<el-table-column
prop=
"areaclass"
label=
"所属类别"
align=
"center"
></el-table-column>
<
el-table-column
prop=
"coordinate"
label=
"中心坐标"
align=
"center"
></el-table-column
>
<
!--
<el-table-column
prop=
"coordinate"
label=
"中心坐标"
align=
"center"
></el-table-column>
--
>
<el-table-column
prop=
"card"
label=
"车辆标识图"
align=
"center"
>
<template
slot-scope=
"scope"
>
<img
:src=
"imgSrcStart + '/avatar/' + scope.row.card"
width=
"40"
height=
"40"
/>
...
...
@@ -40,7 +40,7 @@
</div>
<!-- 表单渲染 -->
<el-dialog
append-to-body
:close-on-click-modal=
"true"
:before-close=
"cancelForm"
:visible.sync=
"form.visible"
:title=
"form.title"
width=
"
7
00px"
>
<el-dialog
append-to-body
:close-on-click-modal=
"true"
:before-close=
"cancelForm"
:visible.sync=
"form.visible"
:title=
"form.title"
width=
"
8
00px"
>
<el-form
:model=
"form.item"
:rules=
"rules"
ref=
"form1"
:inline=
"true"
size=
"small"
label-width=
"150px"
>
<el-form-item
label=
"编码"
prop=
"code"
>
<el-input
v-model=
"form.item.code"
style=
"width:160px;"
placeholder=
"请输入编码"
/>
...
...
@@ -62,16 +62,16 @@
<el-form-item
label=
"最大承接车辆数"
prop=
"max"
>
<el-input
v-model=
"form.item.max"
style=
"width:160px;"
placeholder=
"请输入最大承接车辆数"
/>
</el-form-item>
<el-form-item
label=
"区域中心坐标点"
prop=
"coordinate"
>
<
!-- <
el-form-item label="区域中心坐标点" prop="coordinate">
<el-input v-model="form.item.coordinate" style="width:160px;" placeholder="请输入区域中心坐标点"/>
</el-form-item>
</el-form-item>
-->
<el-form-item
label=
"区域标记"
>
<el-input
v-model=
"picFileName"
style=
"width:160px;"
placeholder=
"请上传区域标记"
disabled
/>
<input
type=
"file"
name=
"image"
@
change=
"excelImport($event)"
/>
</el-form-item>
<el-form-item
label=
"区域范围或直径"
prop=
"arearange"
>
<
!-- <
el-form-item label="区域范围或直径" prop="arearange">
<el-input v-model="form.item.arearange" style="width:160px;" placeholder="请输入区域范围或直径"/>
</el-form-item>
</el-form-item>
-->
<el-form-item
label=
"电铲名称"
prop=
"areashovel"
>
<el-input
v-model=
"form.item.areashovel"
style=
"width:160px;"
placeholder=
"请输入电铲名称"
/>
</el-form-item>
...
...
@@ -90,6 +90,9 @@
<el-form-item
label=
"优先级"
prop=
"areapriority"
>
<el-input-number
v-model=
"form.item.areapriority"
:min=
"1"
:max=
"10"
label=
"请选择优先级"
></el-input-number>
</el-form-item>
<div
id=
"centerDiv"
class=
"mapcontainer"
>
<mars3dViewerMap
:url=
"configUrl"
@
onload=
"onMapload"
/>
</div>
<!-- 如果所属类型是电子围栏,要添加一下属性 -->
...
...
@@ -175,12 +178,18 @@
<
script
>
import
{
Tools
,
HttpReq
,
Dates
}
from
'
@/assets/js/common.js
'
;
import
Axios
from
'
axios
'
import
mars3dViewerMap
from
'
../../../components/mars3d/Map3.vue
'
//地图
export
default
{
name
:
'
CarType
'
,
components
:
{},
components
:
{
mars3dViewerMap
,
},
data
()
{
const
basePathUrl
=
window
.
basePathUrl
||
''
return
{
//地图图片
configUrl
:
basePathUrl
+
'
config/config.json
'
,
imgSrcStart
:
process
.
env
.
VUE_APP_LOCAL_API2
,
loading
:
false
,
page
:
1
,
...
...
@@ -606,6 +615,43 @@ export default {
})
},
// 地图构造完成回调
onMapload
(
map
)
{
// 以下为演示代码
// 创建entity图层
const
graphicLayer
=
new
this
.
mars3d
.
layer
.
GraphicLayer
()
map
.
addLayer
(
graphicLayer
)
// 2.在layer上绑定监听事件
graphicLayer
.
on
(
this
.
mars3d
.
EventType
.
click
,
function
(
event
)
{
console
.
log
(
'
监听layer,单击了矢量对象
'
,
event
)
})
graphicLayer
.
on
(
this
.
mars3d
.
EventType
.
mouseOver
,
function
(
event
)
{
console
.
log
(
'
监听layer,鼠标移入了矢量对象
'
,
event
)
})
graphicLayer
.
on
(
this
.
mars3d
.
EventType
.
mouseOut
,
function
(
event
)
{
console
.
log
(
'
监听layer,鼠标移出了矢量对象
'
,
event
)
})
// 可在图层上绑定popup,对所有加到这个图层的矢量数据都生效
graphicLayer
.
bindPopup
(
'
我是layer上绑定的Popup
'
,
{
anchor
:
[
0
,
-
10
]
})
// 可在图层绑定右键菜单,对所有加到这个图层的矢量数据都生效
graphicLayer
.
bindContextMenu
([
{
text
:
'
删除对象
'
,
iconCls
:
'
fa fa-trash-o
'
,
callback
:
function
(
e
)
{
const
graphic
=
e
.
graphic
if
(
graphic
)
{
graphicLayer
.
removeGraphic
(
graphic
)
}
}
}
])
},
}
}
</
script
>
...
...
@@ -634,6 +680,11 @@ export default {
}
}
.mapcontainer
{
height
:
50vh
;
width
:
750px
;
overflow
:
hidden
;
}
.checkboxViews
{
padding-left
:
10px
;
box-sizing
:
border-box
;
...
...
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
Attach a file
Cancel
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 comment