0

我正在努力让 Highcharts 条形图随 Ajax 调用动态变化。我想我真的很接近解决它，但它没有显示，我没有看到问题。我相信我可以像在 setInterval 函数中那样更新积分。我希望有人可以关注它并给我建议......非常感谢

<!DOCTYPE HTML>
<html>
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title>Highcharts Example</title>

<script type="text/javascript" src="jquery-1.8.2.min.js"></script>
<script type="text/javascript">
<!--Ajax Function-->
var flag = 1;
var xmlhttp;
var url="http://mysite.com/web/ajax_info.txt";
//ajax call
function loadXMLDoc(url, cfunc){
   if(window.XMLHttpRequest){
      xmlhttp=new XMLHttpRequest();
   }
   else {
      xmlhttp=new ActiveObject("Microsoft.XMLHTTP");
   }
   xmlhttp.onreadystatechange=cfunc;
   xmlhttp.open("GET",url, true);
   xmlhttp.send();
}

function myFunction(){
   loadXMLDoc(url+'?_dc='+(new Date()).getTime(), function(){
      if(xmlhttp.readyState==4 && xmlhttp.status==200){
         flag = 1;
      }
   });
}

$(function () {
    var chart;
    $(document).ready(function() {
       chart = new Highcharts.Chart({
            chart: {
                renderTo: 'container',
                type: 'column'
            },
            title: {
                text: 'Active Tribble Sales'
            },
            subtitle: {
                text: 'Source: TribbleInternational.com'
            },
            xAxis: {
                categories: [
                    'Tribbles'
                ]
            },
            yAxis: {
                min: 0,
                title: {
                    text: 'Active Sales (%)'
                }
            },
            legend: {
                layout: 'vertical',
                backgroundColor: '#FFFFFF',
                align: 'left',
                verticalAlign: 'top',
                x: 100,
                y: 70,
                floating: true,
                shadow: true
            },
            tooltip: {
                formatter: function() {
                    return ''+
                        this.x +': '+ this.y +' mm';
                }
            },
            plotOptions: {
                column: {
                    pointPadding: 0.2,
                    borderWidth: 0
                }
            },
            series: [{
                   name: 'Good',
                   data: [80]

               }, {
                   name: 'Bad',
                   data: [1]
               }]
},

function(chart){
             setInterval(function() {
               myFunction();
               if(flag == 1){
                  var point = chart.series[0].points[0],
                  var point2 = chart.series[1].points[0],
                  newVal,
                  inc = Math.round((Math.random() - .5) * 20);

                  newVal = point.y + inc;
                  if (newVal < 0 || newVal > 100) {
                      newVal = point.y - inc;
                  }
                  point.update(newVal);
                  point2.update(1);
                }
                else{
               var point2 = chart.series[0].points[0],
                   var point = chart.series[1].points[0],
                   newVal,
               inc = Math.round((Math.random() - .5) * 20);

                   newVal = point2.y + inc;
                   if (newVal < 0 || newVal > 100) {
                      newVal = point2.y - inc;
                   }
               point2.update(newVal);
                   point.update(1);
               }
         flag = 0; //reset flag after point update. 
             }, 3000);
         }); 
});

</script>
    </head>
  <body>
<script src="highcharts.js"></script>

<div id="container" style="min-width: 300px; max-width: 300px; height: 400px; margin: 0 auto"></div>

</body>
</html>
4

1 回答 1

0

检查语法，即大括号正确闭合

至于我注意到

        series: [{
               name: 'Good',
               data: [80]

           }, {
               name: 'Bad',
               data: [1]
           }]

},

应该是 })
因为 // chart = new Highcharts.Chart({

和

          }
     flag = 0; //reset flag after point update. 
         }, 3000);
       // } is missing
     });

});

请检查一下

于 2013-03-21T11:54:58.910 回答