Question

我通过谷歌图表api使用折线图，并遇到问题。当我使用arrayToDataTable时，一切正常，看起来没问题。

但是当我填充数据对象并用所需的数据填充它时，它就像从右侧切割。

此示例中的选项是相同的

        var options = {
            height: 245,
            width: '100%',
            chartArea: {top: 15, left: 30, width: '100%', height: 190},
            areaOpacity: 0.1,
            tooltip: {trigger: 'both'},
            legend: 'none',
            pointSize: 5,
            hAxis: {
                format: 'MM-dd',
                gridlines: {
                    color: '#fff',
                    count: 365 /* \_(ツ)_/ */
                },
                textStyle: {
                    fontSize: 11
                }
            },
            vAxis: {
                gridlines: {
                    color: '#dedede',
                    count: 5
                },
                viewWindow: {
                    min: 0
                },
                textStyle: {
                    fontSize: 11
                },
                baselineColor: 'dedede'
            }
        };

P.S。必须保留100％的宽度，因为页面是动态的并且在移动设备中使用。

更新即使这样也显示不好

https://jsfiddle.net/Ljz49gqb/2/

更新

这不是关于dataTable，它是关于谷歌图表api中的日期类型，以及100％宽度。（只是为了帮助在谷歌中找到这个主题）

Answer 1

解决了

    chartWrapWidth = document.getElementById('chart_div').offsetWidth;
    options.chartArea.width = chartWrapWidth - 45;

https://jsfiddle.net/Ljz49gqb/4/

谷歌图表api，相同的选项，不同的数据阵列使bug

1 个答案: