[ABI 5.1] Echarts自定义实现标点地图

请问如何修改下面的脚本能够实现Echarts自定义的标点地图（这段代码的option部分加上格式化出来的数据res能够在Echarts上能够运行出来正确标点地图，只不过是中国地图）

//区域名称及值
var  captions = '<#=GRID1.A1$#>';
var  values='<#=GRID1.B1$#>';
captions = eval(captions);
values=eval(values);
//存放点击事件
var  dqCell='GRID1.A1'
var  clickStrMap={};
var  dq='<#=@dq#>';
var  biaodian='<#=@dq#>';
//地图副标题
var  titleShow=true;
var secondTitle='我是地图副标题';

//注册地图
if(!dq){
    dq='黔东南';
    biaodiandq="biaodian";
}
var pathurl =EUI.getContextPath() + 'vfs/root/mapjson/'+dq+'.json';//地图json
var datas= EUI.QueryObj.create(pathurl);
var geoJson= datas.getResponseJSON();
console.log(dq,"geoJson:",geoJson);
echartsesen.registerMap(dq,geoJson);
var biaodianpathurl =EUI.getContextPath() + 'vfs/root/mapjson/'+biaodiandq+'.txt';//标点的经纬度信息
var biaodiandatas= EUI.QueryObj.create(biaodianpathurl);
var biaodiangeoJson= biaodiandatas.getResponseJSON();
console.log(biaodiandq,"biaodiangeoJson:",biaodiangeoJson);
//格式化地图数据
function  formatData(captions,values){
    var  dataArray=new Array();
    console.log("captions",captions);
    console.log("values",values);
    for(var i=0;i<captions.length;i++){
        var obj={name:captions,value:values};
        dataArray.push(obj);
    }
    return dataArray;
}

//格式化标点数据
function concatData(arrayData) {
   console.log("arrayData",arrayData.length);
   var res =new Array();
   for (var i = 0; i < arrayData.length; i++) {
       var geoCoord = biaodiangeoJson[arrayData.name];
       console.log("geoCoord",geoCoord);
       if(geoCoord) {
           var obj={name: arrayData.name,value: geoCoord.concat(arrayData.value)};
           res.push(obj);
       }
   }
   return res;
}
var tmp=formatData(captions,values);
console.log("dataArray",tmp);
var tempData=concatData(tmp);
console.log("res",tempData);
//表元点击事件
var getClickStr = function (rowIndex,tableDom,colIndex){
    return tableDom.children[rowIndex].children[colIndex].children[0].getAttribute("onclick");
}
var  getClickStrMap =function(clickStrMap,dqCell,captions){
    var gridName = dqCell.split(".")[0];
    var cellName  = dqCell.split(".")[1];
    var colIndex   = cellName.charAt(0).charCodeAt()-65;
    var startRowIndex= cellName.charAt(1)-1;
    var tableDom = g_rptpage.getGridById(gridName).tabdom.firstElementChild.nextElementSibling;
    var capLen=captions.length;
    for(var i=0;i<capLen;i++){
        var rowIndex =startRowIndex + i;
        clickStrMap[captions] = getClickStr(rowIndex,tableDom,colIndex);
    }
}
getClickStrMap(clickStrMap,dqCell,captions);
myChart.clickStrMap=clickStrMap;

var option = {
    tooltip: {},
    visualMap: {
        min: 0,
        max: 1500,
        left: 'left',
        top: 'bottom',
        text: ['High','Low'],
        seriesIndex: [1],
        inRange: {
            color: ['#e0ffff', '#006edd']
        },
        calculable : true
    },
    geo: {
        map: 'china',
        roam: true,
        label: {
            normal: {
                show: true,
                textStyle: {
                    color: 'rgba(0,0,0,0.4)'
                }
            }
        },
        itemStyle: {
            normal:{
                borderColor: 'rgba(0, 0, 0, 0.2)'
            }
        }
    },
    series : [
       {
           type: 'scatter',
           coordinateSystem: 'geo',
           //data: convertData(data),
           data: res,
           symbolSize: 20,
           symbol: 'image://data:image/gif;base64,R0lGODlhEAAQAMQAAORHHOVSKudfOulrSOp3WOyDZu6QdvCchPGolfO0o/XBs/fNwfjZ0frl3/zy7////wAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACH5BAkAABAALAAAAAAQABAAAAVVICSOZGlCQAosJ6mu7fiyZeKqNKToQGDsM8hBADgUXoGAiqhSvp5QAnQKGIgUhwFUYLCVDFCrKUE1lBavAViFIDlTImbKC5Gm2hB0SlBCBMQiB0UjIQA7',

           label: {
               normal: {
                   formatter: '{b}',
                   position: 'right',
                   show: false
               },
               emphasis: {
                   show: true
               }
           },
           itemStyle: {
               normal: {
                    color: '#F06C00'
               }
           }
        }
    ]
};

//绑定点击事件
myChart.on("click",function(params){
    var self=this;
    var dq=params.name;
    if(dq){
        var clickStr=this.clickStrMap[params.name];
        eval(clickStr);
    }
});


return option;
/*以下是读取资源管理器里的文件格式化出来的res
res = [
  {
    "name": "凯里市",
    "value": [
      107.977541,
      26.582964,
      76.5779558
    ]
  },
  {
    "name": "凯里站",
    "value": [
      107.982583,
      26.607196,
      70.2523303
    ]
  },
  {
    "name": "凯里南站",
    "value": [
      107.894046,
      26.518008,
      24.8582357
    ]
  },
  {
    "name": "黄平县",
    "value": [
      107.901337,
      26.896973,
      36.7851834
    ]
  },
  {
    "name": "施秉县",
    "value": [
      108.12678,
      27.034657,
      22.9946154
    ]
  },
  {
    "name": "三穗县",
    "value": [
      108.681121,
      26.959884,
      75.6305307
    ]
  },
  {
    "name": "从江县",
    "value": [
      108.912648,
      25.747058,
      58.6900758
    ]
  },
  {
    "name": "雷山县",
    "value": [
      108.079613,
      26.381027,
      87.6251433
    ]
  },
  {
    "name": "麻江县",
    "value": [
      107.593172,
      26.494803,
      34.5340544
    ]
  },
  {
    "name": "丹寨县",
    "value": [
      107.794808,
      26.199497,
      30.6691709
    ]
  }
]
*/


vfs.zip (40.6 KB, 下载次数: )

2021-1-16 16:30 上传

点击文件名下载附件
标点坐标及两个地图json文件