HighCharts: subsequent chart erases previous chart


HighCharts: subsequent chart erases previous chart



I am having a problem of creating Highcharts dynamically - from asynchronous ajax calls: sometimes subsequent chart erases previous chart from a different container. This is the scenario:
1. From 6 to 8 charts are created simultaneously from ajax async data. Each chart is assigned to a dynamic array and destroys before rendering:


if (charts[chID] != null) {
charts[chID].destroy();
}



Then we create a chart:


charts[chID] = new Highcharts.Chart(chartOptions);



As I mentioned all these charts are created simultaneously from async ajax calls.
The problem is that some charts are missing after the first run; after that all charts are rendered properly. Debugging the code shows that the missing charts are actually created, but then erased by subsequent charts. The screenshots from Chrome dev. tools:
Three charts (4,5,6) are OK
Three charts (4,5,6) are OK



Then another chart (1) is added and erases chart 4:
chart (1) erases previously rendered chart (4)



These 'missing' charts happen quite irregularity - sometimes only one chart is missing, sometimes 2 or 3. Running the routine the second time always fixes the issue and all charts are rendered properly. I guess it is because the array charts is already created.



I tried skipping the chart destroy function, changing the chart array to object, initiating the array charts before, but nothing helped.



Note that the code doesn't generate any errors, no missing divs.



Any suggestions where to dig?



Thanks!





That sounds like renderTo (aka "container") is exactly the same for multiple chart - I would check that.
– Paweł Fus
Jun 29 at 11:36


renderTo





It was my initial thought also... but all containers are different and point to correct divs with unique IDs. Also, the second run always generates proper charts. The only difference between the 1st run and subsequent runs is that the charts array is empty. The 2nd run takes the created charts array from the 1st run, because charts is declared globally..
– user2723490
2 days ago





Ok, without live demo we can only guess what is wrong - please create one (e.g. jsfiddle or webpage). You mentioned: I tried skipping the chart destroy function (...) but nothing helped. - that suggests chart is there already, because Highcharts will destroy chart, if container already has one.
– Paweł Fus
2 days ago


I tried skipping the chart destroy function (...) but nothing helped.





Exactly, when debugging it step-by-step, I can see a correct chart rendered in div A and then erased after another chart is rendered in div B. I will try to create a demo, but it is difficult because of these async ajax calls to remote server. One more thing. I have the same code running correctly for years - the difference with this one is that the page is generated dynamically, but the old code used a loaded html file. I don't understand if it could affect it somehow, because all containers are already in place before rendering charts.
– user2723490
2 days ago





We can only guess.. Honestly, similar issues were reported before and in the end there was "aha! - duplicated container because of <<something>>". This something can be for example framework.
– Paweł Fus
2 days ago


<<something>>


something









By clicking "Post Your Answer", you acknowledge that you have read our updated terms of service, privacy policy and cookie policy, and that your continued use of the website is subject to these policies.

Comments

Post a Comment

Popular posts from this blog

paramiko-expect timeout is happening after executing the command

paramiko-expect timeout is happening after executing the command Can someone help me why timeout is happening after executing the command .I am trying to SSH to a machine and execute a command.I want to store the result of the executed command . I have referred paramiko-timeout but i didn't get my expected result. import traceback try: import paramiko except ImportError: raise Exception("Please install paramiko , pip install paramiko") import pexpect from paramiko_expect import SSHClientInteraction def main(): HOSTNAME = "minion5.net" USERNAME = "root" PASSWORD = "help@432" PROMPT = "root@*:~$s+" try: client = paramiko.SSHClient() client.load_system_host_keys() client.set_missing_host_key_policy(paramiko.AutoAddPolicy()) client.connect(hostname=HOSTNAME, username=USERNAME, password=PASSWORD) with SSHClientInteraction(client, timeout=20, display=True) as interact: ...
Read more

Opening a url is failing in Swift

Opening a url is failing in Swift breakpointing inside the callback and logging success shows false. I added itms-apps to my plist: LSApplicationQueriesSchemes and put this in my app delegate: func application(_ app: UIApplication, open url: URL, options: [UIApplicationOpenURLOptionsKey : Any] = [:]) -> Bool { return true } func moreTapped() { let url = NSURL(string: "itms-apps://itunes.com/developer/quantum-productions/id979315877") if #available(iOS 10.0, *) { UIApplication.shared.open(url! as URL, options: [:], completionHandler: {(success: Bool) in }) } else { UIApplication.shared.openURL(url! as URL) } } Are you testing on a real device? – rmaddy Jun 21 at 23:57 I try on a device, get "Cannot Connect to App Store". Device is online ...
Read more

Export result set on Dbeaver to CSV

Export result set on Dbeaver to CSV Normally I use Dbeaver for windows and always export my result set like this: run my query --> select the result --> export the result set --> select export to clipboard --> done This step by step puts my result set in my clipboard and I can paste it wherever I want to work with it. The problem is that now I am using dbeaver for mac and this guide is not working. I can go on until the moment that I select my result set like in the image below: exporting data set But once I go further in the process, in the last step I get: no query Note that in "source" it was suppose to show the query that originated the result set, but instead it says just "select. As a result it does't select my result or anything (besides being "successful"). Normally my query would show up there automatically and I couldn't find any option that corrects this problem in the menus. Please help me! Thanks. Aft...
Read more