Highcharts title as link giving issue in print version - highcharts

I have highcharts donut and the title of the donut is defined as link through following code:
title: {
useHTML: true,
text: '< a href="mylink" >< u >My title< /u >< /a >',
}
this page has a print button to have a the donuts in pdf but whne I press print it is showing follwoing for title
My title (mylink)
I do not want (mylink) with my title and this happens only in print view. How can I get rid of this?

Related

How can I add a link to a Highcharts series name in the legend?

I have a multi-series column chart in Highcharts with three series ("Western", "Eastern", and "Central"). Clicking the label of a series in the legend shows or hides the series. I'd like to add a little link at the end of each label with a link to download details about the underlying data for that series.
So a label would look like: Western (details)
I tried simply adding an <A> link to the "name" of the series, and the link appears, but clicking on it doesn't open the link. Instead, it merely toggles the series display as before. I guess the "onClick" event for the label itself supersedes the <A> behavior.
Is there any way, without hacking Highcharts or creating a whole custom legend, to make a link in a series label functional? Maybe something with CSS to make the link jump out of its parent element?
Your idea is very good. You need to only call e.stopPropagation() after click on a link to prevent toggling series.
Highcharts.chart('container', {
series: [{
name: 'Series name <a id="seriesDetails" href="https://www.google.pl/">Details</a>',
...
}]
});
document.getElementById('seriesDetails').addEventListener('click', function(e) {
e.stopPropagation();
// prevent redirect
//e.preventDefault();
console.log('click');
});
Live demo: http://jsfiddle.net/BlackLabel/kaLrmjd7/
API Reference: https://api.highcharts.com/highcharts/series.line.name

multiple text colors in jQuery Tooltip

I'm trying to get some words in a jQuery tooltip text, another colour. Is this possible? I would like to give the words 'CONTROL PANEL BUTTON' another colour. I already give the tooltip a custom class. Can I for instance use two classes for different parts of the tooltip text?
Here's my script:
$("#ControlBTN").tooltip({
content: "CONTROL PANEL BUTTON<br><br>Click to show or hide the Fluid Control Panel.",
tooltipClass: "ui-tooltip_trans"
})

Highchart Bar table tooltip dissapears on hovering the tooltip

https://www.highcharts.com/demo/column-stacked
Highcharts is a JS API that allows you to easily generate bar charts. The above link shows a Highchart stacked column table. The bars show some information in a tooltip when you hover on them. Highchart allows us to control the delay of the tooltip with this JS parameter hideDelay: number but there is no such parameter to hold the tooltip when you hover on it.
What I want is to make the tooltip stay even when I hover on it. Tooltip only stays when I hover on the bars and disappears a few minutes after I take my cursor away from the bar.
Set plotOptions.series.column.stickyTracking to true.
plotOptions: {
column: {
stacking: 'normal',
stickyTracking: true
}
},
jsFiddle
API Reference: https://api.highcharts.com/highcharts/series.column.stickyTracking

Tooltip for jmesa cells?

How can I add tooltips for all cells in one column for instance? I'm using a jmesa table.
I need this because in the cells i've got text like this: 'this is the ...'. On hover I need to display a tooltip with the complete text.
Use a SPAN tag with a TITLE attribute to show the tooltip:
<jmesa:htmlColumn>
<span title='${bean.fullDescription}'>${bean.value}</span>
</jmesa:htmlColumn>

Disable tooltip on some elements even when title is defined

Is there a way not to show a tooltip when the title of an element is defined ?
Im using huddletogether's LightBox2 which takes whatever is in the anchor's title and converts into HTML.
http://www.huddletogether.com/projects/lightbox2/#support
Can I insert links in the caption?
Im calling a javascript function in that link and that tooltip shows this when the mouse hovers the image.
Click
Other option is to change return [anchor.href, anchor.title]; to something like return [anchor.href, anchor.aTitle]; as mentioned here.

Resources