I am using High Stock Chart I read the API documentation which says if you do inputEnabled:true than you can select date range from same.
I tried same: JS FIDDLE LINK
rangeSelector: {
selected: 1,
inputEnabled:true
}
Its Working only after when I click several times in container div.
Its not working first time I am coming and selecting it.
Is there a way I can make it smooth as given in high chart demo link
high stock demo link
Happening for older version of firefox
Related
I am using HighCharts and when I type the xAxis categories with long name the text get mixed up as the 2 words mixed with each other as you see in the link:-
https://jsfiddle.net/Abdelrahmanlifestyle/zjubcLgx/8/
and the shown is
فواتيراء الكهرب
instead of
فواتير الكهرباء
It's not a High Charts bug, it's a Chrome bug. It works fine in Fire Fox. It's an old bug where it calculates the positions of <tspan>s of RTL text wrongly. As a workaround you can use HTML for labels on axis.
labels: {
useHTML: true
}
https://jsfiddle.net/zjubcLgx/15/
I'm looking for a way to indicate key dates on a highchart with a label eg Public Holiday. I can't find a way to add labeled guidelines or add an opened callout to a point? Help appreciated.
In Highstock you have series type called flags which is a opened callout (similar to Dygraphs annotation). This is probably the closest fit to the indicators you referred. See this JSFiddle example of how it looks. Note how this example uses the Highstock source file, but builds a Highcharts chart. See this documentation for official information.
In Highcharts you can highlight points, labels and value in a wide variety of ways. First of you can add data labels to your points, which renders text next to it. Secondly you can use plot lines to highlight certain values along an axis. See this JSFiddle example of how both of these options can be used.
Of course there are lots of ways to improve and build upon this out of the box functionality, but that is up to your specific demands and desires.
For a rails web application I need a timeline with on the top (stacked) bar charts and on the bottom single events that should be recognizably different using e.g. forms (squares, rhombus, circles) and colors.
It's also important that I get some kind of picture back in order to reuse it to build a pdf.
At the moment I do the bar chart part with google charts, but I can't find a way to do the events. Those could also be on a separate chart that I then align in html or the pdf.
have you ever try the highcharts.
Here is an example of time series with events made with amCharts: http://www.amcharts.com/stock-chart/stock-events/
You can have any number of graphs stacked on each other, if this is what you want to do.
Disclaimer: I am the author of amCharts.
Is this possible, in a clean manner? The 5 charts will all be displaying at once and the drilldown behavior will have to be ironed out, as to when one pie chart is clicked (drilled down into), the other ones' should drill down as well, given all the data is relative.
Has anyone gotten this deep into Highcharts and know if this is possible/how well it works speedwise?
Thanks.
I have several highcharts graphs set up and have recently noticed that I'm unable to click on legend entries to show/hide their associated series in Firefox. This works fine in Chrome and Safari so it seems like this is a browser-related issue.
I've noticed that the highcharts demoes do not have this problem, so it must be something I'm doing in my implementation but I'm having a very difficult time figuring it out. What is it that Firefox does differently that could cause this sort of problem with highcharts?
Point of interest: if I set the chart's useHtml parameter to true, the legend entries become clickable. This is not a solution however because it breaks a bunch of other stuff.
Thanks!
I had a similar problem, in which points in line graphs were not clickable in Firefox (but they were clickable in Chrome). Turned out that Firefox places the dataLabels on top of the graph points.
Solved it with:
plotOptions: {
series: {
dataLabels: {
zIndex: 2
See also:
http://api.highcharts.com/highcharts#plotOptions.series.dataLabels
I solved this problem, which happened for me in Firefox, Chrome, and Safari, but not in IE9.
I found out the problem is CSS related. My page has 2 "boxes"; left and right. My Vaadin pie chart is sitting on the right box. On the left box I have a html <H1> tag that has width overflow to the right box (width: 900px) which covers part of the pie chart. As a result some rectangular area is not clickable. This can easily be fixed by using the Firefox Firebug tool to inspect the CSS. I hope this saves you the hours I spent to install the latest vaadin chart library; debug the codes, etc.