javascript - 在高图中添加图像

Question

我正在尝试在 highchart 中添加图像，但我看不到图像。请看下面的代码：

var currentECGOptions = {
    chart: {
        renderTo: 'currentECGContainer',
        events: {  
            load: function () {
                alert("load this function");
               this.renderer.image('/Content/Images/logo.png', 100, 100, 30, 30)
                    .on('click' , function(){location.href='http://www.highcharts.com'})
                    .css({cursor:'Pointer'})

                    .add();
                    }
                }    
    },

    navigator: {
        enabled: true,
        maskFill: 'rgba(255, 255, 255, 0.45)',
        series: {
            type: 'areaspline',
            color: 'rgba(255, 255, 255, 0.00)',
            fillOpacity: 0.8,
            dataGrouping: {
                smoothed: true
            },
            lineWidth: 1,
            lineColor: 'blue',
            fillColor: {
                linearGradient: {
                    x1: 0,
                    y1: 0,
                    x2: 0,
                    y2: 1
                },
                stops: [[0, '#FF8000'], [1, '#FFFF00']]
            },
            marker: {
                enabled: false
            },
            shadow: false
        },
        yAxis: {
            reversed: false
        }
    },
    series: [{
        showInLegend: false,
        data: [null, null]
    }]
     };

currentECGOptions = jQuery.extend(true, {}, options, currentECGOptions);

var currentECG = new Highcharts.Chart(currentECGOptions);

currentECG.setTitle({ text: "CURRENT ECG" });
currentECG.showLoading();

Answer 1

尝试在创建图表后添加徽标，而不是在events选项中。它可能看起来像这样：

/* create the chart */
var currentECG = new Highcharts.Chart(currentECGOptions);

/* add the image to the new chart, after it's been created */
currentECG.renderer.image('/Content/Images/logo.png', 100, 100, 30, 30).on('click' , function(){location.href='http://www.highcharts.com'}).css({cursor:'Pointer'}).add();

我希望这有帮助！

Answer 2

您应该能够通过 css 设置图像：

HTML

<div id="mychart"></div>

CSS

#mychart {
    background-image: url('image.png');
}

JS

$('#mychart').highcharts( ... )