Tooltip template in TypeScript Heatmap chart control

You can show a tooltip as a table using the template property in tooltipSettings.

The following steps describe how to show the table tooltip.

Step 1:

Initialize the tooltip template div as shown in the following html page.

<script id="tooltipTemplate" type="text/x-template">
    <div id='templateWrap'>
        <table style="width:100%;  border: 1px solid black;">
        <tr><td bgcolor="#00FFFF">${xValue}:</td><td bgcolor="#00FFFF">${yValue}</td><td bgcolor="#00FFFF">${value}</td></tr>
        </table>
    </div>
</script>

Step 2:

Set the element id to the template property in tooltipSettings to show the tooltip template.