score:2
it is possible to use a shared tooltip and set prefixes, suffixes etc. You just have to think about the wording. Rather than use yprefix etc you use valuePrefix
You set it for each series in the data
series: [{
data: [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4],
type: 'column'
}, {
data: [216.4, 194.1, 95.6, 54.4, 29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5],
tooltip: {
valuePrefix: ' USD'
}}],
You can see a fiddle here showing it
score:2
You can specify a custom formatter for the chart's tooltip, and then a value suffix and any other options in the series tooltip, then reference those options in the chart's tooltip formatter function. E.g.:
$('XXXX').highcharts({
...
tooltip: {
formatter: function() {
var text = "";
$.each(this.points, function(index) {
text += '<br/><b>' + this.series.name + ":</b> "+ this.y+" "+this.series.tooltipOptions.valueSuffix;
});
return text;
},
shared: true
},
...
});
...
chart.addSeries({
...
tooltip: {
valueSuffix: ' '+seriesUnit,
valueDecimals:2
},
...
});
score:7
You can simple add a tooltip options to each serie.
You can see the options on the following link.
This way you don't have to format each serie's point.
series: [{
name: 'USD',
data: yourData,
tooltip: {
ySuffix: ' USD',
yDecimals: 4
}
}, {
name: 'EUR',
data: yourData,
tooltip: {
yPrefix: 'EUR ',
yDecimals: 1
}
}]
Reference:
Source: stackoverflow.com
Related Query
- Highcharts shared tooltip requires different valueSuffix and varying decimals
- Highcharts shared tooltip for line series and scatter plot not working
- Highcharts shared tooltip between charts with multiple series and shared tooltip
- React highchart: Shared tooltip in same and different chart
- HighCharts - different tooltip in "arearange" and "spline"?
- Different ToolTip text For Links and Nodes in Highcharts Sankey Charts
- Different tooltip and value in Treemap || Highcharts
- Highcharts - Can we have default and custom tooltip based on different chart types?
- Customize tooltip and format the number to 2 decimal places of highcharts
- Highcharts Pie Chart ignores percentageDecimals tooltip setting and has floating point inaccuracy issue
- Highcharts - How to hide series name and Y value in tooltip
- Highcharts - How to remove connecting line between fixed tooltip and point
- remove tooltip space between border and content highcharts
- Highcharts custom renderer chart and tooltip
- Highcharts - Global configuration with common code and unique data & Headings
- how to pass values to tooltip which not in x and y axis in highcharts
- Highcharts : Shared Tooltip for non-matching x values
- Highcharts - Tooltip and series name are out of their boxes in chrome
- How to get the highlighted point from shared tooltip formatter, Highcharts
- different tooltip than x-axis category text - highcharts
- Highcharts Tooltip formatting for shared Tooltips
- Tooltip in chart with line- and scatter plot in highcharts 3.0.7
- How to edit tooltip in Highcharts C# code
- Highcharts - Aligning dateTime series for shared tooltip
- highcharts and different yAxis for different categories
- Enable and disable Highcharts tooltip with drill menu
- how to use highcharts tooltip formatter in python code
- Highcharts gauge keep tooltip visible and centered
- Why does this Highcharts graph only show tooltip for the first and last nodes?
- Highcharts Columnrange data labels high and low different colors
More Query from same tag
- Is it possible to insert javascript charts into a JavaFX application
- Highchart sankey- Show multiple entries having same name independently
- Highcharts Treemap Tile Name Blocking Click
- Filter categories in highcharts by using checkboxes
- Highcharts Columnrange data labels high and low different colors
- how to get index of a point in Highcharts to use in an event?
- Possible to change the height inside the highchart drilldown?
- Highmaps call JavaScript function when region is clicked
- Displaying a Highchart Line Chart in Mapbox Marker Pop-up
- How to add a second series in highcharts
- How to make histogram from already aggregated data?
- How to add footer for each series stacked horizontal bars in highcharts?
- styling of particular segments in highchart axis
- set minimum and maximum values for axis' data in highchart
- How to change "defaultOptions" lang in highCharts dynamically
- How do I get the value of a highcharts graph point on mouseover?
- How add the straight line between bubbles in highchart
- How to completely disable the mouse/finger interaction for highcharts
- Highchart - Bell curve fill colour based on percentage
- Can Highcharts sort a legend list in a tooltip box?
- HighCharts Data Structure - Multiple Independent Series, Stacked Column Chart
- How to show xAxis categories up to the each chart in Bar-Highcharts library?
- Highchart Click Event
- Extend Highcharts Export
- Highstock: label the y-axis Maximum
- Is it possible in Vue JS to make several vue components reuse existing data structure with different data?
- Highchart Activity Gauge always display text in the center
- How could I change the x,y label and remove empty x bar
- Highcharts ColumnRange - Display time range on yAxsis instead of Date
- How to design a yAxis plotline with our own CSS?