更新地图代码

src/common/echartsUtils.js

@@ -1,5 +1,7 @@
 import $ from 'jquery'
 
+export let cityPosJson = {};  //城市的经纬度信息
+
 /**
  * 显示图形的 tooltip
  * @param params
@@ -197,4 +199,13 @@ export const bubbleSize = (maxval, minval, val, targetMax)=>{
 	}
 	var r = (targetMax-10)/(maxval-minval)*(val-minval)+10;
 	return r;
-}
+}
+export const converMapData2 = (name, value) => {
+    var geoCoordMap = cityPosJson;
+    var res;
+    var geoCoord = geoCoordMap[name];
+    if (geoCoord) {
+        res = geoCoord.concat(value);
+    }
+    return res;
+};

src/view/bireport/ChgChartDailog.vue

@@ -50,10 +50,10 @@
 	    data(){
 			return {
 				show:false,
-				mapArea:null,
+				mapArea:"china",
 				mapAreaname:null,
 				opts:{
-					areas:[]
+					areas:[{code:"china",name:"全国"}]
 				},
 				chart:null,
 				charts:[
@@ -97,12 +97,15 @@
 		},
 		methods: {	
 			initAreas(){
+				let ts = this;
 				ajax({
 					url:"bireport/listAreas.action",
 					data:{},
 					type:"GET",
 					success:(resp)=>{
-						this.opts.areas = resp.rows;
+						$(resp.rows).each((a, b)=>{
+							ts.opts.areas.push(b);
+						});
 					}
 
 				}, this);
@@ -116,6 +119,9 @@
 					}
 				});
 				this.chart.chartJson.type = tp;
+				if(tp === 'map'){
+					this.chart.chartJson.maparea = this.mapArea;
+				}
 				this.$parent.resetChart();
 				//重新绑定拖拽事件
 				this.$parent.initChartKpiDrop(2);

src/view/bireport/ParamFilter.vue

@@ -1,7 +1,7 @@
 <template>
   	<el-dialog :title="title" :visible.sync="show" :close-on-click-modal="false" custom-class="nopadding">
 
-		<template v-if="param.type === 'frd'">
+		<template v-if="!(param.type === 'month' || param.type === 'day')">
 			<el-input v-model="search"	size="mini" placeholder="输入关键字搜索">
 				<el-button slot="append" icon="el-icon-search" @click="searchme"></el-button>
 			</el-input>

src/view/bireport/ReportChart.vue

@@ -1,6 +1,6 @@
 <!-- 图形渲染类 -->
 <script>
-	import {ajax,loopChartJson} from '@/common/biConfig'
+	import {baseUrl, ajax,loopChartJson} from '@/common/biConfig'
 	import $ from 'jquery'
 	import { Loading } from "element-ui";
 	import * as tools from '@/view/bireport/bireportUtils'
@@ -312,6 +312,9 @@
 				if(!json.kpiJson || json.kpiJson.length == 0){
 					return;
 				}
+				if(json.kpiJson[0] == null){
+					return;
+				}
 				if(json.chartJson.type == "scatter" && (json.kpiJson.length < 2 || json.kpiJson[1] == null)  ){
 					return;
 				}
@@ -329,20 +332,32 @@
 					data: JSON.stringify(json),
 					success: (resp)=>{							
 						let option = loopChartJson(resp.rows);
-						let myChart = echarts.getInstanceByDom(document.getElementById('chart'+this.chartId));
-						if(!myChart){
-							myChart = echarts.init(document.getElementById('chart'+this.chartId),"default", {width:640, height:320});
+						//图形回调函数
+						var execf = ()=>{
+							let myChart = echarts.getInstanceByDom(document.getElementById('chart'+this.chartId));
+							if(!myChart){
+								myChart = echarts.init(document.getElementById('chart'+this.chartId),"default", {width:640, height:320});
+							}
+							myChart.setOption(option, true);
+							//图形下钻事件
+							myChart.off("click").on('click', function(params){
+								var xvalue = params.name;
+								var yvalue = params.value;
+								var svalue = params.seriesName;
+								var pos = {left:params.event.event.clientX, top:params.event.event.clientY};
+								var oldDimId = json.chartJson.xcol.alias;
+								ts.drillChart(xvalue, yvalue, svalue, pos, tools.findCompById(ts.chartId, ts.pageInfo), oldDimId); 
+							});
+						}
+						if(json.chartJson.type === 'map'){
+							var u2 = baseUrl + "chartjson/"+json.chartJson.maparea+".json";
+							$.getJSON(u2, {}, (resp)=>{
+								echarts.registerMap(json.chartJson.maparea, resp);
+								execf();
+							});
+						}else{
+							execf();
 						}
-						myChart.setOption(option, true);
-						//图形下钻事件
-						myChart.off("click").on('click', function(params){
-							var xvalue = params.name;
-							var yvalue = params.value;
-							var svalue = params.seriesName;
-							var pos = {left:params.event.event.clientX, top:params.event.event.clientY};
-							var oldDimId = json.chartJson.xcol.alias;
-							ts.drillChart(xvalue, yvalue, svalue, pos, tools.findCompById(ts.chartId, ts.pageInfo), oldDimId); 
-						});
 					}
 				}, this, load);
 			},

src/view/model/DimkpiModify.vue

@@ -166,7 +166,8 @@ export default {
           {value:"month",text:"月份"},
           {value:"day",text:"日期"},
           {value:"prov",text:"省份"},
-          {value:"city",text:"地市"}
+          {value:"city",text:"地市"},
+          {value:"town",text:"区县"}
         ],
         dateformat:[
           'yyyymmdd', 'yyyy-mm-dd', 'yyyy年mm月dd日', 'yyyymm', 'yyyy-mm', 'yyyy年mm月', 'yyyy', 'yyyy年'

src/view/portal/ChartDailog.vue

@@ -49,12 +49,14 @@
 	    data(){
 			return {
 				show:false,
-				mapArea:null,
+				mapArea:"china",
 				mapAreaname:null,
 				layoutId:null,
 				comp:null,
 				opts:{
-					areas:[]
+					areas:[{
+						code:"china",name:"全国"
+					}]
 				},
 				charts:[
 					{cid:"1", cname:"曲线图", type:"line",show:false,children:[
@@ -104,12 +106,15 @@
 		},
 		methods: {	
 			initAreas(){
+				var ts = this;
 				ajax({
 					url:"bireport/listAreas.action",
 					data:{},
 					type:"GET",
 					success:(resp)=>{
-						this.opts.areas = resp.rows;
+						$(resp.rows).each((a, b)=>{
+							ts.opts.areas.push(b);
+						});
 					}
 
 				}, this);
@@ -140,9 +145,10 @@
 					comp.kpiJson = [null, null, null];
 
 					this.$parent.addComp(this.layoutId, comp);
+					this.$parent.$forceUpdate();
 				}
 			},
-			insertChart(layoutId, chart){
+			insertChart(layoutId){
 				this.layoutId = layoutId;
 				this.show = true;
 				this.comp = null;
@@ -177,6 +183,7 @@
 						}
 					});
 				})
+				this.mapArea = comp.chartJson.maparea;
 				this.$forceUpdate();
 			},
 			selectchart(chartId){

src/view/portal/LayoutOptarea.vue

@@ -399,7 +399,7 @@ export default {
               var comp = {"id":newGuid(), "name":"交叉表", "type":"table"};
               execf(layoutId, comp);
             }else if(tp == "chart"){
-              ts.$refs['chartDailogForm'].insertChart(layoutId);
+              ts.$refs['chartDailogForm'].insertChart(layoutId, execf);
             }else if(tp == "grid"){
               var comp = {"id":newGuid(), "name":"表格", "type":"grid"};
               execf(layoutId, comp);

src/view/portal/prop/Chart.vue

@@ -32,7 +32,7 @@
           <el-switch v-model="prop.markerEnabled" @change="changevalue('markerEnabled')"></el-switch>
          </el-form-item>
         </template>
-         <template v-if="ctp == 'line' || ctp == 'column' || ctp == 'area' || ctp == 'bar' || ctp =='scatter' || ctp == 'bubble'">
+         <template v-if="ctp == 'line' || ctp == 'column' || ctp == 'area' || ctp == 'bar' || ctp =='scatter' || ctp == 'bubble' || ctp =='map'">
           <el-form-item label="左间距" label-width="70px">
             <el-slider v-model="prop.marginLeft" :max="300" :min="1" @change="changevalue('marginLeft')"></el-slider>
           </el-form-item>

src/view/portal/view/Chart.vue

@@ -104,24 +104,57 @@ export default {
     showChart(){
       let ts = this;
       let comp = this.comp;
-      let option = loopChartJson(this.data);
-      let myChart = echarts.getInstanceByDom(document.getElementById('ct_'+comp.id));
-      if(!myChart){
-        myChart = echarts.init(document.getElementById('ct_'+comp.id), "default");
-      }
-      myChart.setOption(option, true);
-      if(this.editor === true){  //编辑模式，设置图形显示颜色
-          myChart.off("click").on('click', function(params){
-            ts.$parent.$refs['ChartSeriesColorForm'].showDailog(comp, params);
-          });
-      }else{  //浏览模式，设置图形点击事件
-        if(comp.chartJson.link && comp.chartJson.link.target && comp.chartJson.link.target.length > 0){
-          myChart.off("click").on('click', function(params){
-              utils.compFireEvent(comp.chartJson.link, ts, comp.chartJson.link.paramName, params.name);
-              ts.islink = true;
-          });
+
+      const exec = ()=>{
+        let option = loopChartJson(this.data);
+        let myChart = echarts.getInstanceByDom(document.getElementById('ct_'+comp.id));
+        if(!myChart){
+          myChart = echarts.init(document.getElementById('ct_'+comp.id), "default");
+        }
+        myChart.setOption(option, true);
+        if(this.editor === true){  //编辑模式，设置图形显示颜色
+            myChart.off("click").on('click', function(params){
+              ts.$parent.$refs['ChartSeriesColorForm'].showDailog(comp, params);
+            });
+        }else{  //浏览模式，设置图形点击事件
+          if(comp.chartJson.link && comp.chartJson.link.target && comp.chartJson.link.target.length > 0){
+            myChart.off("click").on('click', function(params){
+                utils.compFireEvent(comp.chartJson.link, ts, comp.chartJson.link.paramName, params.name);
+                ts.islink = true;
+            });
+          }
         }
       }
+      if(comp.chartJson.type === 'map' && comp.chartJson.typeIndex == 2){
+         var u = baseUrl + "chartjson/city-baidu.json";
+         if($.isEmptyObject(echartsUtils.cityPosJson)){
+            $.getJSON(u, {}, (cityjson)=>{
+              for(let k in cityjson){
+                echartsUtils.cityPosJson[k] = cityjson[k];
+              }
+              var u2 = baseUrl + "chartjson/"+comp.chartJson.maparea+".json";
+                $.getJSON(u2, {}, (resp)=>{
+                    echarts.registerMap(comp.chartJson.maparea, resp);
+                    exec();
+              });
+            });
+         }else{
+              var u2 = baseUrl + "chartjson/"+comp.chartJson.maparea+".json";
+                $.getJSON(u2, {}, (resp)=>{
+                    echarts.registerMap(comp.chartJson.maparea, resp);
+                    exec();
+              });
+         }
+         
+      }else if(comp.chartJson.type === 'map'){ //地图，需要加载地图JSON数据
+         var u = baseUrl + "chartjson/"+comp.chartJson.maparea+".json";
+         $.getJSON(u, {}, (resp)=>{
+            echarts.registerMap(comp.chartJson.maparea, resp);
+            exec();
+         });
+      }else{
+        exec();
+      }
     }
   },
   watch: {