echarts引用本地文件,动态传数据时只要显示坐标轴

来源:互联网 发布:张大千 敦煌破坏 知乎 编辑:程序博客网 时间:2024/06/06 07:44

引用本地文件进行开发

引用本地文件进行开发时在“.jsp”中,正常引用就好

  • 首先是引用echarts.js
<script type="text/javascript" src="/assets/global/plugins/echarts-2.2.7/build/dist/echarts.js"></script>
  • 当使用了主题时要这样写来引用主题文件,但是”macarons”就不用啦~
<script type="text/javascript" src="/assets/global/plugins/echarts-2.2.7/doc/example/theme/blue.js"></script>

在”.js”中做路径配置时,要这样写,重点是那些“../../../”呀!

require.config({        paths : {            echarts : '../../../assets/global/plugins/echarts-2.2.7/build/dist',            theme : '../../../assets/global/plugins/echarts-2.2.7/doc/example',        }    });

中间的那个参数是加载主题的,不用可以不写哦

    require([ 'echarts', 'theme/theme/blue', 'echarts/chart/bar' // 使用柱状图就加载bar模块,按需加载    ], function(ec, theme) {        // 基于准备好的dom,初始化echarts图表        var myChart = ec.init(document.getElementById('main'), theme);        var option = {            tooltip : {                trigger : 'axis'            },            toolbox : {                show : true,                padding : 20,                feature : {                    restore : {                        show : true                    },                    saveAsImage : {                        show : true                    }                }            },            calculable : true,            xAxis : [ {                show : true,                type : 'category',                data : datax,            } ],            yAxis : [ {                show : true,                type : 'value',            } ],            series : [ {                name : $("#metaDataActive").find("option:selected").text(),                type : 'bar',                data : datay,                barMaxWidth : 50,            } ]        };        // 为echarts对象加载数据        myChart.setOption(option);        window.onresize = myChart.resize;    });
  • 那个datax,datay是什么鬼?
    嘿嘿,我是通这ajax传的数据啦,所以这里换了一下

为什么echarts当没有数据时要把坐标轴弄没了,还不断冒泡泡呀?
(虽然我觉得是很美),但有时可能会和项目风格不太相符~所以……

给datax(也就是横轴上的数据)一个值,是这样的——[“”]
给datay(也就是纵轴上的数据)一个值,是这样的——[0]
你就可以看到一个没有数据显示的坐标轴啦~
不知道有没有更好的办法,找到了再分享给大家喽~

0 0
原创粉丝点击