当数据为零时，浮子饼图呈现图例，但不为空图

Question

我在当前项目中正在做一些浮动图表。当您至少有一个具有正值的数据对象时，该代码会很好用，但是如果返回的数据为零，我希望至少显示一个空圆圈或某种消息或其他内容。这是我要制作图表的数据对象。图例显示正常，但没有图表（即使是空白图表）。

datacontent":[{"label":"Wired headset","data":0},{"label":"Bluetooth headset","data":0},{"label":"Car bluetooth","data":0},{"label":"None","data":0}]

我真的很想只显示“对不起，没有可用的图表”之类的消息，同时仍显示图例。这可能吗？

这是当前显示的屏幕截图：

Answer 1

我将在绘图调用后添加“无数据”检查，并直接向画布添加一条消息。这样，您就可以保留图例并可以添加进一步的自定义。

somePlot = $.plot($("#placeholder"), [{"label":"Wired headset","data":0},{"label":"Bluetooth headset","data":0},{"label":"Car bluetooth","data":0},{"label":"None","data":0}], {
    series: {
        pie: { 
            show: true
        }
    }
});

if (isNaN(somePlot.getData()[0].percent)){
    var canvas = somePlot.getCanvas();
    var ctx = canvas.getContext("2d");  //canvas context
    var x = canvas.width / 2;
    var y = canvas.height / 2;
    ctx.font = '30pt Calibri';
    ctx.textAlign = 'center';
    ctx.fillText('No Data!', x, y);
}

产生（此处为小提琴）：