同じGoogleグラフで複数のデータセットを表示

Question

私はGoogleチャートでバーンドダウンチャートを作成しようとしています。

既に必要なデータをすべて設定し、ガイドライン用と残りのポイント用に2つの異なるデータセットに分割しました。

私は現在、両方の行を同時に表示することができないという問題を抱えています。ガイドラインまたは残りの点を表示します。 私はまだ成功してデータセットを参加しませんが：

var joinedData = google.visualization.data.join(guidelineData, remainingData, 'full', [[0, 0]], [1], [1]); 

    var chart = new google.visualization.LineChart(document.getElementById('burndown-chart')); 

    chart.draw(joinedData, options); 

https://jsfiddle.net/Lvx5tdy6/6/

は、誰も私はそれを解決することができますどのようにいくつかのアイデアを持って？任意のヘルプ

Answer 1

ため

おかげで問題は、ガイドラインのための唯一の2つのデータポイントを持っていて、最初の日付が一致して、既存のデータセットにそれをマッピングしています。 これは、グラフ上に1点しか得られないことを意味します。

データ間に不規則な時間間隔があるので、線形関数を使用して1.0 * guidelineValStartから0.0 * guidelineValStartにガイドラインをマップすることはできません。あなたは何ができるか

は、実際のデータを使用して一致させるために理想的なラインを強制です：

var guidelineDateStart = guideline[0].date; 
var guidelineValStart = guideline[0].guideline; 

var milliS = 1000 * 60 * 60 * 24; 
var numDays = (remaining[remaining.length - 1].date - remaining[0].date)/milliS; // work out the number of days that will be displayed 

var remainingValues = remaining.map(function(item, idx) { 
    return [ 
    new Date(item.date), 
    item.remaining, 
    (1.0 - (item.date - guidelineDateStart)/milliS/numDays) * guidelineValStart // adjust the ideal line to suit 
    ]; 
}); 

の作業例：https://jsfiddle.net/ab3e31of/4/