jQuery显示水平比例多标记

我正在寻找jQuery解决方案，在水平刻度线上显示4个值。这些值是最小值、最大值、平均值和当前值。它不是一个二维图。在一条水平线上只需简单的4个点，标记指向这些点

为了展示我正在努力实现的目标，这里有一个草图

---

我想到的第一件事就是这个。它支持多个句柄，如果其仅用于显示目的，则可以将其禁用

$(function() {
    $mySlider = $("#slider-range");
    $mySlider.slider({

      min: 0,
      max: 1000,
      values: [ 75, 125, 175, 225 ],
      slide: function( evt, ui ) {
          a = [];
          for(var i=0; i<ui.values.length; i++) {
              a.push(ui.values[i]);
          }

          $( "#amount" ).val( "$" + a.join(" - " + "$") );
      }
    });

    $( "#amount" ).val(
      ["$" + $mySlider.slider("values", 0),
       "$" + $mySlider.slider("values", 1),
       "$" + $mySlider.slider("values", 2),
       "$" + $mySlider.slider("values", 3)].join(" - ")
    );
});

$（函数（）{
$mySlider=$（“#滑块范围”）；
$mySlider.slider({
分:0,，
最高：1000，
值：[75125175225]，
幻灯片：功能（evt、ui）{
a=[]；
对于（var i=0；icheck out，我认为它将适合您的需要，并且将很容易实现

编辑

要使其成为只读，您可以在滑块顶部放置一个透明元素，从而防止用户手动移动它。
我查看了jQuery滑块插件，但没有弄清楚如何使其成为只读以及如何显示2个以上的标记，我希望此项仅用于显示目的，不希望用户移动slIders这是我检查的第一件事，但我没有找到一种方法来显示超过2个句柄。你知道我可以使用的确切语法吗。感谢Johan，剩下的唯一问题是如何显示每个标记的标签，还有一种方法来显示刻度标记。在API中，我没有找到显示标签f的方法或者标记。@VinayJain我不认为有什么内置的。我建议使用绝对定位的div，样式由你选择。谢谢Johan，我在stackoverflow中搜索了一些其他帖子，我能够做到。我真的很感谢所有的帮助。我想我现在很好。