Как установить циферблаты в значения, указанные в качестве входных данных в диаграмме слияния угловых калибров

Question

Я использую библиотеку графиков слияния. В этом я использую диаграмму Angular Gauge для своего отчета. Я столкнулся с проблемой с циферблатом, который автоматически устанавливается библиотекой графиков фьюжн на основе номера набора, который мы передаем ему.

Его разделение min и max на 4 равных подразделениях и отображение. Я хочу перезаписать его. Я хочу показать максимальное значение каждого раздела, заданного нами.

выходной ток:

Ожидаемый результат:

Мой код здесь:

var bw1 = parseInt($('.ideal_weight_graph').data('ideal1'));//46 
    var bw2 = parseInt($('.ideal_weight_graph').data('ideal2'));//62 
    var bw = parseInt($('.ideal_weight_graph').data('weight'));//53 

    var bw3 = bw2 + bw1; 

    var fusioncharts = new FusionCharts({ 
     type : 'angulargauge', 
     renderAt : 'ideal_weight_graph', 
     width : '400', 
     height : '250', 
     dataFormat : 'json', 
     dataSource : { 
      "chart" : { 
       "caption" : "Your weight for your gender and age", 
       "lowerLimit" : 0, 
       "upperLimit" : bw3, 
       "lowerLimitDisplay" : "Under weight", 
       "middleLimitDisplay" : "Normal weight", 
       "upperLimitDisplay" : "Over weight", 
       "showValue" : "1", 
       "valueBelowPivot" : "1", 
       "theme" : "fint", 
       showGaugeBorder : "1" 
      }, 
      "colorRange" : { 
       "color" : [{ 
        "minValue" : 0, 
        "maxValue" : bw1, 
        "code" : "#e44a00" 
       }, { 
        "minValue" : bw1, 
        "maxValue" : bw2, 
        "code" : "#00CC00" 
       }, { 
        "minValue" : bw2, 
        "maxValue" : bw3, 
        "code" : "#f8bd19" 
       }] 
      }, 
      "dials" : { 
       "dial" : [{ 
        "value" : bw 
       }] 
      } 
     } 
    }); 
    fusioncharts.render(); 

Answer 1

@Shanthi Вы можете достичь ваши требования, используя Функция «трендовых точек» A ngular Gauge of FusionCharts.

Here является рабочим образцом для вашего требования.

<!-- A simple angular gauge showing customer satisfaction index for Harry's Supermart. 

Elements : 
1. Color Range (Radial scale) 
2. Dials (Data Value Indicators) 
3. Tick Marks & Values 
4. Tooltip 
5. Trend points, trend arcs & trend markers 
6. Annotations 

--> 
<div id="chart-container">FusionCharts will render here</div> 

Сообщите нам, если у вас есть дополнительные вопросы.