Javascript 如何使用flot graph将滚动条添加到画布中的X轴或Y轴

我有一个多系列的flot图，绘制在宽度和高度的画布上。当flot图形有多个系列时，它试图在画布的高度和宽度范围内压缩，flot图形将看不清楚

为了获得一个清晰的图形，所有节点的所有序列都可见，我想引入一个滚动条，这样滚动条一开始只适合少数序列，然后滚动序列的其余部分

我该怎么做

把它放在一个div中：

<div class="graph">
   <!-- here the graph -->
</div>

---

通过overflow属性，您可以控制滚动条的位置

我认为您可以将一些选项传递给Flot（使用导航插件），例如：

pan: {
    interactive: true
},
xaxis: {
    panRange: [Your xmin, your xmax]
} 

其中，panRange是指：

“平移范围”将平移限制在一个范围内，例如使用 平移范围：[-10,20]平移在一端的-10处停止，在另一端的20处停止 其他的。两者都可以为null

---

如果您不想使用插件（如@MF82所示）并且想要一个真正的滚动条，只需将容器目标div包装在另一个div中：

<div 
  style="width:315px;height:300px;overflow-y:scroll">
    <div class="chart" id="placeholder1" style="width:300px;height:1000px;">
     </div>
</div>

我也这么做了，但没有在画布上添加滚动条。而是添加到一个没有用的div。只有当窗口大小溢出时，才会添加滚动。但是我需要在画布上添加滚动，我用了同样的方法，但是它没有滚动，而是压缩了画布中的一系列图形canvas@Vidya，编辑您的问题以显示您正在使用的代码，或者更好地创建一个使用“压缩”复制的JSFIDLE先生，我把它包在一个除法中，它工作得很好：）但是我面临的1个问题是，如果在图中只有一个系列，它仍然会设置一个滚动条，并在占位符的中间显示它。所以要看那个特别的系列，我需要滚动，但我不希望发生这种情况。先生，我该怎么做？@Vidya，请创建一个JSFIDLE示例。

<div 
  style="width:315px;height:300px;overflow-y:scroll">
    <div class="chart" id="placeholder1" style="width:300px;height:1000px;">
     </div>
</div>