Here I have created dropdown for 2 labels and want its data to be swapped when selected from dropdown on x and y axis. I want the data to be swapped on both axis.
.html
<select class="dropdown" name="chartType" id="chartType" (change)="chartType($any($event.target).data)">
<option selected>Select Axis</option>
<option value="a1">IR</option>
<option value="a2">IY</option>
</select>
<div class = "chart" >
<canvas id="canvas"> {{charts}} </canvas>
</div>
.ts
chartType(type: any) {
if (this.charts) {
this.charts.destroy();
}
this.charts = new Chart('canvas', {
type: type,
data: {
labels: this.a2,
datasets: [{
label: 'IR',
data: this.a1,
borderWidth: 3,
backgroundColor: 'red',
borderColor: 'red'
},
{
label: 'IY',
data: this.a2,
borderWidth: 3,
backgroundColor: 'black',
borderColor: 'black'
}