Quantcast
Channel: Active questions tagged javascript - Stack Overflow
Viewing all articles
Browse latest Browse all 140817

Chart update everytime on Loading second array : Highcharts, Javascript

$
0
0

So, What I have is a condition in a MySQL to show the first 1000 data points first and then the other 2000 datapoints after that in Highcharts.

if lastindex==0:
            cur.execute("SELECT data,value FROM table where id<1001")
        else:
            cur.execute("SELECT data,value FROM table where id>1001 and id<3000")
        data = cur.fetchall()  
//python Code to fetch SQL data

Now what I am doing is that I am rendering that data into the Highcharts, the data is being rendered. but the problem arises that after showing the first 1000 data points, the Highcharts value starts from 0 and then shows the other 2000 points

the data is not displaying continuously as it should plot the send array data just after the end of the first data.

I think the Highcharts is being called Twice, What can I do to append the 2nd set of data to the first set without reloading the whole chart.

Here's a snip of my Highchart's js

Highcharts.chart("chartcontainer", {
                chart: {
                    type: 'line',
                    animation: Highcharts.svg, // don't animate in old IE
                    marginRight: 10,
                    events: {
                        load: function() {

                            var series = this.series[0],
                                chart = this;

                            setInterval(function() {

                      //some logic regarding the chart
                       //..
                        v = {
                                                y: y,
                                                x: x
                                            };

                    console.log("V value", v);
                    series.addSeries(v, false, true);
                    counter++;
                    localcounter++;                                 
                }   else
                {

                    oldcounter=counter;
                    flagToreload=1;
                                    }
                            }, 1000/130);

                            setInterval(function() {
                                chart.redraw(false);
                            }, 100);
                        }
                    }
                },

                time: {
                    useUTC: false
                },

                title: {
                    text: 'Live random data'
                },
                xAxis: {

                    type: 'Value',

                    gridLineWidth: 1

                },
                yAxis: {
                    title: {
                        text: 'Value'
                    },
                    plotLines: [{
                        value: 0,
                        width: 1,
                        color: '#808080'
                    }],
                    gridLineWidth: 1
                },
                tooltip: {
                    headerFormat: '<b>{series.name}</b><br/>',
                    pointFormat: '{point.x:%Y-%m-%d %H:%M:%S}<br/>{point.y:.2f}'
                },
                exporting: {
                    enabled: false
                },
                series: [{
                    animation: false,
                    name: 'Random data',
                    data: (function() {
                        // generate an array of random data
                        var data = [],
                            time = counter,
                            i;

                        for (i = -1000; i <= 0; i += 1) {
                            data.push([
                                counter,
                                null
                        ]);


                        }
                        return data;
                    }())
                }]
            });

What I want is just to append the event data rather than loading the whole chart.

How can I reload a particular Highchart value without reloading the whole chart ?


Viewing all articles
Browse latest Browse all 140817

Latest Images

Trending Articles



Latest Images

<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>