I have the chart code below that I would like to format so that the series names appear on the category axis as shown in the CaptureBugGood image, my chart currently appears as in CaptureBugBad image.
Is there a way to have two levels of category axis labels such as category and then series, if not how can I put just the series names on the category axis while maintaining the series colors etc.
<
kendo-chart
*
ngIf
=
"!(graphType=='Doughnut')"
>
<
kendo-chart-value-axis
>
<
kendo-chart-value-axis-item
*
ngFor
=
"let item of valueAxes"
[name]="item.name" [title]="{ text: item.title }"
[max]="item.max">
<
kendo-chart-value-axis-item-labels
[format]="item.format">
</
kendo-chart-value-axis-item-labels
>
</
kendo-chart-value-axis-item
>
</
kendo-chart-value-axis
>
<
kendo-chart-category-axis
>
<
kendo-chart-category-axis-item
[title]="xAxis_Label" [categories]="categories" [axisCrossingValue]="crossingValues">
</
kendo-chart-category-axis-item
>
</
kendo-chart-category-axis
>
<
kendo-chart-axis-defaults
>
<
kendo-chart-axis-defaults-labels
>
<!-- format="n0"-->
</
kendo-chart-axis-defaults-labels
>
</
kendo-chart-axis-defaults
>
<
kendo-chart-legend
[visible]="false"></
kendo-chart-legend
>
<
kendo-chart-series
>
<
kendo-chart-series-item
*
ngFor
=
"let series of model"
[name]="series.name"
[data]="series.data"
[categoryField]="series.category"
field
=
"value"
[stack]="series.stack"
[color]="series.color"
[type]="series.type"
[axis]="series.axis">
<
kendo-chart-series-item-tooltip
>
<
ng-template
let-value
=
"value"
let-category
=
"category"
>
<
span
[innerHTML]="series.dataLabel.replace('[value_1]', value.toLocaleString() ).replace('[year]', category ).replace('[series]', series.name ).replace('[#%]', ((value)*100).toFixed(1).toString() + '%') "></
span
>
</
ng-template
>
</
kendo-chart-series-item-tooltip
>
</
kendo-chart-series-item
>
</
kendo-chart-series
>
</
kendo-chart
>