如何设置highcharts与select选项交互

<script src="https://code.highcharts.com/highcharts.js"></script>
<script src="https://code.highcharts.com/modules/exporting.js"></script>

<select id="chartSelect">
  <option value="data1">数据源1</option>
  <option value="data2">数据源2</option>
  <option value="data3">数据源3</option>
</select>

document.getElementById('chartSelect').addEventListener('change', function() {
  var selectedValue = this.value;
  
  // 根据选择的值更新图表数据
  // 例如，可以通过Ajax请求获取新的数据，并更新图表
  // 这里只是一个示例，具体实现根据实际需求进行
  var newData = getChartData(selectedValue);
  updateChart(newData);
});

var chart = Highcharts.chart('chartContainer', {
  // 图表的配置选项
  // 这里只是一个示例，具体配置根据实际需求进行
  title: {
    text: '图表标题'
  },
  series: [{
    type: 'line',
    data: [1, 2, 3, 4, 5]
  }]
});

function updateChart(newData) {
  chart.series[0].setData(newData);
}