highcharts顯示百分比完成

我想在php中使用highcharts創建圖表。我想製作一個條形圖顯示項目startdate - endate顯示完成百分比。我有這3個值都來自數據庫。如果圖表中可能顯示的第四個值是當前日期，如果該項目缺少時間表，則通過酒吧中的陰影處理。highcharts顯示百分比完成

以下是我

var date = new Date();

//console.log（date.getFullYear（）+ 「」 +（date.getMonth（）+ 1）+ 「」 + date.getDay（））;

$('#container').highcharts({ 
    chart: { 
     type: 'spline' 
    }, 
    title: { 
     text: 'Snow depth in the Vikjafjellet mountain, Norway' 
    }, 
    subtitle: { 
     text: 'An example of irregular time data in Highcharts JS' 
    }, 
    xAxis: { 
     type: 'datetime', 
     dateTimeLabelFormats: { // don't display the dummy year 
      month: '%e. %b', 
      year: '%b' 
     } 
    }, 
    yAxis: { 
     title: { 
      text: 'Percent %' 
     }, 
     min: 0, 
     max: 100 
    }, 
    tooltip: { 
     formatter: function() { 
      var start = new Date(2013,5,11), 
      end = new Date(2013,11,11), 
      today = new Date(); 
       return Math.round(100-((end - start) * 100)/today) + '%' ;//'<b>'+ this.series.name +'</b><br/>'+ Highcharts.dateFormat('%e. %b', this.x) +': '+ this.y +' m'; 
     } 
    }, 

    series: [{ 
     name: 'Fastnet OffshWest Shetland', 
     // Define the data points. All series have a dummy year 
     // of 1970/71 in order to be compared on the same x axis. Note 
     // that in JavaScript, months start at 0 for January, 1 for February etc. 
     data: [ 
      [Date.UTC(2013, 5, 11), 0 ], 
      [Date.UTC(date.getFullYear(), (date.getMonth()+1), date.getDay()), 30 ], 
      [Date.UTC(2013, 11, 11), 100 ] 
     ] 
    }] 
});

enter image description here

我已被修改線圖。我想將它變成一個條形圖，顯示每個項目的開始日期結束日期。和當前完成的百分比。我還想計算並顯示使用當前日期應該完成的預測百分比。

來源

2013-06-19 shorif2000

你的問題是什麼？目前的產出是多少？預期產出是多少？ –

我已更新我的問題 – shorif2000

我認爲您需要提供一個示例圖，說明您希望圖表的樣子。 – jlbriggs

據我瞭解，你需要條形圖，與Y軸實際百分比進度，並開始 - 在X軸結束日期，如果是的話，你在這裏：http://jsfiddle.net/hbEsj/

使用columnrange圖表，它允許你將數據傳如：[value, timestamp1, timestamp2]：

$('#container').highcharts({ 

    chart: { 
     type: 'columnrange', 
     inverted: true 
    }, 
    xAxis: { 
     min: -10, 
     max : 110, 
     tickInterval: 25, 
     startOnTick: false, 
     endOnTick: false, 
     reversed: false 
    }, 
    yAxis: { 
     type: 'datetime' 
    }, 
    plotOptions: { 
     series: { 
      pointWidth: 20 
     } 
    }, 
    series: [{ 
     name: 'Project 1', 
     data: [ 
      [36, Date.UTC(2013,0,1),Date.UTC(2013,0,13)] 
     ] 
    }, { 
     name: 'Project 2', 
     data: [ 
      [66, Date.UTC(2013,0,1),Date.UTC(2013,0,10)] 
     ] 
    }, { 
     name: 'Projec 3', 
     data: [ 
      [100, Date.UTC(2013,0,1),Date.UTC(2013,0,3)] 
     ] 
    }] 

});

不過，我不預測和計算值理解部分 - Highcharts是顯示數據，而不是預測任何一個圖書館。

來源

2013-06-20 12:23:56

highcharts顯示百分比完成

回答

相關問題