This is a migrated thread and some comments may be shown as answers.

kendo-chart format values as currency

5 Answers 981 Views
Charts
This is a migrated thread and some comments may be shown as answers.
Jimmy
Top achievements
Rank 1
Jimmy asked on 23 Nov 2020, 05:49 PM

     I am using the kendo-chart to display charts in my application.  I need to format the values on the chart to currency.  I have tried to use the format option on the kendo-chart-series-item but that did not work.

 

                <kendo-chart [title]="{ text: selectedCommentDriver?.driverTypeText  + ' Chart' }"  *ngIf="selectedCommentDriver?.driverType === 1">
                    <kendo-chart-series >
                        <kendo-chart-series-item type="column" [data]="(ChartData$ | async) ?.acuityChartData" field="nprImpact"  categoryField="chartLabelText" [labels]="seriesLabels" >
                        </kendo-chart-series-item>
                    </kendo-chart-series>
                    <kendo-chart-category-axis>
                        <kendo-chart-category-axis-item>
                        <kendo-chart-category-axis-item-labels [position]="'end'"></kendo-chart-category-axis-item-labels>
                        </kendo-chart-category-axis-item>
                    </kendo-chart-category-axis>
                </kendo-chart>

 

Here is a sample of the bar chart with sample data of 100000.  I would like these values to be $100,000.00

 

Thank you for the help,

Jimmy

5 Answers, 1 is accepted

Sort by
0
Svet
Telerik team
answered on 25 Nov 2020, 10:30 AM

Hi Jimmy,

Setting the [format] property of the kendo-chart-category-axis-item-labels component to 'c' formats the labels as currency:

      <kendo-chart-category-axis>
        <kendo-chart-category-axis-item>
          <kendo-chart-category-axis-item-labels
            [position]="'end'"
            [format]="'c'"
          ></kendo-chart-category-axis-item-labels>
        </kendo-chart-category-axis-item>
      </kendo-chart-category-axis>

I hope this helps.

Regards,
Svetlin
Progress Telerik

Virtual Classroom, the free self-paced technical training that gets you up to speed with Telerik and Kendo UI products quickly just got a fresh new look + new and improved content including a brand new Blazor course! Check it out at https://learn.telerik.com/.

0
Jimmy
Top achievements
Rank 1
answered on 01 Dec 2020, 02:26 PM
That worked, thank you...
0
Jimmy
Top achievements
Rank 1
answered on 01 Dec 2020, 02:30 PM
Can you help me with one more thing?  I am trying to show positive numbers in green and negative numbers in green.  Is that possible?
0
Jimmy
Top achievements
Rank 1
answered on 01 Dec 2020, 02:55 PM
Can you help me with one more thing?  I am trying to show positive numbers in green and negative numbers in red.  Is that possible?
0
Jimmy
Top achievements
Rank 1
answered on 02 Dec 2020, 04:51 PM

I found an example which showed me exactly what I needed...

 

https://www.telerik.com/forums/set-kendo-chart-series-item-color

 

Tags
Charts
Asked by
Jimmy
Top achievements
Rank 1
Answers by
Svet
Telerik team
Jimmy
Top achievements
Rank 1
Share this question
or