CODEWITHSUNDEEP
phpjqueryflot
nodeffect
nodeffect

Reputation: 1840

Flot chart - Hide x-axis data value if no data found on line chart

I'm trying to hide the x-axis data label if no data is found. Please refer to the screenshot below. I want to show "0" or empty text instead of the date "01/01/1970".

enter image description here

How can I do that? My current code for flot chart is as below:

$.plot(elem, dataset1, 
        {
            lines: { show: true, fill:true },
            points: { show: true },
            shadowSize: 0,
            yaxis : {
                show : true,
                axisLabel : '<font style="color:#787878"><i>Total Views</i></font>',
                position: 'left',
                axisLabelPadding: 10,
                tickDecimals: 0,
                color: "#E0E0E0"
            },
            xaxis: {
                mode: "time",
                timeformat: "%d/%m/%Y",
                minTickSize: [1, "day"],
                color: "#E0E0E0",
                axisLabel: '<font style="color:#787878">Date</font>',
                axisLabelPadding: 20,
            },
            grid: {
                hoverable: true,
                borderWidth: 0
            },
            legend: { show: true, container: $('#legend-container'), noColumns: 1 },
            tooltip: true,
            tooltipOpts: {
                content: function(label, xval, yval) {
                    var d = new Date(xval);
                    return label + ' (' + d.getDate() + '/' + (d.getMonth()+1) + '/' + d.getFullYear() +') : ' + yval
                },
                shifts: {
                    x: 20,
                    y: 0
                },
                defaultTheme: false
            },
            colors: [ "#4682B4" ]
        }

Upvotes: 0

Views: 825

Answers (1)

Raidri
Raidri

Reputation: 17550

You can add the following to the axis options to only show the axis if there are data points in your data set:

xaxis: {
    show: dataset1.length > 0
    ...

Upvotes: 1

Related Questions