javascript - jqplotグラデーションカラー

Question

jqplotを使用しています。円グラフの各スライスにカスタムのグラデーション カラーを設定する方法はありますか? 私は seriescolor オプションを使用しています：

seriesColors: ["#F3CBBF", "#BFDDE5", "#CF3501"],

Answer 1

「seriesDefaults」オブジェクト内に「seriesColors」オプションを配置していることを確認してください。

簡単な例:

        var plot1 = $.jqplot('div1', [['a', 8], ['b', 12], ['c', 6]], {
        title: 'Chart 1',

            seriesDefaults:{
                renderer:$.jqplot.PieRenderer,
            rendererOptions:{
                  showDataLabels: true,
                  dataLabels:'percent'
            }
            },
            seriesColors: ["#F3CBBF", "#BFDDE5", "#CF3501"],
            highlighter: {
                show: true
        },
            legend: {
                        show:true,
                        location: 's', 
                        placement: 'outsideGrid'}
        });

円グラフ レンダラーの JavaScript ファイルと jqplot-css ファイルを必ず含めてください (凡例を表示する場合)。

Answer 2

jqPlot 円グラフは、そのままではグラデーションをサポートしていません。API にはプロパティ設定はありません ( http://www.jqplot.com/docs/files/plugins/jqplot-pieRenderer-js.html )。ほとんどの場合、CSS、HTML 5、またはキャンバス オブジェクトでこれを行う必要があります。残念ながら、グラデーションを異なる方法で処理するさまざまなブラウザーに違反することにもなります。jqPlot バブル チャートにはグラデーション プロパティがありますが、それを行うチャート タイプがあることを知らせる以外に役に立たないことはわかっています ( http://www.jqplot.com/docs/files/plugins/jqplot-bubbleRenderer -js.html )。

seriesDefaults: {
    renderer: $.jqplot.BubbleRenderer,
    rendererOptions: {
        bubbleAlpha: 0.7,
        varyBubbleColors: false,
        bubbleGradients: true
    }
}