Search code examples
javascriptchartsreal-timeflot

Flot.js on real-time plot single dots are not visible


Here is the example. https://www.flotcharts.org/flot/examples/realtime/index.html. When I have data with nulls:

data[280] = null;
data[281] = null;
data[282] = 45;
data[283] = 45;
data[284] = null;
data[285] = null;
data[286] = 45;
data[287] = null;
data[288] = null; 

Point with number [282] and [283] will be united and displayed, but point with number [286] won't. So if point with value is surrounded by points with nulls are not displayed on plot.

The question is if there is a possibility to display such kind of single dots?


Solution

  • The flot example linked to only shows lines, not points. You can't draw a line with only one point, so if your data contains one value surrounded by nulls, you'd see the behavior your seeing.

    If you want to see each point (no matter what it is surrounded by), you can turn on the points.show option in the series object (below). There are a few options available to customize the look and feel of a draw point as well (also below).

    series: {
        lines: { show: true },
        points: {
            show: true
            radius: 2
            symbol: "circle" or function
        }
    }