Incubator-echarts: 新人求教,缩放窗口时ECharts不能随窗口自由缩放

Created on 14 Oct 2016  ·  2Comments  ·  Source: apache/incubator-echarts

问题简述 (One-line summary)
缩放窗口时ECharts不能随窗口自由缩放,必须重新刷新页面才行,是我哪里设置不对吗,还是样式问题,求指教!

版本及环境 (Version & Environment)

  • ECharts 版本 (ECharts version):3.2.3
  • 浏览器类型和版本 (Browser version):Firefox最新
  • 操作系统类型和版本 (OS Version):win7 64位

重现步骤 (Steps to reproduce)
1.原窗口
default
2.缩小后
default
3.刷新之后
default

期望结果 (Expected behaviour)
default

可能哪里有问题 (What went wrong)
页面样式,ECharts配置

ECharts配置项 (ECharts option)

var xData = [1,2,3,4,5,6,7,8,9,10,11,12];
var theory = [51,22,33,34,55,66,47,48,29,50,51,32,43];
var online = [48,32,43,49,30,51,42,43,34,55,66,67,58];
var effic = [47,42,43,34,55,66,67,58,49,50,48,51,22];
var option = {
        tooltip : {
            trigger: 'axis'
        },
        legend: {
            x:'center',
            y:'bottom',
            padding:12,
            textStyle:{
                color: '#363636'
            },
            data:['理论发电量','上网电量','综合效率']
        },
        xAxis : [{
            type : 'category',
            boundaryGap : true,
            axisLabel:{textStyle:{color: '#363636'}},
            splitLine : {show: false},
            itemStyle: { normal: {label : {show: true}, color: '#836fff'}},
            data : xData
        }],
        grid : {
            borderColor:'rgba(0,0,0,0)',
            x : '35px',
            y : '30px',
            x2 : '40px',
            y2 : '60px'
        },
        yAxis : [
                 {
                     type : 'value',
                     name : '万kW·h',
                     position: 'left',
                     axisLabel : {
                         formatter: '{value}',
                         textStyle:{color: '#363636'}
                     },
                     nameTextStyle : {color: '#363636'},
                     splitLine : {show: false},
                     precision: 1,
                     splitNumber: 6
                 },
                 {
                     name:'%',
                     type : 'value',
                     yAxisIndex: 1,
                     axisLabel : {
                         formatter: '{value}',
                         textStyle:{color: '#363636'}
                     },
                     nameTextStyle : {color: '#363636'},
                     precision: 1,
                     splitLine : {
                         show: true,
                         lineStyle : {color : '#c0caca' , type : 'dashed'}
                     },
                     max :'100'
                 }
                ],
            series : [
                      {
                          name:'理论发电量',
                          type:'bar',
                          symbol:'emptyCircle',
                          itemStyle:{
                              normal: {
                                  lineStyle: {width:1.5},
                                  color:'rgb(249,217,95)'
                              }
                          },
                          data:theory
                      },
                      {
                          name:'上网电量',
                          type:'bar',
                          symbol:'emptyCircle',
                          itemStyle:{
                              normal: {
                                  lineStyle: {width:1.5},
                                  color:'rgb(0,166,190)'
                              }
                          },
                          data:online
                      },
                      {
                          name:'综合效率',
                          type:'line',
                          symbol:'emptyCircle',
                          yAxisIndex:1,
                          itemStyle:{
                              normal: {
                                  lineStyle: {width:1.5},
                                  color:'rgb(234,106,81)'
                              }
                          },
                          data:effic
                      }
                     ]
    };

其他信息 (Other comments)

Most helpful comment

All 2 comments

@pissang
非常感谢做出来了,加上下面的代码就好了
window.onresize=function(){
myChart.resize();
};

Was this page helpful?
0 / 5 - 0 ratings

Related issues

arssam picture arssam  ·  3Comments

akvaliya picture akvaliya  ·  3Comments

jarben picture jarben  ·  3Comments

decadef20 picture decadef20  ·  3Comments

jarben picture jarben  ·  3Comments