Tooltip under transform scale

by kzoon

HTML

<script src="https://github.highcharts.com/master/highcharts.js"></script>

<div style="transform: scale(0.7);">
  <div id="container"></div>
</div>

JavaScript

(function(H) {
  H.wrap(H.Pointer.prototype, 'normalize', function (proceed, event, chartPosition) {
    var e = proceed.call(this, event, chartPosition);


    var element = this.chart.container;
    if (element && element.offsetWidth && element.offsetHeight) {

        var scaleX = element.getBoundingClientRect().width / element.offsetWidth;
        var scaleY = element.getBoundingClientRect().height / element.offsetHeight;
        if (scaleX !== 1) {
            e.chartX = parseInt(e.chartX / scaleX, 10);
        }
        if (scaleY !== 1) {
            e.chartY = parseInt(e.chartY / scaleY, 10);
        }

    }


    return e;
  });
}(Highcharts));

Highcharts.chart('container', {

         "chart": {
            "type": "line",

        },
  
        "tooltip": {
            "enabled": true,
            "outside": true
        },
        "plotOptions": {
            "line": {
                "animation": false,
                "shadow": false,
                "stickyTracking": false,
                "zIndex": 12,
                "dataLabels": {
                    "enabled": true,
                    "borderColor": "rgba(0,0,0,1)",
                    "style": {
                        "fontFamily": "'Lucida Grande', 'Lucida Sans Unicode'",
                        "fontSize": "11px",
                        "fontWeight": "normal",
                        "color": "rgba(60,60,60,1)",
                        "textOutline": false,
                        "textAlign": "center"
                    },
                    "allowOverlap": true,
                    "useHTML": true,
                    "scFormat": {
                        "yValue": { "enabled": true },
                        "annotation": { "style": { "color": "rgba(194,55,35,1)" } }
                    },
                    "scSelection": {}
                },
                "scTooltipFormat": {
                    "category": {
                        "enabled": true,
                       ...