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使用它）。但是我不知道如何找出图中最低和最高的像素点，指针会非常有帮助 –

jqplot面积图

回答

相关问题