jQuery UI Widgets Forums Gauges and Maps Gauges Set value using Json

This topic contains 1 reply, has 2 voices, and was last updated by  Dimitar 9 years, 10 months ago.

Viewing 2 posts - 1 through 2 (of 2 total)
  • Author
  • Set value using Json #57607

    LeoSquall
    Participant

    Hi,
    I have a problem that i don’t know to solve. I want to set the value of GaugeChart from an external file using json but i don’t know how to do it. Can someone help me please?

    This is the code of my Page .aspx :

    <script type=”text/javascript”>
    $(document).ready(function () {

    var labels = { visible: false, position: ‘inside’ };

    //———————————————–

    var dataAdapter = new $.jqx.dataAdapter(source,
    {
    //autoBind: true,
    //async: false,
    downloadComplete: function () { },
    loadComplete: function (cruscottoList) {
    var listvalue = cruscottoList[0];
    valore = listvalue.valore;
    },
    loadError: function () { }
    });
    //——————————————

    //Creazione del grafico
    $(‘#gauge’).jqxGauge({
    //Definizione dei range dei valori
    ranges: [{ startValue: 0, endValue: 140, style: { fill: ‘#00e600’, stroke: ‘#e2e2e2’ }, endWidth: 20, startWidth: 20 },
    { startValue: 140, endValue: 180, style: { fill: ‘#ffff00’, stroke: ‘#ffff00’ }, endWidth: 40, startWidth: 20 },
    { startValue: 180, endValue: 220, style: { fill: ‘#ff0000’, stroke: ‘#ff0000’ }, endWidth: 60, startWidth: 40 }
    ],
    cap: { radius: 1 },
    //inserimento dell’etichetta
    caption: { offset: [0, -20], value: ‘Gamma Ufficio’, position: ‘bottom’ },
    style: { stroke: ‘#ffffff’, ‘stroke-width’: ‘1px’, fill: ‘#ffffff’ },
    animationDuration: 1500,
    labels: labels,
    ticksMinor: { interval: 5, size: ‘5%’, visible: false },
    ticksMajor: { interval: 10, size: ‘9%’, visible: false }
    });

    //setto il valore dell’ago
    $(‘#gauge’).jqxGauge(‘setValue’, valore);
    });
    </script>

    and this is the code of my page .cs:

    using System;
    using System.Collections.Generic;
    using System.Linq;
    using System.Web;
    using System.Web.Mvc;

    namespace Abaconew1.Controllers
    {
    public class DashboardController : Controller
    {
    List<Gauge> gaugeList = new List<Gauge>();

    //costruttore DashoboardController con inizializzazione delle varie List
    public DashboardController()
    {
    gaugeList.Add(new Gauge(75));
    }
    }
    // GET: /Dashboard/
    public ActionResult Index()
    {
    return View(gaugeList);
    }
    //permette al alla view .aspx di prendere i dati creati e istanziati nella dashboard
    public JsonResult GetGauge()
    {
    return Json(gaugeList, JsonRequestBehavior.AllowGet);
    }

    public class Gauge
    {
    public int Value { get; set; }
    public Gauge(int value)
    {
    Value = value;
    }
    }
    }

    Set value using Json #57633

    Dimitar
    Participant

    Hello LeoSquall,

    We suggest you initialize the gauge, then load the data through data adapter. In its loadComplete callback function call:

    $(‘#gauge’).jqxGauge(‘setValue’, valore);

    Best Regards,
    Dimitar

    jQWidgets team
    http://www.jqwidgets.com/

Viewing 2 posts - 1 through 2 (of 2 total)

You must be logged in to reply to this topic.