function updateChartType(){
let selecionado = document.getElementById('chartValor').value;
document.getElementById('selecionado').innerHTML = selecionado;
if (document.getElementById('chartValor') != null)
if ( selecionado == 'data2' )
{
var ctx = document.getElementById('myChart').getContext('2d');
var chart = new Chart(ctx, {
// The type of chart we want to create
type: 'line',
// The data for our dataset
// here we destroy/delete the old or previous chart and redraw it again
data: {
labels: ['January', 'February', 'March', 'April', 'May', 'June', 'July'],
datasets: [{
label: 'My First dataset',
backgroundColor: 'rgb(255, 99, 132)',
borderColor: 'rgb(255, 99, 132)',
data: [0, 10, 5, 2, 20, 30, 45],
}]
},
// Configuration options go here
options: {}
});
}
else
{
if (document.getElementById('chartValor') != null)
var ctx = document.getElementById('myChart').getContext('2d');
var chart = new Chart(ctx, {
// The type of chart we want to create
type: 'line',
// The data for our dataset
// here we destroy/delete the old or previous chart and redraw it again
data: {
labels: ['January', 'February', 'March', 'April', 'May', 'June', 'July'],
datasets: [{
label: 'My First dataset',
backgroundColor: 'rgb(255, 99, 132)',
borderColor: 'rgb(255, 99, 132)',
data: [0, 10, 15, 12, 120, 130, 145],
}]
},
// Configuration options go here
options: {}
});
}
}
<script src="https://cdn.jsdelivr.net/npm/[email protected]"></script>
<head>
<title></title>
</head>
<body>
<canvas id="myChart"></canvas>
<select name="chartValor" id="chartValor" onchange="updateChartType()">
<option value="data">2018</option>
<option value="data2">2019</option>
</select>
Selecionado: <label id="selecionado">000</label>