ECharts 的简单使用 备忘

 如果想使用其他的效果，只需要把echarts站点上的演示代码，替换掉 var option = {}，即可

<script src="~/echarts-2.2.1/build/dist/echarts.js"></script>
<script type="text/javascript">
        // 路径配置
        require.config({
            paths: {
                echarts: '/echarts-2.2.1/build/dist'
            }
        });
        // 使用
        require(
            [
                'echarts',
                'echarts/chart/bar' // 使用柱状图就加载bar模块，按需加载
            ],
            function (ec) {
                // 基于准备好的dom，初始化echarts图表
                var myChart = ec.init(document.getElementById('main'));

                var option = {
                    tooltip: {
                        show: true
                    },
                    legend: {
                        data: ['销量']
                    },
                    xAxis: [
                        {
                            type: 'category',
                            data: ["衬衫", "羊毛衫", "雪纺衫", "裤子", "高跟鞋", "袜子"]
                        }
                    ],
                    yAxis: [
                        {
                            type: 'value'
                        }
                    ],
                    series: [
                        {
                            "name": "销量",
                            "type": "bar",
                            "data": [5, 20, 40, 10, 10, 20]
                        }
                    ]
                };

                // 为echarts对象加载数据 
                myChart.setOption(option);
                //增加点击事件
                var ecConfig = require('echarts/config');
                function eConsole(param) {
                    switch (param.dataIndex) {
                        case 0:    //柱子1
                            window.location.href = "http://blog.sina.com.cn/eul";
                            break;
                        case 1:  //柱子2
                            window.location.href = "http://www.dacai.com/desc/4778";
                            break;
                        case 2:  //柱子3
                            window.location.href = "http://www.dacai.com/desc/4778";
                            break;
                        default:
                            break;
                    }
                }
                myChart.on(ecConfig.EVENT.CLICK, eConsole);
            }
        );
    </script>

<div id="main" style="height:400px"></div>

项目中echarts文件夹，下载后，直接放入项目即可