Add Custom Buttons
Include options to set up custom buttons with call-backs to perform certain functionality.
For example, I would love to be able to have a button next to the current print and export buttons that would be used for help/information about the chart.
Here’s how you do that: http://jsfiddle.net/highcharts/2F4pJ/.
It has always been around, but perhaps we need to document this more clearly.
-
Marie commented
Hello,
I want to add small image before some of my custom menuItems. Is there a way how to do it? I tried adding property symbol but it does not work. If there is no way how to do it now, please can you add this feature?menuItems: [{
text: something,
onclick: somefunction,
symbol: 'some url'}]
Thank you very much
-
charlie commented
Quick related idea. Highcharts should align buttons in a responsive way. When you add, for example, buttons like maximize, export, options, etc. and you have a long title, buttons are not clickable as they are behind Title.
A possible workaround is to enable HTML option in Title, set width to 50% and align to left, But is not a desirable solution, only a workaround.
A "toolbox" section could be interesting, allowing to align buttons vertical and horizontally, left and rigth sided, but always, wrapped around and floated from other elements. Maybe just before the title at the top of the canvas, the bottom after legend if exists...
Thank you very much.
-
ankush gupta commented
Thanks, this helped a lot.
-
stepday commented
Thinks for your Demo. Here's how you do that: http://www.stepday.com/topic/?922
-
dcw commented
Wow, super-fast bugfix - thanks!
There is just one thing left:
Click on exportButton -> its menuItems get displayed.
But if you now try to click the customButton, there is no mouseover/highlight effect and you cannot really click the button. You have to move your mouse inside the graph - in order to menuItems do disappear - and then you are able to click on customButton. -
@dcw:
This was a bug. See https://github.com/highslide-software/highcharts.com/commit/d517aa99b9f14560f0641ed6c3193a11878d25fc for the fix.
-
dcw commented
It does work for onclick-Actions - but not for menuItems.
If you expand the menu of "customButton" and then expand the menu from "exportButton", it will show the menuItems of "customButton".
-
Anonymous commented
I have added a help button to some of my Highcharts following the fiddle above. One thing that would be useful to me is the ability to do limited formatting of the associated text, such as defining a line break. See the following forum thread: http://highslide.com/forum/viewtopic.php?f=9&t=22388
-
Derick commented
Anyone found a way to do this yet? I need a custom button for zooming.
-
Jim commented
An option for displaying a help button would be nice. I think covering general functions like clicking series labels in the legend to show/hide would help people.
-
peter commented
buttons having id and buttons with names instead of symbols