Kendo UI for Angular
The Kendo UI for Angular Bullet Chart compares two related values against each other, represented by a horizontal bar and a vertical line. The component uses one value as a benchmark, such as total product sales for last year, and compares it to another numerical value, such as sales of the same product for this year, and relates them to a qualitative category, such as a regional breakdown, to add more context. It’s a great way to show progress towards a goal or performance against a reference line.
Through the Angular Bullet Chart API, you can add a SeriesLabelsComponent configuration component to display labels for the series.
You can populate the Angular Bullet Chart series with data from various source types, including numbers, arrays and objects (or models)—simply specify the fields you want to use during configuration.
The Angular Bullet Chart renders data in the Canvas (bitmap) and SVG (vector graphics) formats. SVG is the default format to ensure an always crips presentation of your data. When performance is the priority, you can easily switch to a canvas format through a single configuration option to ensure your chart will handle large data and real-time updates with no interruption.
You can export your Angular Bullet Chart to PDF, SVG, PNG and the Kendo UI drawing format. In scenarios where you need to change the image size or fit the chart to a paper size when exporting to PDF, the intuitive export method of the component will allow you to preserve the quality and rendering of the Chart in the output file.
Customize the series colors of the Kendo UI for Angular Bullet component with one of our predefined color sets, including Default (our own styling), Material (based on the Material Design guidelines), Bootstrap (resembles the Bootstrap styling) and Fluent (based on Microsoft Fluent UI). You can further customize any of the built-in themes or create a new theme to match your branding using Progress ThemeBuilder.
The Kendo UI for Angular Bullet Chart supports globalization and localization to ensure that the component can effectively support any application’s language and locale. You can also enable the right-to-left (RTL) rendering for languages that use right-to-left scripts.