1

円グラフのスライスごとに背景画像を使用したいと考えています。これはハイチャートで可能ですか? 各スライスの背景画像を指定するオプションが見つかりません。ここに私がまとめた簡単なフィドルがあります：http://jsfiddle.net/3KyeL/（何をすべきかを知っている人にとって人生が楽になる場合に備えて、これをここに置いてください）：

$(function () {
    $('#container').highcharts({
        credits: {
            enabled: false
        },
        title: {
            align: 'center',
            text: 'The Foo Bar',
            style: {
                color: '#9EA7B6'
            },
            verticalAlign: 'bottom',
            y: 15 // TODO: compute this
        },
        tooltip: {
            enabled: false
        },
        plotOptions: {
            pie: {
                allowPointSelect: true,
                cursor: 'pointer',
                dataLabels: {
                    distance: -100,
                    enabled: true,
                    color: '#FFFFFF',
                    format: '<strong>{point.name}</strong>: {point.percentage:.1f} %'
                },
                center: ['50%', '50%']
            }
        },
        series: [{
            data: [{
                name: 'Foo',
                y: 25
            }, {
                name: 'Bar',
                y: 50
            }, {
                name: 'Foobar',
                y: 25
            }],
            type: 'pie'
        }]
    });
});
4

1 に答える 1

3

パターン プラグインを使用してみてください: http://www.highcharts.com/plugin-registry/single/9/Pattern-Fill

例: http://jsfiddle.net/kVwGn/

<script src="https://rawgithub.com/highslide-software/pattern-fill/master/pattern-fill.js"></script>

... 

series: [{
    type: 'pie',
    data: [{
        y: 35,
        color: {
            pattern: 'http://highcharts.com/demo/gfx/pattern1.png',
            width: 6,
            height: 6
        }
    }, {
        y: 15,
        color: {
            pattern: 'http://highcharts.com/demo/gfx/pattern2.png',
            width: 6,
            height: 6,
            // VML only:
            color1: 'red',
            color2: 'yellow'
        }
    }]
}]
于 2013-10-28T10:39:03.683 に答える