echarts笔记

 

常见问题：

1.x轴和y轴type同时为category时不可行

只能改变方式显示，返回不同名称，如加上百分比显示 formatter:"value%";

 var waterLevel = ["", "Ⅰ", "Ⅱ", "Ⅲ", "Ⅳ", "Ⅴ", "劣Ⅴ"];
yAxis: [
            {
                type: 'value',
                interval: true,
                max: 6,
                axisLabel: {
                    formatter: function (params) {
                        return waterLevel[params];
                    }
                },
                data: waterLevel
            }
        ],

2.当存放图表的Div为隐藏时，无法加载图表(需要设置好高度)

3.主题加载

echart3加载主题

//先引用js包(如2.0版)<script src="/echarts/themes/macarons.js" type="text/javascript"></script>
echarts.registerTheme("macarons", theme); 
var domChart1 = document.getElementById("Chart1");
var myChar = echarts.init(domChart1, "macarons");

点击查看详解

echart2加载主题

require.config({
                 paths: {
                     'echarts': '/UILib/echarts'
                 }
             });
             
             // 使用【柱状图】
             require(
                 [
                     'echarts',
                     'echarts/themes/2.2.7/macarons',
                     'echarts/chart/line',
                     'echarts/chart/bar' // 使用柱状图就加载bar模块，按需加载
                 ],
                 function (ec, theme) {
                     // 基于准备好的dom，初始化echarts图表
                     myChart = ec.init(document.getElementById('Chart1'), theme);
})

4.echarts3绑定事件

myChart.on("click", fcShowInfo);
function fcShowInfo(param) {}

 

百度echarts案例下载

http://echarts.baidu.com/gallery/editor.html?c=effectScatter-map

effectScatter-map是案例名称，如http://echarts.baidu.com/demo.html#lines-bmap-bus

effectScatter-map