I am attempting to use Highcharts in a web application for mobile, but I'm running into the issue of scrolling over the charts on mobile as has been previously noted, i.e. Scrolling over highcharts graph.
I tried including the script touch-tooltip-fix.js - https://gist.github.com/skarface/2994906
This however doesn't work for me, neither do the other similar scripts that I've found online that are supposed to solve the issue. I'm wondering if the issue is that I'm using jQuery UI touch-punch? I've tried modifying the script but haven't had any luck.
Basically my questions are is this fixed now? And if so is there a way I can get it to work with touch-punch (or is that even the issue)?
Related
I am currently using Highcharts JS v4.0.4 (2014-09-02) [yes, we need to upgrade] and I noticed that sometimes our charts do not load all the way. For instance, on loading a page, I see something like this:
But then I hover over the chart, and additional sections appear:
Is this a know issue with this version of Highcharts? I am curious to know if this is something that can be fixed in this version or if it is a known issue only fixed with an upgrade. I previously tried to upgrade to the latest version and it broke some of our charts, so we opted to wait, since we didn't need to upgrade, but now we have this issue.
Fairly recently I've been trying to make my own web based android app and have been going crazy trying to find a working drag to scroll JavaScript but surprise, surprise, turns out I didn't need it. Because as long as the overflow parameters are not set to hidden, I could drag-scroll like crazy.
I'm very new to this web to app thing so can anyone explain why and how this works? Because I can't seem to find the right key words to find a documentation for it.
This is because of a change on Android in the WebKit browser that was started in this issue:
https://bugs.webkit.org/show_bug.cgi?id=78664
The property was added in this revision.
Looking at the code you can see it's default value is touch on touch-enabled devices.
I am currently building a site. When I refresh the page (as seen below), the two boxes with the brown outline start out at what seems to be 100% width, but then they re-size after about 1-2 seconds, and there is a small gap on the right hand side.
I'm pretty sure this isn't happening via the CSS, as there is a delay and I've looked through it all myself and can't find anything.
I am using Google Chrome's Developer Tools - is there any way that I can view any related JavaScript being ran on refresh that may be affecting these elements?
You can use a chrome extension to quickly turn off javascript. If the problem dissappears, you know that javascript is causing the problem. If the problem is still there, then it is a CSS issue (which I think is the case, but we can't solve that for you as you didn't provide the code).
here is a link to the javascript switcher extension:
https://chrome.google.com/webstore/detail/quick-javascript-switcher/geddoclleiomckbhadiaipdggiiccfje
I have been looking for a Javascript based datagrid to use for Mobile websites/applications with no luck. I have tried jqGrid, which seemed to work fine except for the lack of kinetic scrolling. I know jqGrid does now have a (beta) mobile version, but unfortunately is is built upon jquery mobile, and I am using a different framework (which spat the dummy when I included the jqquery mobile scripts)
So, my question is, does anyone know of a Javascript grid that does support Kinetic scrolling (or know how to apply this to an existing grid)?
Would need this to not be reliant on any other UI framework (such as jquery mobile - nothing against this, I just happen to be using another one and it didn't seem to want to coexist)
If it supported knockout type of binding then even better!!! (I know this is expecting too much).
Any pointers would be greatly appreciated.
Thanks in advance for any info!
Kinetic scrolling is a built-in feature in Webix DataTable http://webix.com/widget/datatable.
The grid control processes all touch events without a hitch. It runs scrolling touch events especially well http://webix.com/blog/datatable-1000-columns-and-more/.
I know this is a really old question, but I just wanted to leave a note here as well if someone ends up here using the search.
You should check out , which is a top-notch Javascript grid component, and has kinetic scrolling on touch devices. It’s part of Vaadin Components: http://www.vaadin.com/components
I'm working on a prototype system which will act as a proof of concept that an existing system can be made a lot more interactive.
It basically emulates our main software package but over the internet using JSONP requests to update a load of images and Raphael vectors to make it look like everything's running.
I'm having trouble on Chrome however with Raphael not drawing vectors "off-screen". What I mean by "off-screen" is that the main app runs through an iframe as it relies on cross-domain long poll comet through AJAX to get communicate back and forth. Below is an image demonstrating what I mean.
Here I've scrolled a long a little bit in the iframe to look at the bits "offscreen" and you can hopefully see that the grey arrows aren't rendered. I've used Chrome's developer tools to highlight over the SVN tag, showing that it's only given 450px by 810px to the SVG tag, which is the same size allocated for the iframe.
It's worth pointing out that it renders fine in Firefox. Any ideas?
I've had a similar problem and found a bug report for the WebKit project that seemed related:
https://bugs.webkit.org/show_bug.cgi?id=64823
According to the comments, it's a bug in the rendering engine and there's no workaround aside from losing the iframe or resorting to other means of scrolling the SVG viewport (like moving all the elements within the SVG element).
On the upside, version 16.0.912.21 has been released to the beta channel today and it seems that the bug has been fixed. I've also checked the latest chromium build (17.something) and the bug hasn't resurfaced. I'm guessing the fix should find its way into the stable channel in a couple of weeks.