Angular-ui.bootstrap tooltip over an imagemap area - angular-ui-bootstrap

I am trying to put a tooltip on an image map area, it looks like its not supported, is there a way of getting it there, too ?
In this plunker, the second kitten has a working image map, but no tooltip on it ...

To get a tooltip on your second image in your plunker demo you need to add a # to your usemap (usemap="#test")
and then add an href="#" to your area element.-7N

Related

highmaps/highcharts legend fixed in map

I using highmaps / highcharts, but I need to see the legends of each part of the map fixed. Something like it looks like in the image below. My need is to display the legend without requiring the user to hover over
enter image description here

Change bokeh python hovertool tooltip layout

Is there a way to change the layout of the hovertool's tooltips? I mean, bokeh shows the standard square with some information, close to the point and linked by a small triangle.. Is there a way to change this triangle and put a line that connects the tooltip to the point but at some distance (like an annotation), but dynamic as a hovertool tooltip?
Thanks for all!!
standard tooltip
New tooltip type
It is possible but it requires quite some work. You have to create a custom subclass of Tooltip that renders the tooltip the way you want and a custom subclass of HoverTool that uses that tooltip class.

Highcharts Get legend "icon" in tooltip

Is there any way to get the legend "icon" in tooltip? I need to show the legend "icon" in the tooltip so i can identify what series I'm referring to.
I'll try to explain it better.
When you create a chart, in the legend, next to the name of the series, there is a "mini" line, that represent the line of the series, the color, and the style.
That what I need to show in the tooltip.
I'm not referring to the dot marker but the small lines that appears in the legend.
Is that possible?
Edit:
I'm using the formatter that the tooltip api provides. There I have a reference of the point that I'm hovering on, and all the data associated to that point.
I can get the value, the chart, the series, the series to which it belongs, que point marker, almost everything.
But I can't figure how to get the little coloured line that appears next to every series name in the legend.
I guess is as simple as get one of the values that appears in the point data, but I don't know what I should look for, there are a lot of properties.
I found a solution.
You can look for the point.series.legendLine.
There you have all the info required for the legend svg, even you can get the outerHTML and paste directly to show the legend icon.

How to make the legend come in the image in highcharts?

How?
How to make the legend come in the image while exporting chart as png image?
Please refer JSFIDDLE.
Highcharts is designed for export only chart. If you want to export also elements outside the chart, you can use for example html2canvas. Take a look at the example posted below.
Example:
http://jsfiddle.net/h96daj1k/

How to display the range selection buttons in middle of the chart in highstock js?

I am using highstock js for stock chart. I want to display the range selection buttons in the center of the chart. Please find the snapshots below.
Currently the buttons are in left side of the chart.
Expected :
please help me how to do this in highstock js.
Thanks in Advance.
Please take look at the uservoice topic http://highcharts.uservoice.com/forums/55896-general/suggestions/2436599-add-ability-to-change-rangeselector-position
Check the example from Jugal given in Sebastians link.
You can override the render prototype and manually adjust the position.
For example like this: (forked Jugals fiddle)
http://jsfiddle.net/SPhYd/
var leftPosition = this.chart.plotLeft+150,
topPosition = this.chart.plotTop-10

Resources