ASP.NET MVC Controls - LinearGauge - Styling- C1 ASP.NET MVC

LinearGauge

Styling

In this example, we have added the "custom-gauge" CSS class to LinearGauge, and define CSS rules to create an orange pointer.

Features

Sample SourceDocumentation

Description

In this example, we have added the "custom-gauge" CSS class to LinearGauge, and define CSS rules to create an orange pointer.

StylingController.cs Styling.cshtml

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
 
namespace MvcExplorer.Controllers
{
    public partial class LinearGaugeController : Controller
    {
        public ActionResult Styling()
        {
            return View();
        }
    }
}

@section Styles{
<style>
.custom-gauge .wj-pointer path{
  fill: #ffa500;
  stroke: #cd853f;
}
</style>
}
 
@(Html.C1().LinearGauge()
    .Min(0).Max(10).Value(5)
    .Width(500).CssClass("custom-gauge")
)
 
@section Description{
    @Html.Raw(Resources.LinearGauge.Styling_Text0)
}

New Controls >

Popular Controls >

Data Management >

Data Visualization >

Navigation and Layout >

Scheduling >

Documents >

Input and Editing >

Tutorials >

New Features >

Getting Started Guides >

Sample Applications >

Data Management

Data Visualization

Navigation and Layout

Scheduling

Documents

Input and Editing

Tutorials

New Features

Getting Started Guides

Sample Applications

LinearGauge

Styling

Features

Description