flot：キャンバスに含まれているラベルで円を描くことができません

Question

私は少しチャートを作成しようとしていて、この奇妙なエラーメッセージに遭遇しました。ここではどのような作品の例です。

$.ajax({ 
    type: "GET", 
    dataType: "json", 
    url: "/data/active_projects_per_phase", 
    success: function (result) { 
     $.plot($("#active_per_phase"), result, { 
      series: { 
       pie: { 
        show: true, 
        label: { 
         show: true, 
         radius: 3/4, 
         formatter: function (label, series) { 
          return label + ': ' + series.data[0][1] + ' (' + Math.round(series.percent) + '%)'; 
         }, 
         background: { 
          opacity: 0.5 
         } 
        } 

       } 

      }, 
      legend: { 
       show: false 

      } 
     }); 

    } 
}); 

URLは、次のデータを返します。

[ 
    { 
    "data": 24, 
    "label": "\u0411\u0438\u0437\u043d\u0435\u0441-\u0438\u0434\u0435\u044f" 
    }, 
    { 
    "data": 31, 
    "label": "\u041f\u043b\u0430\u043d\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u0435" 
    }, 
    { 
    "data": 26, 
    "label": "\u0418\u0441\u043f\u043e\u043b\u043d\u0435\u043d\u0438\u0435" 
    }, 
    { 
    "data": 1, 
    "label": "\u0417\u0430\u043a\u0440\u044b\u0442\u0438\u0435" 
    } 
] 

をしかし、それは、このデータを操作し、「キャンバス内部に含まれるラベルでパイを描くことができませんでした」と表示されません。エラー：

[ 
    { 
    "data": 6, 
    "label": "\u0417\u0430\u043a\u0440\u044b\u0442" 
    }, 
    { 
    "data": 11, 
    "label": "\u041e\u0442\u043c\u0435\u043d\u0435\u043d" 
    }, 
    { 
    "data": 1, 
    "label": "\u041e\u0441\u0442\u0430\u043d\u043e\u0432\u043b\u0435\u043d" 
    }, 
    { 
    "data": 5, 
    "label": "\u041f\u0435\u0440\u0435\u043d\u0435\u0441\u0435\u043d \u0432 \u0434\u0440\u0443\u0433\u043e\u0439 \u043f\u0440\u043e\u0435\u043a\u0442" 
    }, 
    { 
    "data": 4, 
    "label": "\u041f\u0435\u0440\u0435\u043d\u0435\u0441\u0435\u043d \u0432 \u043f\u043e\u0434\u0434\u0435\u0440\u0436\u043a\u0443" 
    } 
] 

これを克服するためにチャートの設定に欠けているのは何ですか？

Answer 1

flotの円機能には、凡例とラベルに制限があります。このコードは、凡例/ラベルがキャンバスの境界内にあることを確認し、凡例/ラベルがキャンバスの境界内にあることを確認します。あなたのオプションは以下のとおりです。

1. キャンバスを大きくしてください
2. あなたのラベルを短くしてください
3. テキストを下げてみてください外div

Answer 2

を指定するlegend.containerオプションを使用して、キャンバスの外に凡例を使用しますラベルの半径を小さくしようとすると、ここからキューを取りました http://people.iola.dk/olau/flot/examples/pie.html

私は私のレーベルの半径を広げ、問題は私のために修正されました。