提交 39e60392 编写于 作者: KK's avatar KK

地图视图 --fix1

上级 2888f851
<template>
<div>暂不支持</div>
<div :id="mapId" class="map"></div>
</template>
\ No newline at end of file
......@@ -85,13 +85,13 @@ import 'echarts/map/js/china.js'
return;
}
if (Object.is(action, "load")) {
this.load(Object.assign(data);
this.load(Object.assign(data));
}
if (Object.is(action, "search")) {
this.load(Object.assign(data);
this.load(Object.assign(data));
}
if (Object.is(action, "quicksearch")) {
this.load(Object.assign({ query: data });
this.load(Object.assign({ query: data }));
}
if (Object.is(action, "refresh")) {
this.refresh();
......@@ -100,7 +100,7 @@ import 'echarts/map/js/china.js'
}
if(AppCenterService && AppCenterService.getMessageCenter()){
this.appStateEvent = AppCenterService.getMessageCenter().subscribe(({ name, action, data }) =>{
if(!Object.is(name,"${ctrl.getPSAppDataEntity().getCodeName()}")){
if(!Object.is(name,"MOBMAP")){
return;
}
if(Object.is(action,'appRefresh')){
......@@ -108,20 +108,6 @@ import 'echarts/map/js/china.js'
}
})
}
<#if view.getViewType()?? && view.getViewType()=='DEMOBPICKUPMDVIEW'>
if (!this.isMutli) {
if (this.selectedData && this.selectedData.length > 0) {
this.radio = this.selectedData[0].srfkey;
}
} else {
if (this.selectedData && this.selectedData.length > 0) {
this.checkboxList = [];
this.selectedData.forEach((item: any) => {
this.checkboxList.push(item.srfkey);
})
}
}
</#if>
}
/**
......@@ -166,6 +152,130 @@ import 'echarts/map/js/china.js'
})
})
}
/**
* map对象
*
* @type {}
* @memberof ${srfclassname('${ctrl.name}')}Base
*/
public map :any;
/**
* 图表div绑定的id
*
* @type {}
* @memberof ${srfclassname('${ctrl.name}')}Base
*/
public mapId:string = this.$util.createUUID();
/**
* 数据
*
* @type {}
* @memberof ${srfclassname('${ctrl.name}')}Base
*/
public dataList: any = []
public mapStyle = "${ctrl.getMapStyle()}"
public mapItems = [
<#if ctrl.getPSSysMapItems?? && ctrl.getPSSysMapItems()??>
<#list ctrl.getPSSysMapItems() as mapitem>
{
type:'${mapitem.getItemType()}',
bkcolor:'<#if mapitem.getBKColorPSAppDEField?? && mapitem.getBKColorPSAppDEField()??>${mapitem.getBKColorPSAppDEField().getCodeName()?lower_case}</#if>',
color:'<#if mapitem.getColorPSAppDEField?? && mapitem.getColorPSAppDEField()??>${mapitem.getColorPSAppDEField().getCodeName()?lower_case}</#if>',
content:'<#if mapitem.getContentPSDEField?? && mapitem.getContentPSDEField()??>${mapitem.getContentPSDEField().getCodeName()?lower_case}</#if>',
latitude:'<#if mapitem.getLatitudePSAppDEField?? && mapitem.getLatitudePSAppDEField()??>${mapitem.getLatitudePSAppDEField().getCodeName()?lower_case}</#if>',
longitude:'<#if mapitem.getLongitudePSAppDEField?? && mapitem.getLongitudePSAppDEField()??>${mapitem.getLongitudePSAppDEField().getCodeName()?lower_case}</#if>',
text:'<#if mapitem.getTextPSAppDEField?? && mapitem.getTextPSAppDEField()??>${mapitem.getTextPSAppDEField().getCodeName()?lower_case}</#if>',
tips:'<#if mapitem.getTipsPSAppDEField?? && mapitem.getTipsPSAppDEField()??>${mapitem.getTipsPSAppDEField().getCodeName()?lower_case}</#if>',
},
</#list>
</#if>
]
//点击弹出
public tooltip = {
formatter: (params: any, ticket: any, callback: any) => {
return params.seriesName + '<br />' + params.name + ':' + (params.value ? params.value : 0)
}
}
// 旁边的滑动栏
public visualMap = {
min: 0,
max: 10,
left: 'left',
top: 'bottom',
text: ['高', '低'],
inRange: {
color: ['#e0ffff', '#006edd']
},
show: true
}
//地图参数
public geo = {
map: 'china',
roam: false,
zoom: 1.23,
label: {
normal: {
show: true,
fontSize: '10',
// 字体颜色
color: '${ctrl.getColor()}',
}
},
itemStyle: {
normal: {
// 边框颜色
borderColor: '${ctrl.getBorderColor()}',
// 地图默认背景
areaColor: "${ctrl.getBKColor()}",
},
emphasis: {
// 点击背景颜色
areaColor: '#F3B329',
shadowOffsetX: 0,
shadowOffsetY: 0,
shadowBlur: 20,
borderWidth: 0,
shadowColor: 'rgba(0, 0, 0, 0.5)',
}
}
}
// 提示
public series = [
{
name: '${ctrl.getName()}',
type: 'map',
geoIndex: 0,
data: this.dataList
}
]
//option
public option: any = {};
/**
* mounted
*/
public mounted() {
Object.assign(this.option, { tooltip: this.tooltip }, { visualMap: this.visualMap }, { geo: this.geo }, { series: this.series })
let element: any = document.getElementById(this.mapId);
this.map = echarts.init(element);
}
// 绘制
public setOptions(){
if(!this.map){
return
}
this.map.setOption(this.option);
}
<#ibizinclude>
../@MACRO/CONTROL/CONTROL_BOTTOM-BASE.vue.ftl
</#ibizinclude>
......
......@@ -5,3 +5,7 @@
<#if appde??>
.${appde.getCodeName()?lower_case}-${ctrl.name}{}
</#if>
.map{
width: 100vw;
height: 80vh;
}
\ No newline at end of file
Markdown 格式
0% or
您添加了 0 到此讨论。请谨慎行事。
先完成此消息的编辑!
想要评论请 注册