echarts读取excle转为json格式显示图表异步加载数据的方法(2)

一、引入jquery.min.js、jquery.csv.min.js和echarts.min.js核心js库；

    <!--jquery核心库-->
    <script src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js"></script>
    <!--jquery.csv核心库-->
    <script type="text/javascript"
            src="https://cdnjs.cloudflare.com/ajax/libs/jquery-csv/1.0.3/jquery.csv.min.js"></script>
    <!--echarts核心库-->
    <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/echarts/dist/echarts.min.js"></script>

二、echarts读取异步加载数据

 /*读取csv数据*/
    var Dname = [], Data = [];
    function getCsv() {
        var csv_file_API = 'line.csv';//csv files
        $.ajax({
            type: 'post',
            url: csv_file_API,
            async: true,//异步传递数据的方式；
            dataType: 'text',
            success: function (data) {
                var dataCsv = $.csv.toObjects(data);//获取数组,并通过jQuery-CSV进行处理转化;
                //console.log(dataCsv);
                /*处理CSV数据，并输入Echarts格式*/
                for (var i = 0; i < dataCsv.length; i++) {
                    Dname.push(dataCsv[i].name);
                    Data.push(dataCsv[i].data);
                }

                /*echarts图表渲染*/
                var dom = document.getElementById("container");
                var myChart = echarts.init(dom);

                var option = {
                    tooltip: {
                        trigger: 'axis'
                    },
                    xAxis: {
                        type: 'category',
                        data: Dname
                    },
                    yAxis: {
                        type: 'value'
                    },
                    series: [{
                        data: Data,
                        type: 'bar'
                    }]
                };

                if (option && typeof option === "object") {
                    myChart.setOption(option, true);
                }
            },
            error: function (e) {
                alert('API调用出错!');
                console.log("API call Failed: ", e);
            }
        });
    }

    getCsv();