Echarts 地图绘制

Echarts 官网地址：https://echarts.baidu.com/

 

绘制中国地图  注意加载两个js库

 

//封装一个地图方法

    function china_map(data){

        //初始化echarts

        var chart = echarts.init(document.getElementById('main'));

        //地图配置文件

        var option = {

            //悬停提示

            tooltip:{

                trigger:'item'

            },

            //图例地图

            visualMap:{

                    //显示与否

                    show:true,

                    //横坐标

                    x:'left',

                    //纵坐标

                    y:'bottom',

                    //颜色纵深

                    splitList:[{start:500,end:600},{start:400,end:500},{start:300,end:400},{start:100,end:200},{start:0,end:100}]

            },

            //载入数据

            series:[{name:'问题数量',type:'map',mapType:'china',data:data}]

        };

 

        //将配置文件载入实例

        chart.setOption(option);

    }

 

    //调用地图

 

    //通过发送ajax请求，将接口数据获取

    $.getJSON('/detail/problem_map',function(data){

        //调用绘图方法

        china_map(data);

 

    });