Echarts 图表宽度高度自适应解决方案

1,宽度

 

var domBarOrganization = document.getElementById("containerbarorganization");
var myChartBarOrganization = echarts.init(domBarOrganization);
var app = {};
optionbarorganization = null;
/*app.title = '坐标轴刻度与标签对齐';*/



var labelsBarOrganization = [];
var datasBarOrganization =[];
$.ajax({
    //几个参数需要注意一下
    type: "POST",//方法类型
    dataType: "json",//预期服务器返回的数据类型
    url: "***********" ,//url
    success: function (data) {
        for(var i=0;i   window.onresize = myChartBarOrganization.resize;//主要这里
            myChartBarOrganization.setOption(optionbarorganization, true);
        }




    },
    error : function() {
        Power.dialog.alertError("请求异常!");
    }
});

如果多个图表 :myChartBarOrganization不同即可


2、如果根据柱形柱子多少计算宽度或者高度



//dataOrganization3  数据条数(柱子个数)
 window.onresize = myChartOrganization.resize;
this.autoHeight = dataOrganization3 * 50 + 50; // counst.length为柱状图的条数,即数据长度。35为我给每个柱状图的高度,50为柱状图x轴内容的高度(大概的)。
 myChartOrganization.getDom().style.height = this.autoHeight + "px";
 myChartOrganization.getDom().childNodes[0].style.height = this.autoHeight + "px";
myChartOrganization.resize();
myChartOrganization.setOption(option1, true);

这样就可以缩小浏览器或者自适应了

 

 

你可能感兴趣的:(Java,echarts,技术,百度echarts)