jQuery水平标尺/刻度盘/标尺

试图找到一个jQuery插件，它可以实现这样的规模，但我没有找到任何东西。基本上，箭头将保持不变，您可以向左/向右滑动标尺以更改值

有什么想法吗

---

我认为实现这一点的唯一方法是使用线性仪表（如我在评论中所述），并使用一些自定义javascript强制它按照您的意愿运行，下面是一个超级基本的小提琴，向您展示我的意思：

HTML:

---

如果你在谷歌上搜索线性/水平标尺插件，你会发现一堆——但不是我想要的结果。我认为你唯一的选择可能是使用线性标尺，并执行自定义javascript逻辑以保持指针居中，同时根据用户输入更改标尺

<button class="testbtn">
CHANGE VALUE
</button>
<div style="height:150px">
    <div id="lineargauge"></div>
</div>

$(function () {
            $("#lineargauge").igLinearGauge({
                height: "80px",
                width: "100%",
                value: 150,
                minimumValue: 100,
                maximumValue: 200,
                ranges: [
                    {
                        startValue: 100, endValue: 150, name: "range1"
                    },
                    {
                        startValue: 150, endValue: 200, name: "range2"
                    }
                ]
            });
        });

        $(document).on("click", ".testbtn", function(){
        $("#lineargauge").igLinearGauge({
                height: "80px",
                width: "100%",
                value: 50,
                minimumValue: 0,
                maximumValue: 100,
                ranges: [
                    {
                        startValue: 0, endValue: 50, name: "range1"
                    },
                    {
                        startValue: 50, endValue: 100, name: "range2"
                    }
                ]
            });
        });