Thanks for your contribution!
The key is setting useHTML to true: http://jsfiddle.net/highcharts/8FSp6/.
Here’s another approach, allowing true SVG images: http://jsfiddle.net/gh/get/jquery/1.7.2/highslide-software/highcharts.com/tree/master/samples/highcharts/studies/axis-label-images/. The advantage of using SVG is that these images willl be visible in the exported chart as well.
Hi Michael, I've updated the snippet to a more general approach that looks at the label's actual position. Now it also works with polar. You may want to adjust the exact positions though: http://jsfiddle.net/gh/get/library/pure/highcharts/highcharts/tree/master/samples/highcharts/studies/axis-label-images/
@sahba: It looks like the original fiddle got lost, so I created a new one. Let me know if you have any problems with it, we will keep the snippet updated.
Here’s a proposal for how you can extend Highcharts to draw a graphic for null points: http://jsfiddle.net/highcharts/FKSZ6/
I created this small plugin that allows a pie plugin to be aligned using the regular Highcharts alignment options (align, verticalAlign, x, y).
You still need the plugin.
@jxd Dynamic updating capabilities are now added, plese see the updated jsFiddle.
Updated the demo to work with Highcharts 3.0.
Sankey diagrams are planned for Highcharts 6. Here’s an early exploration into the subject: http://jsfiddle.net/gh/get/library/pure/highcharts/highcharts/tree/samples/highcharts/studies/sankey-diagram/.
@Francisco With a little fix it works: http://jsfiddle.net/6khnw1cd/
Thanks! Currently we don't have a structure for options on the nodes, but that's absolutely a good idea. Setting the column number for each node.
We are now working on a grid axis module, which will put the labels in intervals. See http://jsfiddle.net/highcharts/gfzs5/4/ .
There's no option for using the last date of the month, but you can create your own tickPositioner callback: http://api.highcharts.com/highcharts#xAxis.tickPositioner
With Highcharts 4.1.10, shipping soon, we added an option to sort treemap items. Which makes it possible to create marimekko charts based on the treemap series: http://jsfiddle.net/highcharts/h2np93k1/.
This is only a partial implementation, but it may at least serve as a starting point: http://jsfiddle.net/highcharts/75oucp3b/
The X axis in that study is not very good, I recommend using the treemap approach instead: http://jsfiddle.net/highcharts/h2np93k1/
@Hari This is why it is only a partial implementation - we haven't got the X axis to work. A rough hack could be to hard code the tick positions like this: http://jsfiddle.net/highcharts/75oucp3b/10/. For the stack values I don't have a solution, other than perhaps hide the Y axis values altogether and make the column values speak for them selves.
Posting a chart to Facebook would mean that we ad a backend to store the chart and to communicate with Facebook. Highcharts JS is a client side charting library, so this goes beyond its reach. It is up to the implementer to provide a backend for it.
Highcharts Cloud, however, has this capability. See http://cloud.highcharts.com.
We are now working on Teams in Highcharts Cloud. Besides that, as Highcharts JS concerns, it is still a client side library so share buttons is something that is beyond its scope.
@Howard I see. We are planning an option to do styling per Organization in a future release of the Highcharts Cloud.
Another option would be that you create your own chart page where the cloud chart runs in an iframe, and add share buttons that share your own page instead.
I wrote up a small plugin here that extends Highcharts to hold animation until the container is appeared. Requires the appear.js jQuery plugin: http://jsfiddle.net/highcharts/8YVUb/
Hi Elle, I'm afraid animation is generally disabled on the funnel chart, so we don't have a way of animating it on scrolling into view.
One possibility though is to write an animator function, for example by borrowing (and modifying) the one from geo maps: http://jsfiddle.net/qskthLe1/3/.
> Is it possible to make this an external JS file?
Of course, just take the contents of the plugin and put in a file. Make sure it is loaded after Highcharts and jQuery.
Sorry about that. I've updated the snippet so that it renders immediately when animation is not enabled, like in export.
I changed the snippet to wrap the render method rather than animate method. This seems more robust, and also works with bubbles. I added a bubble chart at the very bottom. See the updated demo.
... And here come the true gradients: http://jsfiddle.net/highcharts/sez1h3qu/
Still a bit of the transition can be seen.
Thanks for your request, this seems like an appealing visual feature. The problem with your current approach is that it adds a lot of series, which is both logically incorrect an also a performance problem.
I did some googling and also found that SVG doesn't support circular gradients like this. But we should be able to emulate it by chopping up the arcs in smaller arcs and applying a gradient to each. Six arcs (each 60 degrees) should be enough to achieve a seamless gradient.
I have to run now, but here's what I've got so far: http://jsfiddle.net/highcharts/td2v4u4z/63/
The fiddle uses more than six segments because I haven't had the time to add the actual gradients yet.
- Add gradients.
- Use fewer segments.
- Apply animation.
- Depending on how it looks when the gradient is applied, apply round line caps only to the first and last segment.
Check out this plugin: http://www.highcharts.com/plugin-registry/single/24/Indicators
SMA is simple moving average.
We will try to get custom bubble symbols implemented as a core feature as soon as possible. The Highcharts 5 architecture makes it a lot easier than it was with HC4. Here’s the progress so far: http://jsfiddle.net/highcharts/cbfh6mgy/
@Monte Shaffer, see http://jsfiddle.net/highcharts/cbfh6mgy/.
The big remaining problem now is that the "circle" symbol (default) is not actually a circle, but a rectangle with rounded corners. We have gotten away with that on scatter charts with small symbols, but the big bubbles are more revealing.
Sorry about that, see updated fiddle. I also fixed the animation thing. Animation doesn't work, but doesn't crash it either.
Currently the bubble series only supports circles. A workaround for you may be to use a scatter chart with individual marker sizes.
Note to self: To make bubbles behave like scatter in this regard, we need to
- Use Series.drawPoints instead of ColumnSeries.drawPoints
- Use individual radius
- Rewrite BubbleSeries.animate to use x, y, width and height.
- Use the markergroup to trace mouse events.
You can add a scatter series with image markers.
New experimantal implementation for Highcharts 4.1 is available at http://jsfiddle.net/gh/get/jquery/1.7.2/highslide-software/highcharts.com/tree/master/samples/highcharts/studies/alignthresholds/.
This implementation looks a the threshold on the primary axis (the one first defined), and aligns the threshold of any following axis to that of the primary axis.
It's not included in Highcharts yet. There are still an issue with how to handle cases when one of the axes' threshold is not in the scale: http://jsfiddle.net/highcharts/gkf9o1vh/.
Yes, it looks that way from the jsFiddle demo.
@Ronny It will not work with fixed tick positions, because we need to be able to modify the ticks in order to align the axes. Currently it only runs on the second axis. In order to make it run both ways, we need to do some restructuring and make the whole logic recursive, because when the first axis is handled, we don't know the extremes of the second one.
@Lukasz Currently you can't set both, as the alignThreshold plugin overwrites the alignTicks setting. But in general, if you use a smaller tickPixelInterval, the alignment gets better because it is easier to find an axis resolution that fits both data sets: http://jsfiddle.net/highcharts/y6pbqk6q/2/
It's still not perfect, as it disregards the tickPixelInterval setting.
For your solution about setting min and max explicitly. The docs explains why Highcharts adds padding to your setting: http://api.highcharts.com/highcharts#yAxis.min
@Luis Miguel: You need to supply a threshold. Lines don't have a threshold by default. http://jsfiddle.net/highcharts/jrXQe/5/
The difference is that line series don't have a threshold by default, so you need to threshold: 0 on the line series. I've fixed this in the plugin so when no threshold is given, 0 is assumed.
We appreciate the many votes - I'm afraid the train has left for 3.0, and we will have some catching up to do now before adding new features.
Word cloud is planned for Highcharts 6.
A Highcharts plugin would be appreciated! Following the series-point concept, I would expect each word to be a point with a name and a value. The points would be laid out inside the plot area.
Use the renderer object for text, including its .getBBox function.
I've set up a boilerplate for you, where I demonstrate rotation, text sizing and tooltip support. Now what's missing is the algorithm itself: http://jsfiddle.net/highcharts/espnodxm/
Thanks for the good idea! Implemented in https://github.com/highcharts/highcharts/commit/fa07d08fa93a52f3cf232fb83e089cc01093c889, it will be out with the next release. See live demo at http://jsfiddle.net/highcharts/j99skchd/2/.
Yes, we're going into regression testing phase now. It can be expected late this week or the next week.
Here’s a small drop-in snippets that stops tooltips from the mousemove event, and applies them to the click instead. Touch devices should be unaltered.
It works for me in Chrome - which browser are you using?
To work around that you can pass [e.point] to the refresh function, though it doesn't actually make the tooltip shared. It still relates only to the clicked point. http://jsfiddle.net/highcharts/8VTTH/29/
Thanks for reporting, I added a simple check for e's existance.
Currently there is no SVG element sitting behind the navigator that you can apply a style to. The closest thing you get is http://api.highcharts.com/highstock/navigator.maskInside.
Otherwise, you can create your own styled rectangle programmatically: http://jsfiddle.net/highcharts/Lm85088q/