首页 > 其他 > 详细

Echarts 地图绘制

时间:2019-05-07 22:28:28      阅读:173      评论:0      收藏:0      [点我收藏+]

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

 

    });

 

Echarts 地图绘制

原文:https://www.cnblogs.com/weifeng-888/p/10828388.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!