LinearGauge

LinearGauge

Styling

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

Features

Sample SourceDocumentation

Description

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

StylingController.cs Styling.cshtml

using Microsoft.AspNetCore.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> 
} 
  
<c1-linear-gauge min="0" max="10" value="5" class="custom-gauge" width="500px"> 
</c1-linear-gauge> 
  
@section Description{ 
    @Html.Raw(LinearGaugeRes.Styling_Text0) 
}

New Controls >

Popular Controls >

Data Management >

Data Visualization >

Navigation and Layout >

Document >

Scheduling >

Input and Editing >

Tutorials >

New Features >

Getting Started Guides >

Sample Applications >

Data Management

Data Visualization

Navigation and Layout

Document

Scheduling

Input and Editing

Tutorials

New Features

Getting Started Guides

Sample Applications

Styling

Features

Description