echart——入门demo

引入echarts文件  下载地址 https://download.csdn.net/download/sunshine0508/11171026

<script src="echarts.js" type="text/javascript" ></script>

准备一个dom

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

通过echart.js 初始化一个echarts 的实例，并通过setOption方法生成简单的柱状图

<script>
    // 基于准备好的dom，初始化echarts图表
    var myChart = echarts.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);
</script>