定位點和標籤在谷歌供電折線圖的x軸

使用谷歌的新圖表是一種很好的方式來構建數據的圖形化表示，但是我已經能夠在Excel中做一些事情，但仍然可以找到使用API進行復制的方法。定位點和標籤在谷歌供電折線圖的x軸

我想要做的就是在x軸上的第一個點繪製的點更接近y軸。目前，第一個點是從y軸繪製的，但在我生成的圖中，第一個點應該是數據的來源。這是我目前有：

current Google Charts output

點處繪製0,40被繪出了從y軸的路程。我想要的是有一個真正的0,0點，以便繪製'1'的數據被視爲在第一天結束時拍攝的數據，而以'0'拍攝的數據只是基線：

ideal Google Charts output

我已經創建了一個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>

有一些提示here關於自定義軸，但他們什麼都不做，但打破我的圖！

來源

2012-04-27 cchana

使用圖表時，將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-29 19:52:49 cchana

定位點和標籤在谷歌供電折線圖的x軸

回答

相關問題