score:2

Accepted answer

I think your data is incorrect for the x-axis where you are trying to put your icon.

You have been using 

// Populate the event series based on data in events object
    eventChartOptions.options.series.push(
        {
            data: [[174.0, 65.6]] ,
            marker: {
                symbol: 'text:\uf183' // fa-male
            },
            icon: '\uf183',
            name: 'Male',
            color: 'rgba(119, 152, 191, 0.6)'
        }
    );

Which indicates a value of 65.4 which is nowhere near the ranges defined for the other axis such as 1390219200000

Changing to

// Populate the event series based on data in events object
eventChartOptions.options.series.push({
    data: [
        [174.0, 1390219200000]
    ],
    marker: {
        symbol: 'text:\uf183' // fa-male
    },
    icon: '\uf183',
    name: 'Male',
    color: 'rgba(119, 152, 191, 0.6)'
});

Does render the man albeit at 90 degrees?!

Demo: http://jsfiddle.net/robschmuecker/yc3Tg/1/


Related Articles