Highcharts - 仪表图表数据标签未正确定位

Question

我正在构建垂直标尺，并且在应用自定义图像代替默认标记时遇到问题。

虽然图像呈现，但它的位置是关闭的。我似乎无法准确指出标记的位置，而且我不确定是否将静态偏移值应用于“＆＃39; y＆＃39;属性是正确的方法。

这里是fiddle。

＆＃13;

＆＃13;

        var chart = new Highcharts.Chart({

            chart: {
                renderTo: 'container',
                type: 'column',
                marginBottom: 25,
                marginTop: 70,
                marginLeft: 65,
                marginRight: 10,
            },
            xAxis: {
                categories: ['One'],
                lineColor: 'white',
                labels: {
                    enabled: false
                },
                tickLength: 0,
                min: 0,
                max: 2
            },
            plotOptions: {
                column: {
                    stacking: 'normal',
                    animation: false,
                    borderWidth: 0,
                }
            },
            yAxis: {
                min: 0,
                max: 9026,
                tickInterval: 9026,
                tickLength: 0,
                tickWidth: 0,
                tickColor: '#C0C0C0',
                gridLineColor: '#C0C0C0',
                gridLineWidth: 0,
                minorTickInterval: 25,
                minorTickWidth: 0,
                minorTickLength: 0,
                minorGridLineWidth: 0,
                title: null,
                labels: {
                    formatter: function () {
                        if (this.isFirst || this.isLast) {
                            return this.value;
                        }
                    },
                    x: 0
                },
            },
            legend: {
                enabled: false
            },
            series: [
            {
                data: [4513],
                color: {
                    linearGradient: { x1: 0, x2: 0, y1: 0, y2: 1 },
                    stops: [
                        [0, 'red'],
                        [1, 'orange']
                    ]
                }
            },
            {
                data: [4513],
                color: {
                    linearGradient: { x1: 0, x2: 0, y1: 0, y2: 1 },
                    stops: [
                        [0, 'orange'],
                        [1, 'green']
                    ]
                }
            },
            {
                type: 'scatter',
                data: [3120],
                marker: {
                    enabled: true,
                    symbol: 'circle'
                },
                dataLabels: {
                    useHTML: true,
                    formatter: function () {

                        return '<img width="40px" height="40px"  src="http://icongal.com/gallery/image/57585/small_arrow_black_monotone_left.png" />'
                    },
                    enabled: true,
                    align: 'right',
                    x: -3,
                    y: 2,
                    overflow: "justify"
                }
            }
            ]

        });

    

＆＃13;

<script src="https://code.highcharts.com/highcharts.js"></script>
<div id="container" style="width: 178px; height: 242px;"></div>

＆＃13;

＆＃13;

＆＃13;

感谢任何帮助，谢谢！

Answer 1

您应该通过x，y属性调整图像位置。

/home/dazhen/torch/install/share/lua/5.1/trepl/init.lua

示例：https://jsfiddle.net/ptezqnbf/1/

甚至更好，使用renderer.image并直接控制位置。

      x: 0,
      y: 30,

示例：https://jsfiddle.net/tpp1gdau/1/