Question

javascript if语句如何导致此问题？ if语句的正文总是被执行，但似乎只有if语句的存在会导致谷歌图表无法正常工作......

google.load('visualization', '1', {packages: ['corechart']});
...
...
...

var chart1 = new google.visualization.PieChart(document.getElementById('chartId1'));
var chart2 = new google.visualization.PieChart(document.getElementById('chartId2'));
...

var drawCharts = function() {
  var chart1Width = jQuery('#chartId1').width();
  var chart2Width = jQuery('#chartId2').width();
  ...

  var data = new google.visualization.DataTable();
  var chartOptions = {...};

  data.addColumn(...);
  data.addColumn(...);
  data.addRows([...]);
  chart1.draw(data,chartOptions);
  console.log('chart 1 drawn');

  //if I uncomment the next line the chart is not drawn
  //if (chart2Width > 80) {
  data = new google.visualization.DataTable();
  data.addColumn(...);
  data.addColumn(...);
  data.addRows([...]);
  chart2.draw(data,chartOptions);
  console.log('chart 2 drawn');
  //if I uncomment the next line the chart is not drawn
  //} else {console.log('chart 2 not drawn');}
};
drawCharts();
jQuery(...).bind(...., function() {drawCharts();});

另外，只有在添加if语句时，才能从chart2.draw(...);行获得大量例外：Error: Invalid value for <circle> attribute cy="NaN"，Error: Invalid value for <path> attribute d="MNaN,NaNL226,NaNL226,1.5L409.5,1.5"，Error: Invalid value for <path> attribute d="MNaN,NaNL206,NaNL206,1.5L22.5,1.5"等...

因为console.log('chart 2 drawn');发生在任一场景中，这意味着if语句应该没有效果......但图表不显示，我得到例外......

javascript if语句如何导致此问题？

Answer 1

我通过在尝试绘制...之前强制图形容器的高度来摆脱这个问题。

if (chart2Width > 80) {
  jQuery('#chartId2').height(chart2Width/2);
  data = new google.visualization.DataTable();
  data.addColumn(...);
  data.addColumn(...);
  data.addRows([...]);
  chart2.draw(data,chartOptions);
  console.log('chart 2 drawn');
} else {
  console.log('chart 2 not drawn');
}

显然chartArea.height配置选项无法正常工作......

仍然不知道为什么渲染图形而不可见会导致忽略错误，但是如果未明确设置高度，那么当它变得可见时，需要这些错误才能工作...

no-op if语句导致谷歌图表失败？

1 个答案: