Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

TypeError: d[h].update is not a function #8355

Closed
o3o opened this issue May 18, 2018 · 11 comments
Closed

TypeError: d[h].update is not a function #8355

o3o opened this issue May 18, 2018 · 11 comments
Labels

Comments

@o3o
Copy link

@o3o o3o commented May 18, 2018

When I call

// res is 
//[[[1508332985000, 2.983610],[1508332986000, 5.983610],[1508332987000, 8.983610],[1508332988000, 80.983610],[1508332989000, 7.983610]]]

function setSeries (id, res) {
  let c = chart[id];
  if (c && res !== null) {
    var seriesSize = Math.min(res.length, c.series.length);
    for (let i = 0; i < seriesSize; i++) {
      c.series[i].setData(res[i], false, false, true);
    }
    c.hideLoading();
    c.redraw(true);
  } else {
    console.log('setSeries: series is null');
  }
}

I have:

TypeError: d[h].update is not a function] highcharts.js:formatted:6939

Product version

6.1.0

Affected browser(s)

Firefox 60.0

Thank you

@sebastianbochan
Copy link
Contributor

@sebastianbochan sebastianbochan commented May 21, 2018

Hi @o3o,
Thank you for reporting. Could you replicate your example as live demo on the jsfiddle? It will allow us to debug it and find a fix.

Unfortunately from your piece of code its impossible at this moment.

@o3o
Copy link
Author

@o3o o3o commented May 21, 2018

Unfortunately from your piece of code its impossible at this moment.

You're right, but it's hard to replicate my code into jsfiddle, because it's complex (points are generated from a vibe.d application and passed by web socket)...I will try to simplify.
Thank you !

@mattjvincent
Copy link

@mattjvincent mattjvincent commented Jul 7, 2018

I have a similar situation where I get the same error with Highstock 6.1.0

highstock.src.js:26315 Uncaught TypeError: oldData[pointIndex].update is not a function
    at object.<anonymous> (highstock.src.js:26315)
    at Array.forEach (<anonymous>)
    at H.each (highstock.src.js:1730)
    at object.updateData (highstock.src.js:26292)
    at object.setData (highstock.src.js:26442)
    at updatePeaks ((index):984)
    at r.fn.init.user_mouseup_callback ((index):1191)
    at r.fn.init.notify_mouse_up_implicit (jquery.nstSlider.js:957)
    at HTMLDocument.drag_end_func (jquery.nstSlider.js:857)
    at HTMLDocument.dispatch (jquery-3.2.1.min.js:3)

What I have is a scatterplot with a threshold value as a slider. If the score is above the threshold value, I update the chart with the following code:

                $.each(allScores, function (index, element) {
                        if (element[2] >= thresholdValue) {
                            newData.push({
                                x: element[0], // x
                                y: element[1], // y
                                score: element[2],
                                user: element[3]
                            });
                        }
                    }
                });
            scatterPlot.series[0].setData(newData);

