Looking for customized Scatter plot Graph in High chart

Question

In he picture we have values on X-Axis ass F1, F2, F3, and so on. for example red dots denote value for F1. For each X axis category the color for dots will be different.

We tried Highcharts Scatter graph but have no luck.

how can this be achieved.

Answer 1

You can use multiple scatter series with defined x and y values. Example:

Highcharts.chart('container', {
    chart: {
        type: 'scatter'
    },
    series: [{
        data: [
            [0.9, 40],
            [1, 15],
            [1.05, 25],
            [1.1, 10],

            [2.9, 35],
            [3, 35],
            [3.1, 35]
        ]
    }, {
        data: [
            [1.9, 25],
            [1.95, 10],
            [2, 35],
            [2.1, 35]
        ]
    }],
    ...
});

---

Live demo: http://jsfiddle.net/BlackLabel/4eszoy30/

API Reference: https://api.highcharts.com/highcharts/series.scatter.data