如何用线条添加jqplot饼图标签？

我有一个饼图，我可以正常添加标签。但我想添加带有如下行的标签。

我以网络上的这张图片为例。 这是我的代码，

drawPieCharts = function(dev,title,data){ $('#'+dev).empty(); var plot = $.jqplot(dev, [data], { title: { text: title, fontWeight: 'bold', fontSize : '16', show: true }, grid: { drawBorder: false, drawGridlines: false, background: '#ffffff', shadow:false, //diameter : 30 }, axesDefaults: { }, highlighter: { show: true, formatString:'%s , P%', tooltipLocation:'n', useAxesFormatters:false }, seriesDefaults:{ renderer:$.jqplot.PieRenderer, rendererOptions: { showDataLabels: true, dataLabelThreshold: 0, dataLabelPositionFactor: 1.05, dataLabels : mapSeperater(data)[0], padding: 2 } }, }); 

}

而且我还有另一个问题，我想加粗图表的标题，这样它就不起作用了。 有没有办法做到这一点？

谢谢。

Answer 1

我正在寻找相同的，但还没有成功。 但是对于标题，也许你可以尝试使用“jqplot-title”类来设置div的样式，这就是标题的呈现位置。

在jquery中会是这样的：

$(".jqplot-title").wrap("")

编辑：

对不起，我没有时间来讨论它，但你可以尝试并得到这个想法。 看起来有点可怕，但你可以做得更好。

我所做的是将切片的标签放在馅饼外面，并从中心到这些标签画一些线条。

..i带有这样的东西：

  series: [{ renderer: $.jqplot.PieRenderer, rendererOptions: { diameter: 140, showDataLabels: true, dataLabelThreshold: 0, //minimum area to show a label, (i want all the labels) dataLabelPositionFactor: 2.3, //in function of the radius, how far show the label dataLabels: 'label', dataLabelFormatString: '%s', //(just more options, etc, etc) plot = $.jqplot("myDivHere", [data], options).replot(); // <-- that's for me // ****************************** // HERE COMES THE MAGIC: // var w = $("#myDivHere .jqplot-series-shadowCanvas").width(); var h = $("#myDivHere .jqplot-series-shadowCanvas").height(); x1 = (w/2); y1 = (h/2); var canvas = $("#myDivHere .jqplot-series-shadowCanvas")[0]; var context = canvas.getContext('2d'); $(".jqplot-pie-series.jqplot-data-label").each( function(){ var l = $(this).position().left; var t = $(this).position().top; console.log("x1, y1 are: ["+x1+", "+y1+"]\nl, t are ["+l+", "+t+"]"); context.beginPath(); context.moveTo(x1, y1); context.lineTo(l, t); context.stroke(); }); 

本周我没有更多的时间来处理这个问题了，所以你可以把它当作可怕的并且让它变得更好。 或等待更好的解决方案出现。

问候！！

啊，如果你能做得更好，请与我分享。