HighStock | Page crashing when panning - crash

first of all, I'd like to point out that I already checked this SO Question and, sadly, it didn't solve my problem.
My issue is as follows:
I need to display charts with, sometimes, up to 5 times 100 000 points and for that I decided to use HighStock (it is not my only reason, but let's not get off topic already).
Everything works fine except for one (not so little) detail: if I try to click and drag on the chart with my mouse (for zooming or panning), the whole page crashes, or at least stops responding for 30+ seconds. And that is weird because I don't face this problem if I zoom/'pan' using the timeline below the chart.
Here is a JSFiddle showing what I mean (comment the line 40 in order to reproduce the issue).
chart: {
/* panning: false */
}
Because of that, I also tried using HighCharts and there I have no issue (other than the graph not looking as good... but that's because I almost didn't configure anything).
After doing some testing, I noticed that disabling the panning solves my problem.
chart: {
panning: false
}
But then, the only way to move/zoom the chart is by using the timeline which, even if it is not that big of a deal, can be annoying when using a phone (if you go in landscape mode in order to see more of the chart, because my website isn't just displaying a chart alone, it becomes kinda impractical).
tl;dr:
I have the solution but I'd like to know if it's a know issue, the solution, the reason for that behavior.
Should I mark my question as "I answer my own question" ?, in the end I'm still not sure why it it happening, all I know is a fix

Related

Ctrl+5F shows me the two different types of display

Attachment
I'm currently working on a website.
Attached is the part of the website that I can watch on my computer monitor.
Changed Display below is the what I want.
However, if I keep hitting 'ctrl+f5', the screen shows me either unchanged display or changed display.
I have no idea why it shows me two different types of screen.
As far as I know, 'ctrl+f5' deletes the cache and updates data but it is not for me.
Ridiculously, If I keep hitting 'f5', I can only have the changed display as I want.
I guess I have a problem on css because I get an error message: DevTools failed to load SourceMap: Could not load content for http://localhost:8090/asset/css/sub.css.map: HTTP error: status code 404, net::ERR_HTTP_RESPONSE_CODE_FAILURE.
Does anyone know the keys on this problem?
There's not enough info here for anyone to tell you how to fix your problem with any amount of certainty.
What do you mean by changed display? Just the website looking different? Or a different debug preview (like scaling your website down to a phone's screen size)?
If it looks different, that might just have to do with caching.
The difference between CTRL + F5 and just F5 is that CTRL + F5 doesn't use your browser's cache, instead fetching everything fresh from the server, whereas just F5 uses your browser's cache. Your browser generally keeps track of when it cached things and will automatically fetch data anew if the time of caching was too long ago.
The former generally takes longer to load, naturally, which might be why the website looks different, at least until everything has been loaded.
Other than that, CSS gets a little weird sometimes, applying styles in a weird order. This generally has to do with the order in which, and where in your HTML document you actually load your stylesheets. Generally, loading all of them in the head of the document is a good idea. Complete redefinitions of styles in separate stylesheets can get very weird, even if it should follow normal precedence (Thread on CSS precedence)
Though, again, you'll have to elaborate on your problem further, maybe provide some screenshots, for anyone to be able to definitively help you.

Adobe Animate/CreateJS - this.myMovieClip.stop(); not working - no error in console

I'm just getting started in Adobe Animate/CreateJS. I'm trying to control the timeline of a movie clip ("myMovieClip") on frame 1 on the main stage, preventing it from playing. According to the documentation, this should work:
this.myMovieClip.stop();
But it does not... the movie "myMovieClip" clip plays immediately on test in the browser, and I'm not getting any error love from the console. It's as if the above line of code wasn't even there.
This seems pretty basic. What am I missing? I ultimately want to stop all movie clips on the main timeline as well as a large group of nested ones. If there's a single command that does this, I'd love to hear about it.
I am fairly certain this is related to a bug in the Adobe Animate output that makes MovieClip timelines not immediately available.
You can get around this by forcing an update before you try to access the children:
this.gotoAndStop(0); // Forces update
this.myMovieClip.stop();
Hope that helps!

change the "slide" in processing.js

I'm doing a science assignment that simulates the effects of different volcanoes. The user inputs information and then taking that information, there is a display of the effects the volcano has. when I try to switch the 'slide' from the input page to the output page using a 'next' button, it won't work.
here is the code: https://www.khanacademy.org/computer-programming/volcano-sim/6659613043589120
as you can see, the rectangle does pop up, but the rest of the stuff from the input page doesn't go away. Please help.
(also this is not exactly processing.js. it's on a site called khan academy that uses a very close spin-off of processing.js)
I made a spin-off of your program. The slides work now and I cleared out the long and confusing logic. It's different, but if you look through it a bit you should be able to pick up what it's doing.
Hope you find it helpful. :) If you have any trouble with any of it, just post in the Tips and Thanks there.
https://www.khanacademy.org/computer-programming/total-rewrite-of-code-free-to-use/5501032388755456

Multiple UIWebView

Ok, so I am an extremely novice programmer. I know next to nothing (which is why I am asking you guys.) So, I built a tab bar application in xcode to run on my iPhone. (I used this turorial: http://fuelyourcoding.com/creating-a-tab-bar-application-using-storyboards-in-xcode-4-2/) Everything from that point of view works great, the tabs all go to the correct pages and I know how to add more pages if I want to. The problem that I am coming across is that I want a good amount of the tabs to be web views. The problem that I am facing is that I can get the first view controller to work (thanks to this tutorial: http://conecode.com/news/2011/05/ios-tutorial-creating-a-web-view-uiwebview/) but I have no idea how to get another one to do the same thing. I have googled and what I get is just a bunch of code that I have no idea where to put. Any help?

EasySlider 1.7 - IE9 breaks it by blocking scripts

I've been playing around with EasySlider and everything was working perfectly - until I viewed my site in IE9.
Instead of displaying the slider with 3 images sliding across, it displayed all 3 images sat one underneath the other, and a message at the bottom of the screen saying that scripts etc had been blocked and did I want to allow blocked content.
As I was using this in the hear of my website it pushed my whole site down the page and just looked stupid with the 3 banners on top of each other.
I realise I can get rid of this by unblocking the content, but that's not the point. I think this is the default security settings for IE so everyone that visits my site will see it like this for the first time (or everytime if they don't unblock the content).
So is there a way around this? Or at least a way that if the script is blocked only the first image is shown instead of all of them? This seems a pretty big flaw!
I had the same issue as you and found a very simple solution for it using CSS. All you need to do is copy and paste the line of CSS code below onto the screen.css stylesheet that came with the EasySlider 1.7 Plugin. I hope this helps.
#slider {
position:relative;
}
I found this solution at the "ClickNathan Handmade Websites".