1

当我使用日期的列类型时，ColumnChart 中的第一个和最后一个条被切成两半。它似乎是从中间条渲染的。它不会对非日期数据集执行此操作。

有没有办法解决这个问题，以便渲染完整的条形图，并带有一些额外的填充？

http://jsfiddle.net/7tHVN/

4

2 回答 2

4

显然，设置 viewWindowMode 确实适用于日期。将以下内容添加到我的图表选项中，其中最小值和最大值是第一个和最后一个日期值之前和之后的日期，至少对我有用。

'hAxis': {'viewWindowMode': 'explicit', 'viewWindow': {'max':new Date('2012-10-02'), 'min':new Date('2007-07-02')}}

另请参阅：柱形图裁剪谷歌论坛中的结束栏。

于 2012-10-14T17:44:39.310 回答
2

我遇到了这个确切的问题（我的标签也奇怪地错位了），它让我疯狂地试图弄清楚。hAxis.viewWindowMode通常可以解决此类问题，但不能将其与日期值一起使用。

我最终做的只是完全废弃日期类型，string而是指定该列的类型，并将每个 JS 日期对象转换为字符串表示形式，然后再将其添加到 中DataTable，因此：

data.addColumn('string', 'Date');
data.addColumn('number', 'Performance');

var dates = [new Date('2012-4-12'),
             new Date('2012-4-13'),
             new Date('2012-4-14')];
var performance = [59, 35, 86];

var dateString;
for (var i=0; i<dataForChart.length; i++) {
    dateString = (dates[i].getMonth()+1)+'/'+ // JS months are 0-indexed
                  dates[i].getDate()+'/'+
                  dates[i].getYear();
    data.addRow([dateString, 
                performance[i]]);
}

这会强制图表使用离散轴而不是连续轴进行渲染，从而解决了截止条问题。只要您的数据和日期间隔均匀（每天一次、每周一次等）并且您以正确的顺序传递它们，这种方法就应该有效。

Google Viz 文档中有关于离散轴与连续轴的更多信息：https ://google-developers.appspot.com/chart/interactive/docs/customizing_axes

于 2012-06-26T22:58:08.173 回答