3

我想将 放在pie左上角,chart但该left属性不起作用,top另一方面正在起作用。

我的代码 - Jsfiddle

代码:

$(function () {
     var data = [
    { label: "Read", data: 50, color: '#614E43' },
    { label: "Unread", data: 150, color: '#F5912D' }];
      $.plot($("#star"), data, 
      {
        series: {

          pie: {        
            radius: 0.2,  
            innerRadius: 0.125,
            show: true,
            stroke: {
                width: 0.1,
                color: '#808080'
            },
            offset: {
                  top: -70,
                  left: -30
            }
          }
        }
      });
});
4

2 回答 2

3

问题出在setupPie()功能上。我相信这是一个错误。

饼图不允许左侧位置低于最大半径,即使实际半径更小。

http://flot.googlecode.com/svn/trunk/jquery.flot.pie.js @ line 204

if (centerLeft<maxRadius)
    centerLeft = maxRadius;
else if (centerLeft>canvas.width-maxRadius)
    centerLeft = canvas.width-maxRadius;

如果你设置了一个相对半径,它不应该检查左边的最大宽度。

相反,应该有类似的东西:

//calculate the radius the same way drawPie() does
var radius = options.series.pie.radius;
if (options.series.pie.radius < 1)
    radius *= maxRadius;

//and compare to that value
if (centerLeft < radius)
    centerLeft = radius;
else if (centerLeft > canvas.width-radius)
    centerLeft = canvas.width-radius;

编辑:

我已经分叉了 repo 并尝试了我的代码,似乎正在完成工作。

我的JSFiddle

于 2013-09-14T22:56:15.440 回答
2

正如@MasterAM 正确指出的那样,错误在于 centerLeft 被剪裁的方式。一个稍微好一点的解决方案是简单地将其移动到宽度 == "auto" 的检查中,因为剪裁仅适用于这种情况。

请注意,您使用的来自 code.google.com 的 Flot 版本已经很旧了;我们不久前搬到了Github 。我已经将修复推送给 master,所以如果你从 GH 切换到最新版本,你就一切就绪。

于 2013-09-15T00:44:35.433 回答