jquery - Kendo Charts Linear gauge Decimal Scale

Question

I am having issues in setting decimal scales for Linear Gauge in kendo Charts...

Fiddle

function createGauge() {
     $("#gauge").kendoLinearGauge({

         pointer: {
             value: 0.5,
             size: 15,
             shape: "arrow",
             color: '#0000ff'
         },

         scale: {
             majorUnit: 20,
             minorUnit: 5,
             max: 1,
             labels: {
                 format: "n2"
             },
             vertical: false,
             ranges: [{
                 from: 0,
                 to: 0.3,
                 color: "#00ff00"
             }, {
                 from: 0.3,
                 to: 0.6,
                 color: "#ffff00"
             }, {
                 from: 0.6,
                 to: 1,
                 color: "#ff0000"
             }]
         }
     });
 }

 $(document).ready(function () {
     setTimeout(function () {
         createGauge();

         $("#example").bind("kendo:skinChange", function (e) {
             createGauge();
         });
     }, 400);
 });

When i set decimal ranges the labels of the scale do not appear...

If someone can edit this code... Here is the fiddle

Answer 1

问题在于你的majorUnit和minorUnit..改变

majorUnit: 20,
minorUnit: 5,

至

majorUnit: .20,
minorUnit: .5,

您的比例是 0 到 1，因此您需要确保主要和次要单位介于 min（默认值：0）和 max（在您的情况下为 1）之间

这里的工作示例