Adding images to tooltips in Highmaps - highcharts

Question

How can I a display an image (small icon) in a tooltip within Highmaps?
I know this question has been asked before - here - but damned if I can get it to work. I even wonder if it is possible, because as far as I can see in their API docs, the Highmaps support for HTML is limited, as eg here and does not include the img tag.
I have create a jsfiddle here with some sample icons. I'd be grateful if someone could demo how to add these to the tooltips (one per tooltip, of course)
$('#container').highcharts('Map', {
title: {
"text": "Simple Map"
},
series: [
{
"name": "Colours",
"type": "map",
"tooltip": {
"headerFormat": "",
"pointFormat": "{point.name}"
},
"data": [
{
"name": "Blue<br>violets",
"path": "M0,-994L204,-994L203,-480,0,-477z"
},
{
"name": "Yellow<br>is the colour of...",
"path": "M204,-994L455,-994L457,-477,203,-480z"
},
{
"name": "Red<br>sky at night",
"path": "M455,-994,697,-991,700,-481,457,-477z"
},
{
"name": "Green<br>grass",
"path": "M697,-991,998,-992,1000,-480,700,-481z"
}
]
}
]
});

Answer 1

You need to enable the useHTML parameter and link a displayed picture with a point, for example:
series: [{
...,
"data": [{
...,
tooltipImg: 'left'
},
{
...,
tooltipImg: 'right'
},
...
]
}],
tooltip: {
useHTML: true,
formatter: function() {
return this.point.name +
'<br><img src="http://icons.iconarchive.com/icons/saki/nuoveXT/128/Small-arrow-' +
this.point.tooltipImg + '-icon.png" width="32" height="32">'
}
}
Live demo: https://jsfiddle.net/BlackLabel/9bujq56y/
API Reference: https://api.highcharts.com/highmaps/tooltip.useHTML