Googleグラフ - 水平軸の最大値と最小値

Question

私は水平軸に週番号の折れ線グラフを作成しました。それは1年を表示することを意味するので、1から始まり52で終了する必要があります。私はhAxis: {maxValue: 52}を使ってみましたが、うまくいかないようです。ここに私の設定です：クラシックチャートの多くのオプションがhAxis.minValue含め、still not implemented in the Material Chartsいるよう

<script type="text/javascript"> 
    google.charts.load('current', {'packages':['line']}); 
    google.charts.setOnLoadCallback(drawChart); 

function drawChart() { 

    var data = new google.visualization.DataTable(); 
    data.addColumn('number', 'Ugenr.'); 
    data.addColumn('number', 'Anbefalet pris'); 
    data.addColumn('number', 'Nuværende pris'); 

    data.addRows([ 
    [1, 37.8, 41.8], 
    [2, 6.6, 32.4], 
    [3, 25.4, 25.7], 
    [4, 11.7, 10.5], 
    [5, 11.9, 6.6], 
    [6, 8.8, 7.7], 
    [7, 7.6, 9.6], 
    [8, 12.3, 10.6], 
    [9, 6.6, 14.8], 
    [10, 12.8, 11.6], 
    [11, 5.3, 4.7], 
    [12, 6.6, 5.2], 
    [13, 4.8, 3.6], 
    [14, 4.2, 3.4], 
    [15, 8.8, 31.8], 
    [16, 30.9, 6.6], 
    [17, 25.4, 25.7], 
    [18, 11.7, 10.5], 
    [19, 11.9, 10.4], 
    [20, 6.6, 7.7], 
    [21, 7.6, 9.6], 
    [22, 12.3, 10.6], 
    [23, 16.9, 14.8], 
    [24, 12.8, 11.6], 
    [25, 5.3, 4.7], 
    [26, 6.6, 5.2], 
    [27, 4.8, 3.6], 
    [28, 4.2, 6.6], 
    [29, 37.8, 41.8], 
    [30, 30.9, 32.4], 
    [31, 25.4, 25.7], 
    [32, 11.7, 10.5], 
    [33, 11.9, 10.4], 
    [34, 8.8, 7.7], 
    [35, 7.6, 9.6], 
    [36, 12.3, 10.6], 
    [37, 16.9, 14.8], 
    [38, 12.8, 11.6], 
    [39, 5.3, 4.7], 
    [40, 6.6, 5.2], 
    [41, 6.6, 3.6], 
    [42, 4.2, 6.6], 
    [43, 4.2, 3.4], 
    [44, 37.8, 41.8], 
    [45, 30.9, 32.4], 
    [46, 25.4, 25.7], 
    [47, 11.7, 10.5], 
    [48, 11.9, 6.6], 
    [49, 8.8, 7.7], 
    [50, 7.6, 9.6], 
    [51, 6.6, 10.6], 
    [52, 16.9, 14.8] 
    ]); 

    var options = { 
    chart: { 
     title: 'Anbefalede og nuværende ugepriser', 
     subtitle: 'anbefalede priser = blå, nuværende priser = rød', 
     hAxis: {maxValue: 52} 
    }, 
    legend: { position:'none' }, 
    height: 500, 
    explorer: { actions: ['dragToZoom', 'rightClickToReset'] } 
    }; 
    var chart = new google.charts.Line(document.getElementById('linechart_material')); 

    chart.draw(data, options); 
} 

$(window).resize(function(){ 
    drawChart(); 
}); 
</script> 

Answer 1

に思えます。

考えられる回避策は、最初の列に数字の代わりに文字列を使用して、独自のラベルを明示的に定義することです。例えば

（ここではラベルを持つすべての5週間）：

data.addColumn('string', 'Ugenr.'); 
// ... 

// the original data set is unchanged 
var dataset = [ 
    [1, 37.8, 41.8], 
    [2, 6.6, 32.4], 
    // ... 
]; 

// convert the 1st column to string 
dataset = dataset.map(function(r) { 
    return [!((r[0] - 1) % 5) ? r[0] + '' : '', r[1], r[2]]; 
}); 
data.addRows(dataset); 

はこのJSFiddleで完全なデモを参照してください。

しかし、このバージョンでは、定義されていないポイントにマウスを置くと週番号が表示されないため、完全には満足できません。したがって、代わりにreturn [r[0] + '', r[1], r[2]];をmap（）コールバックで実行することができます。