BulletGraph

BulletGraph

Styling

In this example, we added the "custom-gauge" CSS class to the BulletGraph, 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 BulletGraph, 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 BulletGraphController : Controller 
    { 
        public ActionResult Styling() 
        { 
            return View(); 
        } 
    } 
} 

@section Styles{ 
<style> 
.custom-gauge .wj-pointer path{ 
  fill: #ffa500; 
  stroke: #cd853f; 
} 
</style> 
} 
<c1-bullet-graph min="0" max="10" good="3" bad="4" value="5" target="6" class="custom-gauge" width="500px"> 
</c1-bullet-graph> 
  
@section Description{ 
    @Html.Raw(BulletGraphRes.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