score:2
By pure coincidence i happened to come across this resource.
Add this code to your js script and it fixes the issues with clicking on mobile devices!! After adding this the iPad browser reacted to clicks on canvas and tooltips as expected.
score:0
Simply useHTML not enough.
tooltip: {
useHTML: true,
style: {
pointerEvents: 'auto'
}
},
score:2
You can catch click event on the point and load url link.
data : [{
x : Date.UTC(2011, 3, 25),
title : 'H',
url: 'http://www.google.com',
text : 'google'
}],
point:{
events:{
click: function(){
var url = this.url;
window.open(url,'_blank');
}
},
},
See the example: http://jsfiddle.net/PLUpR/3/
score:2
Like Sebastian Bochan mentioned, it seems like a Safari issue, rather a security issue in general, that won't allow opening of windows using javascript. The request to open a new window needs to be user initiated like clicking of a link, and not through a javascript code block;
Although you have set the text to
<a href="http://www.google.com"> google </a>
Highcharts generates SVG spans for the links in the tooltip, and this spans have an onclick handler that opens a window. See below the default html/svg generated for the flag tooltip
<text x="8" y="21" zIndex="1" style="font-size:12px;color:#333333;width:200px;fill:#333333;">
<tspan style="font-size: 10px" x="8">Monday, Apr 25, 2011</tspan>
<tspan onclick="location.href="http://www.google.com"" x="8" dy="16" style="cursor: pointer;"> google </tspan>
</text>
Safari would disallow onclick="location.href="http://www.google.com""
Luckily, Highcharts allows you to skip the SVG, and use direct html in your tooltip. All you need to do is set tooltip.useHTML to true, which is by default false. Voila, the following HTML is now generated for the tooltip, and I believe Safari would not have issues with this, thought I have not been able to try this myself
<div class="highcharts-tooltip" style="position: absolute; left: 912px; top: 70px; visibility: visible;">
<span style="position: absolute; white-space: nowrap; font-family: 'Lucida Grande', 'Lucida Sans Unicode', Verdana, Arial, Helvetica, sans-serif; font-size: 12px; color: rgb(51, 51, 51); margin-left: 0px; margin-top: 0px; left: 8px; top: 8px;" zindex="1">
<span style="font-size: 10px">Sunday, Mar 24, 18:34:45</span><br>
<a href="http://www.google.com"> google </a><br>
</span>
</div>
Source: stackoverflow.com
Related Query
- Link inside of a Highcharts tooltip
- Highcharts - How to display legend symbol inside the tooltip
- Clickable link in tooltip of Highcharts
- Compare two data points inside the tooltip in a Highcharts combination chart
- How to edit tooltip in Highcharts C# code
- how to use highcharts tooltip formatter in python code
- how to add onclick event handler inside highcharts tooltip
- Highcharts complex tooltip formatting issue with embedded html link
- Highstock - insert HTML link inside flag tooltip
- Add clickable link to tooltip in Highcharts Scatter Plot
- how do i link my sqlite(PDO) databse data to highcharts code
- Position a Pie Chart inside a Highcharts Stockchart Tooltip
- Highcharts - Pie Chart - link in tooltip
- Disable highcharts tooltip on certain lines, leave it enabled on others?
- Customize tooltip and format the number to 2 decimal places of highcharts
- Highcharts tooltip overflow is hidden
- customize highcharts tooltip to show datetime
- highcharts pass multiple values to tooltip
- Disable tooltip on certain points in Highcharts
- Displaying percentage inside pie item for highcharts
- Highcharts tooltip always on right side of cursor
- Highcharts tooltip formatter
- Format tooltip numbers in Highcharts
- Weird character in front of Highcharts tooltip series names
- Display tooltip for invisible series in Highcharts
- Change Highcharts tooltip formatter from chart Object , after chart is rendered
- Highcharts does not resize charts inside tabs
- Adding thousands separator for custom formatted highcharts tooltip
- Highcharts - labels inside and outside a pie chart
- highcharts tooltip z-index
More Query from same tag
- Highchart not displaying with svelte
- Dynamic xAxis Highcharts
- Custom field name in ECharts
- Is it possible use size (z) argument with RHighcharter and a categorical Y-axis?
- Draw something under highstock chart navigator
- Area Stacked linewidth
- Add additional data to a Highcharts series for use in formatters
- Highcharts showing points on hovering over the line which are outside the chart area when the chart is zoomed in
- How to create equal width solidgauge for any number of series?
- change highstock flag to lines on xAxis
- new Highcharts.Chart creating trouble. Why?
- High chart export not working in android webview
- HighCharts : Highlight entire series when hover and restore state when out
- Highcharts set slice size of pie chart
- HighCharts is not defined
- Dojo + Highcharts: showAxes property moves the x and y axis
- Why is the first label on highcharts bar chart missing?
- highcharts value doesn't fit container
- Highmaps - how to draw two mabBubble series on one chart
- How to use json data as highcharts Pie Chart?
- Highcharts - Incorrect tooltip position when zoomed in
- High Charts export-server not rending legend LabelFormatter
- Highcharts Backgroundimage for bar graph
- How can I show a highstock graph with a linear timeline
- Scrollbar is not working with Dumbell Chart in Highchart
- How-to Dynamic update a chart via socket.io and slide chart view as a sliding window?
- Renderer Bring to front highcharts
- Synchronise 3 Highcharts Trend Views
- Highcharts - Adding a point with addPoint stretches time
- Enormous data and PHP errors