spyfx
spyfx

Reputation: 1351

Highstock flags onSeries with addSeries

The chart series add looks like:

series: seriesOptions

seriesOptions is just a normal object list with series - anyway it works fine at all.
Now I would like to add some flags to a specific series, which is possible with onSeries.

chart.addSeries({
        type : 'flags',
        data: events,
        name: 'events',
        id: 'events',
        color : '#5F86B3',
        fillColor : '#5F86B3',
        onSeries : 'series1',
        width : 30,
        y : -100,
        shape : 'circlepin',
        style : {// text style
            color : 'white'
        },
        states : {
            hover : {
                fillColor : '#395C84'
            }
        }
    });

But they are still appearing on the bottom of the chart (which is the default setting).
For me it looks like the flags cant find the id of the series to appear - Isnt it possible to use addSeries() for flags?

Edit: here is my code http://jsfiddle.net/HWm4J/3/

seriesOptions console.log from the firebug:

[Object { id="series1", name="series1", data=[3574], more...}, Object { id="series2", name="series1", data=[412], more...}, Object { id="series3", name="series3", data=[497], more...}]

Upvotes: 0

Views: 1642

Answers (2)

Paweł Fus
Paweł Fus

Reputation: 45079

Unfortunately, you jsFiddle doesn't work and when I tried to reproduce issue on Highcharts example: http://jsfiddle.net/8Crk7/1/ it works perfectly fine.

I can only guess that id you set is wrong one, like in this example: http://jsfiddle.net/8Crk7/2/

Working example for adding series:

    $("#b").click(function () {
        Highcharts.charts[0].addSeries({
            type : 'flags',
            name: 'events',
            id: 'events',
            color: '#5F86B3',
            fillColor: '#5F86B3',
            onSeries: 'series1',
            width: 30,
            y: -100,
            shape: 'circlepin',
            style: { // text style
                color: 'white'
            },
            states: {
                hover: {
                    fillColor: '#395C84'
                }
            },
            data: [{
                x: Date.UTC(2011, 1, 14),
                title: 'On series'
            }, {
                x: Date.UTC(2011, 3, 28),
                title: 'On series'
            }],
        });

    });

If you want more help, recreate issue on jsFiddle, or at least post your full chart configuration.

Upvotes: 1

wergeld
wergeld

Reputation: 14442

Is your 'series1' valid? That is the series your code states to add the flags to. If this series has not been made yet or is not correctly identified then it will draw the flags in the default location. Did you try redrawing the chart upon adding this series?

Upvotes: 0

Related Questions