weifeng-888

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);

 

    });

 

分类:

技术点:

相关文章: