ASP.NET MVC Controls | ComponentOne
Client- Side API Reference / Gauge
In This Topic
    Gauge
    In This Topic

    All controls in ASP.NET MVC Edition are optimized for client-side web development.

    You can access Gauge control on client-side with the help of wijmo.Control.getControl() method. Add the script that accesses the control after the control declaration. Use the control's Id to create its jQuery selector and use the client-side API.

    The following code sample demonstrates how to access a Gauge on client-side.

    Client-Side Access
    Copy Code
    @(Html.C1().LinearGauge()
        .Id("lgauge")
        .Width(500)
        .Height(100)
        .Value(35)
        .Thickness(0.1)
        .Min(0).Max(100)
    
    .Direction(GaugeDirection.Right)
            // Create and Customize Ranges
             .Ranges(items => items
                .Add(item => item.Min(0).Max(40).Color(System.Drawing.Color.Red))
                .Add(item => item.Min(40).Max(80).Color(System.Drawing.Color.Yellow))
                .Add(item => item.Min(80).Max(100).Color(System.Drawing.Color.Green))
            )
    )
    <script>
        var gauge;
        c1.mvc.Utils.documentReady(function ()
        {
            gauge = wijmo.Control.getControl('#lgauge');
        });
    </script>
    

    See Wijmo Gauge API Documentation for more information.