Question

1。需要在可变饼图上添加边框。

2。需要更改图表的颜色。 2.需要更改图例的文字大小。

我尝试过，但是显示错误。这有可能做到上述想法吗？

<script src="https://code.highcharts.com/highcharts.js"></script>
<script src="https://code.highcharts.com/modules/variable-pie.js"></script>

 <div id="container"></div>



Highcharts.chart('container', {
chart: {
    type: 'variablepie'
},
title: {
    text: 'Countries compared by population density and total area.'
},
tooltip: {
    headerFormat: '',
    pointFormat: '<span style="color:{point.color}">\u25CF</span> <b> {point.name}</b><br/>' +
        'Area (square km): <b>{point.y}</b><br/>' +
        'Population density (people per square km): <b>{point.z}</b><br/>'
},
series: [{
    minPointSize: 10,
    innerSize: '20%',
    zMin: 0,
    name: 'countries',
    data: [{
        name: 'Spain',
        y: 505370,
        z: 92.9
    }, {
        name: 'France',
        y: 551500,
        z: 118.7
    }, {
        name: 'Poland',
        y: 312685,
        z: 124.6
    }, {
        name: 'Czech Republic',
        y: 78867,
        z: 137.5
    }, {
        name: 'Italy',
        y: 301340,
        z: 201.8
    }, {
        name: 'Switzerland',
        y: 41277,
        z: 214.5
    }, {
        name: 'Germany',
        y: 357022,
        z: 235.6
    }]
}]
});

需要像该图像一样在图表的顶部绘制边框。

Answer 1

1-要添加边框，请使用Highcharts. SVGRenderer：

chart: {
    type: 'variablepie',
    events: {
        load: function() {
            this.renderer.circle(
                this.chartWidth / 2,
                this.plotHeight / 2 + this.plotTop,
                this.plotHeight / 2
            ).attr({
                fill: 'rgba(0,0,0,0)',
                stroke: 'green',
                'stroke-width': 2
            }).add()
        }
    }
}

API：https://api.highcharts.com/class-reference/Highcharts.SVGRenderer#circle

2-要更改点的颜色，请设置colors数组：

colors: ['#4286f4', '#19e597', '#e84a4a', '#bbd827', '#27cfd8', '#d827cf', '#3a1c0f'],

API：https://api.highcharts.com/highcharts/colors

3-要更改图例集fontSize中的图例集itemStyle中的文本大小：

legend: {
    itemStyle: {
        fontSize: 16
    }
}

API：https://api.highcharts.com/highcharts/legend.itemStyle

实时演示：https://jsfiddle.net/BlackLabel/dLv2e0hq/

需要在可变高度图表上添加边框吗？

1 个答案: