JustGage中的自定义颜色不能正常工作

Question

我试图将自定义扇区添加到我的JustGage对象中，当我添加它们时，它只是显示默认的：

0-25 =绿色，25-50 =黄色，50-100 =红色

我想让它像这样分开：

0-25 =红色，25-50 =橙色，50-75 =黄色，75-100 =绿色

我的密码在下面。我已经将我的customSectors定义为我想要的它们，但是这个量规仍然默认为原来的3个扇区。我是不是做错什么了。我试图在JustGage上找到一些文档，但实际上没有任何文档。

var Gage1 = new JustGage({
id: "gage-1", 
value: 100, 
min: 0,
max: 100,
showInnerShadow: false,
shadowOpacity : 0.3,
customSectors: [{
    color : "#CE1B21",
    lo : 0,
    hi : 25
}, {
    color : "#D0532A",
    lo : 25,
    hi : 50
}, {
    color : "#FFC414",
    lo : 50,
    hi : 75
}, {
    color : "#85A137",
    lo : 75,
    hi : 100
}],
valueFontColor : ['#4A98BE'], 
gaugeColor : ['#333'], 
    title: "Demo Gage",
label: "%"
});

注意:我使用的是公正。1.0.1.js

Answer 1

我想你只需要levelColors：

var Gage1 = new JustGage({
  id: "gage-1", 
  value: 100, 
  min: 0,
  max: 100,
  levelColors: ['#CE1B21', '#D0532A', '#FFC414', '#85A137']
});

我不认为justGage支持您为每种颜色精确地选择最小和最大的颜色。您可能需要处理levelColorsGradient选项，尝试首先将其设置为false。

Answer 2

如果你得到了最新版本的“公正”，你会看到'customSectors‘在代码中，如果你从他们的网站下载，'customSectors’是不存在的。

使用下面的链接获取最新的，您的代码应该工作得很好。

https://raw.github.com/toorshia/justgage/master/justgage.js

Answer 3

为我工作的配置：

  config = {
    value: 0,
    min: 0,
    max: 600000,
    decimals: 0,
    gaugeWidthScale: 0.6,
    label: '$',
    formatNumber: true,
    customSectors: {
      percents: true,
      ranges: [
        {lo: 0, hi: 33, color: '#13ED5A'}, // lo and hi values are in %
        {lo: 34, hi: 67, color: '#49D61C'},
        {lo: 68, hi: 100, color: '#49AB1C'}
      ]
    }
  };