jQWidgets jqxGauge RadialGauge value 属性

jqxGauge 是一个功能强大的 JavaScript 库，可以让您创建各种图表和仪表盘。其中，RadialGauge 是一种非常流行的类型，类似于汽车仪表盘。在 RadialGauge 中， value 属性用于指定当前值或指针的位置。

语法

// 设置当前值为 70
$("#gauge").jqxGauge({ value: 70 });

参数

参数 | 描述 --------|------------------------ number | 指定 RadialGauge 的当前值或指针的位置。默认值为 0。

示例

以下代码片段展示了如何使用 value 属性来设置 RadialGauge 的当前值：

// 创建一个新的 RadialGauge
$("#gauge").jqxGauge({
    ranges: [{ startValue: 0, endValue: 50, style: { fill: '#5CB85C', stroke: '#5CB85C' }, startDistance: 0, endDistance: 0 },
             { startValue: 50, endValue: 100, style: { fill: '#F0AD4E', stroke: '#F0AD4E' }, startDistance: 0, endDistance: 0 }],
    caption: { value: 'Radial Gauge' },
    labels: {
        position: 'outside', interval: 10,
        formatFunction: function (value) {
            return value + '%';
        }
    },
    ticksMinor: { visible: false },
    ticksInterval: 10,
    value: 70
});

此示例创建一个 RadialGauge，并将其当前值设置为 70。 RadialGauge 还具有其他有用的选项，例如 ranges、caption、labels 和 ticksInterval，它们可以帮助您自定义表现形式。

结论

jqxGauge 库提供了丰富的选项，可让您轻松创建自定义 RadialGauge 仪表盘。使用 value 属性，您可以指定仪表盘的当前值或指针位置。