jQuery Highcharts: change chart type using dropdow

2019-07-17 01:44发布

i'm trying to change the value of chart as following

<!doctype html>
<head>
<script>
var chart1; // globally available

$(document).ready(function() {
    var chart = 'pie'
    $("select").change(function(){
        chart = $('#chart').val();
        alert(chart);
    });

   chart1 = new Highcharts.Chart({
       chart: {
          renderTo: 'container',
          type: chart 
        },
        yAxis: {
           title: {
              text: 'Temprature'
           }
        },
        series: [{
           name: 'mach_1',
            data: [<?php 
            foreach($chart as $`row) {
            echo  $row['temp'].",";
            }
           ?>]
          }]
      });
});
</script>
</head>

<body>
  <div id="form">

    <label>Select a chart : </label>
    <select id="chart">
      <option>pie</option>
      <option>column</option>
    </select>

  </div>

  <div id="container"></div>

</body>
</html>

i know this will change the value of chart on select, but it doesn't change the chart itself. Any ideas?

1条回答
beautiful°
2楼-- · 2019-07-17 02:40
  1. Your original question was very difficult to read and interpret; some of stackoverflow's code editor tags were intertwined with the code you attempted to post. In the future, it may help to put an example of your code on jsfiddle.

  2. If I'm understanding the question correctly, you are looking to change the type of chart displayed. Show a pie chart of the data; now show a bar graph of the data; now show a line chart, etc.

  3. When you have a Highcharts question, it's a good bet someone else has asked that question before on the Highcharts forum. In your case, I think this is true: "Change chart type dynamically?" - http://highslide.com/forum/viewtopic.php?f=9&t=5501&p=26274&hilit=switch+chart+types#p26274

  4. In the Highcharts forum question linked above, Highcharts author Torstein Honsi answers the question and includes a fiddle you may find to be a useful starting point, as he's changing the chart type in it. http://jsfiddle.net/tccpT/ Later on, a Highcharts support team member includes a fiddle where we see another example of changing the chart type. http://jsfiddle.net/2hLr5/

  5. When a pie chart involves more than two pieces of data, it is generally advisable to not use a pie chart as a means of visualizing data. The more values a pie chart has, the more difficult it becomes to perceive the relationships between those pieces of data.

查看更多
登录 后发表回答