0

使用 Google 的新图表是构建数据图形表示的绝妙方法，但是我已经能够在 Excel 中完成一些我无法使用 API 复制的方法。

我想要做的是使绘制在 x 轴上第一个点的点更靠近 y 轴。目前，第一个点是远离 y 轴绘制的，但在我生成的图表中，第一个点应该是数据的原点。这是我目前拥有的：

当前的谷歌图表输出

绘制在 0,40 处的点远离 y 轴绘制。我想要的是有一个真正的 0,0 点，以便为“1”绘制的数据被视为第一天结束时采集的数据，而在“0”采集的数据只是基线：

理想的谷歌图表输出

我也创建了一个jsfiddle供您使用，这里是 JavaScript：

google.load("visualization", "1", {packages:["corechart"]});
google.setOnLoadCallback(drawChart);
function drawChart() {
    var data = new google.visualization.DataTable();
    data.addColumn('string', 'Day');
    data.addColumn('number', 'Slide');
    data.addRows([
        ['0', 40],
        ['1', 36],
        ['2', 32],
        ['3', 28],
        ['4', 24],
        ['5', 20],
        ['6', 16],
        ['7', 12],
        ['8',8],
        ['9', 4],
        ['10', 0],
    ]);

    var options = {
        colors: ['red', 'silver'],
        title: 'Slide',
        hAxis: {minValue: 0}
    };

    var chart = new google.visualization.LineChart(document.getElementById('chart_div'));
    chart.draw(data, options);
}
​

和 HTML：

<div id="chart_div" style="width: 900px; height: 500px;"></div>

这里有一些关于自定义轴的提示，但它们只会破坏我的图表！

4

1 回答 1

0

使用图表时，将 x 轴定义为字符串会在图表的开头和结尾处强制留出间隙。这在 y 轴上的标签和绘制的第一个点之间最为显着，如问题中的图像所示。

为了克服这个问题，将 x 轴定义为一个数字（显然，在适当的情况下）：

data.addColumn('number', 'Day');
data.addColumn('number', 'Slide');
data.addRows([
    [0, 40],
    [1, 36],
    [2, 32],
    [3, 28],
    [4, 24],
    [5, 20],
    [6, 16],
    [7, 12],
    [8,8],
    [9, 4],
    [10, 0],
]);

第一列现在是类型number，值现在是数字而不是字符串。看到它在jsfiddle上工作。

于 2012-04-29T19:52:49.553 回答