When debugging, I can see that when the error occurs,

 } else if (pointOptions !== options.data[pointIndex]) {
		                    oldData[pointIndex].update(
		                        pointOptions,
		                        false,
		                        null,
		                        false
		                    );

oldData[pointIndex] is an Object with attributes clientX, i, plotX, plotY, and x,
but when the error does not occur, oldData[pointIndex] is a Point with attributes of category, color, graphic, isInside, isNull, etc.

I'm not sure if that helps or not, but my code is complex and generated on the fly server side. I am using the boost module as well.

@mattjvincent
Copy link

@mattjvincent mattjvincent commented Jul 7, 2018

Here is a fiddle that will create the error.

Error Fiddle at http://jsfiddle.net/ebuTs/15502/

When updatePoints is set to true, the error occurs, false it will not.

        chart.series[0].setData([
                {x:129.9, y:40, user: 'joe'},
                {x:29.9, y:20, user: 'sue'},
                {x:49.9, y:30, user: 'moe'},
                {x:139.9, y:40, user: 'ned'},
                {x:19.9, y:20, user: 'ted'}
                ],
                true, // redraw
                false, // animation
                false); // updatePoints=true, error occurs
@sebastianbochan
Copy link
Contributor

@sebastianbochan sebastianbochan commented Jul 9, 2018

Hi @mattjvincent,
Thank you for the valuable demo. You are right its a bug and its related with boost module. Without that it works properly.

@hunguyen75
Copy link

@hunguyen75 hunguyen75 commented Aug 10, 2018

@sebastianbochan , thanks for the responses. I ran into similar issue like @mattjvincent. Any update on this bug at all?

@MidnightJava
Copy link

@MidnightJava MidnightJava commented Jul 18, 2019

I have the same problem. I'm not using boost. It throws the exception maybe every third time I click the legend to re-select a series, but it only happens if I call setData when the series is not visible. Is that a bug, or an expected constraint? I don't see anything in the API to that effect, and I need to update series that are not visible, because I'm streaming data over time and the user may select and de-select series while the data is streaming.

@pawelfus
Copy link
Contributor

@pawelfus pawelfus commented Jul 19, 2019

Hi @MidnightJava

It seems to be a different issue. Could you recreate this in jsFiddle and create a separate ticket? Thanks!

@MidnightJava
Copy link

@MidnightJava MidnightJava commented Jul 19, 2019

I forked mattjvincent's fiddle above and modified it to show my error. Here is my fiddle example.

However, in the fiddle, highcharts seems to be avoiding the problem by ignoring points passed in via Seris#setData if the series is not currently visible. I do this manually in my code, because highcharts does not do it (and I would like to have data points added while the series is not visible, if that is supported).

I'm mystified why my code is behaving differently than the fiddle. My code is running in a private network with no access to the highcharts cdn, so I installed highcharts with npm. I have the latest version (7.1.2) and that is the version that the fiddle uses via cdn. In the npm-installed code, I get highcarts via import HighCharts from 'highcharts/highcharts'. Is it possible that the npm HighCharts code is different than the cdn code for the same version? It seems like the cdn code was fixed to avoid (but not effectively work around) this problem, and the npm code was not.

My fiddle example creates two series with y-Axis type of datetime. It periodically adds data to each series at a series-unique x-value and progressing time values. Click one of the series to make it not visible. When you click again to make it visible, all the previous points are gone, but it starts plotting new points. In my npm-installed code, when I click the series to make it visible again, I get the exception d[h].update is not a function. The exception happens maybe every third time, so there is probably some race condition wrt the data being added.

So it's not only that the data added while the series is not visible is ignored, but the data added before the legend item was clicked is also lost. And this only happens with the cdn highcharts code, not the npm version. Unless there is a difference in my real code compared to the fiddle example that I missed. But I went through it carefully, and to the best of my knowledge both are doing effectively the same thing. My real code has data updating asynchronously from a message bus. I simulated that in the fiddle code with a 500 msec interval function. The real data comes in somewhat faster than that, but I changed the interval to 50 msec in the fiddle code and got the same behavior.

@MidnightJava
Copy link

@MidnightJava MidnightJava commented Jul 19, 2019

I switched to highcharts source code, and I got a more meaningful error message. It's trying to call update() on the data variable I passed to Series#setData in line 65 of my fiddle. So this helped me see where the bug is in my code. I didn't realize the variable orig_data which I retrieve from the series in line 62 of my fiddle example is an array of Point instances. I thought I could just append objects with x and y members. But it doesn't make sense to concatenate an array of such objects to an array of Point instances.

I think Series#setData is not the right method for my use case, i.e. adding data values to an existing series. I used Series#addPoint instead, and that works as I intended. Specifically, mySeries.addPoint([xval, yval], false) for each point to be added. This has an added benefit, since the third parameter (shift) can be used to remove a point at the other end of the series when a new point is added. I was going to periodically remove points to keep the chart within a certain rolling time window, but now I can just pass shift=true whenever the y-Axis range of values is equal to my desired time window.

@pawelfus
Copy link
Contributor

@pawelfus pawelfus commented Jul 22, 2019

Thanks @MidnightJava for all of the details!

Is it possible that the npm HighCharts code is different than the cdn code for the same version?

No, this shouldn't happen - both versions should be the same.

I used Series#addPoint instead, and that works as I intended.

Yes, in your case addPoint is recommended solution. Still setData() should work, but instead of passing instances of Point (series.data), you can use series.options.data. series.data is read only and may not contain all points, see more details: https://api.highcharts.com/class-reference/Highcharts.Series#data

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Linked pull requests

Successfully merging a pull request may close this issue.

None yet
6 participants