jqplot面積圖

我與jqplot工作，代碼如下：jqplot面積圖

<!DOCTYPE html> 
<html> 
<head> 
    <script src="https://code.jquery.com/jquery-2.1.3.min.js" type="text/javascript"></script> 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jqPlot/1.0.8/jquery.jqplot.min.js" type="text/javascript"></script> 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jqPlot/1.0.8/plugins/jqplot.pieRenderer.min.js" type="text/javascript"></script> 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jqPlot/1.0.8/plugins/jqplot.categoryAxisRenderer.min.js" type="text/javascript"></script> 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jqPlot/1.0.8/plugins/jqplot.highlighter.min.js" type="text/javascript"></script> 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jqPlot/1.0.8/plugins/jqplot.canvasTextRenderer.min.js" type="text/javascript"></script> 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jqPlot/1.0.8/plugins/jqplot.canvasAxisTickRenderer.min.js" type="text/javascript"></script> 
    <link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/jqPlot/1.0.8/jquery.jqplot.min.css" /> 

    <title>Chart 5</title> 
</head> 

<body> 
    <script type="text/javascript"> 
    $(document).ready(function(){ 
     var l1 = [78, 75, 77, 78, 80, 83, 90, 96, 99, 82]; 
     var l2 = [4, 8, 5, 3, 6]; 
     var l3 = [12, 6, 13, 11, 2]; 

     var plot1 = $.jqplot('chart1b', [l1], { 
     stackSeries: true, 

     showMarker: true, 

     seriesDefaults: { 
      fill: true, 
      pointLabels: { 
      show: true 
      } 
     }, 

     axes: { 
      xaxis: { 
      renderer: $.jqplot.CategoryAxisRenderer, 
      ticks: ['12 AM \n 3/13', '8 AM', '4 PM', '12 AM \n 3/14', '8 AM', '4 PM', '12 AM \n 3/15', '8 AM', '4 PM', '12 AM \n 3/16'] 
      }, 

      /*yaxis: { 
      min: 0, 
      max: 100 
      }*/ 
      yaxis: { 
      tickInterval: 25, 
      showTicks: true, 
      showTickMarks: true, 
      ticks: [0, 25, 50, 75, 100] 
      } 
     }, 

     highlighter: { 
      show: true, 
      showTooltip: true 
     } 
     }); 
    }); 
    </script> 
    <h2>Area Chart</h2> 
    <div style="width: 500px; height: 300px;" id='chart1b'></div> 
</body> 
</html>

而不是突出所有數據點，我想只有最小和最大數據點加以強調。有沒有辦法做到這一點，請建議..

來源

2016-04-27 sonal khare

你的意思是，你只需要在3/13的12點和12點的3/16畫藍線？請簡要解釋。 –

我在你的圖表中做了一些改變，因爲我沒有得到你想要的東西，所以有一些分析的基礎我在jsfiddle中創建了一個圖表，你可以從這裏得到它，

jsfiddle.net/fhdd8/358/

來源

2016-04-27 13:33:58

我想要的是------當我將鼠標懸停在任何數據點上時，該點突出顯示以及我得到一個工具提示，它顯示特定點處的數據。而不是所有的數據點，只有最小值和最大值應該突出顯示，希望我現在很清楚 –

我想實現類似圖像的東西------ http://imgur.com/USMqpmk –

什麼我可以想到的是，如果我在圖中確定最低和最高像素點，那麼我可以使用畫布在這些像素上繪製圓圈（如jqplot使用它）。但是我不知道如何找出圖中最低和最高的像素點，指針會非常有幫助 –

回答

相關問題