This is an automated email from the ASF dual-hosted git repository.
ovilia pushed a commit to branch master
in repository https://gitbox.apache.org/repos/asf/echarts.git
The following commit(s) were added to refs/heads/master by this push:
new 4ce776ccf feat(pie): add padAngle for pie
new b37d67cbd Merge pull request #19076 from linghaoSu/feat/pie_pad-angle
4ce776ccf is described below
commit 4ce776ccfe0cd0b89bc1c2434367fd448d2f4288
Author: linghao.su <slh...@live.cn>
AuthorDate: Sun Sep 3 19:37:12 2023 +0800
feat(pie): add padAngle for pie
---
src/chart/pie/PieSeries.ts | 3 +
src/chart/pie/pieLayout.ts | 72 +++++++++++++++++++-----
test/pie-pad-angle.html | 133 +++++++++++++++++++++++++++++++++++++++++++++
3 files changed, 195 insertions(+), 13 deletions(-)
diff --git a/src/chart/pie/PieSeries.ts b/src/chart/pie/PieSeries.ts
index 5d0fd4ade..13e220dc5 100644
--- a/src/chart/pie/PieSeries.ts
+++ b/src/chart/pie/PieSeries.ts
@@ -113,6 +113,8 @@ export interface PieSeriesOption extends
clockwise?: boolean
startAngle?: number
endAngle?: number | 'auto'
+ padAngle?: number;
+
minAngle?: number
minShowLabelAngle?: number
@@ -219,6 +221,7 @@ class PieSeriesModel extends SeriesModel<PieSeriesOption> {
clockwise: true,
startAngle: 90,
endAngle: 'auto',
+ padAngle: 0,
// 最小角度改为0
minAngle: 0,
diff --git a/src/chart/pie/pieLayout.ts b/src/chart/pie/pieLayout.ts
index e81afae43..2acdcda39 100644
--- a/src/chart/pie/pieLayout.ts
+++ b/src/chart/pie/pieLayout.ts
@@ -94,10 +94,14 @@ export default function pieLayout(
let startAngle = -seriesModel.get('startAngle') * RADIAN;
let endAngle = seriesModel.get('endAngle');
+ const padAngle = seriesModel.get('padAngle') * RADIAN;
+
endAngle = endAngle === 'auto' ? startAngle - PI2 : -endAngle * RADIAN;
const minAngle = seriesModel.get('minAngle') * RADIAN;
+ const minAndPadAngle = minAngle + padAngle;
+
let validDataCount = 0;
data.each(valueDim, function (value: number) {
!isNaN(value) && validDataCount++;
@@ -118,6 +122,7 @@ export default function pieLayout(
const dir = clockwise ? 1 : -1;
const angles = [startAngle, endAngle];
+ const halfPadAngle = dir * padAngle / 2;
normalizeArcAngles(angles, !clockwise);
[startAngle, endAngle] = angles;
@@ -159,19 +164,34 @@ export default function pieLayout(
angle = angleRange / validDataCount;
}
- if (angle < minAngle) {
- angle = minAngle;
- restAngle -= minAngle;
+
+ if (angle < minAndPadAngle) {
+ angle = minAndPadAngle;
+ restAngle -= minAndPadAngle;
}
else {
valueSumLargerThanMinAngle += value;
}
const endAngle = currentAngle + dir * angle;
+
+ // calculate display angle
+ let actualStartAngle = 0;
+ let actualEndAngle = 0;
+
+ if (padAngle > angle) {
+ actualStartAngle = currentAngle + dir * angle / 2;
+ actualEndAngle = actualStartAngle;
+ }
+ else {
+ actualStartAngle = currentAngle + halfPadAngle;
+ actualEndAngle = endAngle - halfPadAngle;
+ }
+
data.setItemLayout(idx, {
angle: angle,
- startAngle: currentAngle,
- endAngle: endAngle,
+ startAngle: actualStartAngle,
+ endAngle: actualEndAngle,
clockwise: clockwise,
cx: cx,
cy: cy,
@@ -184,19 +204,32 @@ export default function pieLayout(
currentAngle = endAngle;
});
- // Some sector is constrained by minAngle
+ // Some sector is constrained by minAngle and padAngle
// Rest sectors needs recalculate angle
if (restAngle < PI2 && validDataCount) {
// Average the angle if rest angle is not enough after all angles
is
- // Constrained by minAngle
+ // Constrained by minAngle and padAngle
if (restAngle <= 1e-3) {
const angle = angleRange / validDataCount;
data.each(valueDim, function (value: number, idx: number) {
if (!isNaN(value)) {
const layout = data.getItemLayout(idx);
layout.angle = angle;
- layout.startAngle = startAngle + dir * idx * angle;
- layout.endAngle = startAngle + dir * (idx + 1) * angle;
+
+ let actualStartAngle = 0;
+ let actualEndAngle = 0;
+
+ if (angle < padAngle) {
+ actualStartAngle = startAngle + dir * (idx + 1 /
2) * angle;
+ actualEndAngle = actualStartAngle;
+ }
+ else {
+ actualStartAngle = startAngle + dir * idx * angle
+ halfPadAngle;
+ actualEndAngle = startAngle + dir * (idx + 1) *
angle - halfPadAngle;
+ }
+
+ layout.startAngle = actualStartAngle;
+ layout.endAngle = actualEndAngle;
}
});
}
@@ -206,10 +239,23 @@ export default function pieLayout(
data.each(valueDim, function (value: number, idx: number) {
if (!isNaN(value)) {
const layout = data.getItemLayout(idx);
- const angle = layout.angle === minAngle
- ? minAngle : value * unitRadian;
- layout.startAngle = currentAngle;
- layout.endAngle = currentAngle + dir * angle;
+ const angle = layout.angle === minAndPadAngle
+ ? minAndPadAngle : value * unitRadian;
+
+ let actualStartAngle = 0;
+ let actualEndAngle = 0;
+
+ if (angle < padAngle) {
+ actualStartAngle = currentAngle + dir * angle / 2;
+ actualEndAngle = actualStartAngle;
+ }
+ else {
+ actualStartAngle = currentAngle + halfPadAngle;
+ actualEndAngle = currentAngle + dir * angle -
halfPadAngle;
+ }
+
+ layout.startAngle = actualStartAngle;
+ layout.endAngle = actualEndAngle;
currentAngle += dir * angle;
}
});
diff --git a/test/pie-pad-angle.html b/test/pie-pad-angle.html
new file mode 100644
index 000000000..a458e6f6b
--- /dev/null
+++ b/test/pie-pad-angle.html
@@ -0,0 +1,133 @@
+<!DOCTYPE html>
+<!--
+Licensed to the Apache Software Foundation (ASF) under one
+or more contributor license agreements. See the NOTICE file
+distributed with this work for additional information
+regarding copyright ownership. The ASF licenses this file
+to you under the Apache License, Version 2.0 (the
+"License"); you may not use this file except in compliance
+with the License. You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing,
+software distributed under the License is distributed on an
+"AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+KIND, either express or implied. See the License for the
+specific language governing permissions and limitations
+under the License.
+-->
+
+
+<html>
+
+<head>
+ <meta charset="utf-8">
+ <meta name="viewport" content="width=device-width, initial-scale=1" />
+ <script src="lib/simpleRequire.js"></script>
+ <script src="lib/config.js"></script>
+ <script src="lib/jquery.min.js"></script>
+ <script src="lib/facePrint.js"></script>
+ <script src="lib/testHelper.js"></script>
+ <!-- <script src="ut/lib/canteen.js"></script> -->
+ <link rel="stylesheet" href="lib/reset.css" />
+</head>
+
+<body>
+ <style>
+ </style>
+
+
+
+
+
+ <script>
+ require([
+ 'echarts',
+ // 'map/js/china',
+ // './data/nutrients.json'
+ ], function (echarts) {
+ var option;
+
+
+ const step = 5;
+ const interval = 20;
+
+ let padAngle = 0;
+ let minAngle = 0;
+
+ const seriesList = [];
+
+ let index = 0;
+
+ for (let i = 0; i < step; i++) {
+ for (let j = 0; j < step; j++) {
+ const canvas = document.createElement('div');
+
+ seriesList.push({
+ type: 'pie',
+ radius: ['40%', '70%'],
+ avoidLabelOverlap: false,
+ padAngle: j * interval,
+ minAngle: i * interval,
+ itemStyle: {
+ borderRadius: 10,
+ borderColor: '#fff',
+ borderWidth: 2
+ },
+ data: [
+ { value: 1048, name: 'Search Engine' },
+ { value: 735, name: 'Direct' },
+ { value: 580, name: 'Email' },
+ { value: 484, name: 'Union Ads' },
+ { value: 300, name: 'Video Ads' }
+ ]
+ })
+
+ canvas.setAttribute('id', `main${index}`);
+
+ document.body.append(canvas);
+ index++;
+ }
+ }
+
+
+
+ option = {
+ tooltip: {
+ trigger: 'item'
+ },
+ series: [
+ ]
+ };
+
+ for (let i = 0; i < seriesList.length; i++) {
+ var chart = testHelper.create(echarts, `main${i}`, {
+ title: [
+ `Pie with pad angle of main${i}`,
+ `padAngle is ${seriesList[i].padAngle}`,
+ `minAngle is ${seriesList[i].minAngle}`,
+ ],
+ option: {
+ tooltip: {
+ trigger: 'item'
+ },
+ series: [
+ seriesList[i],
+ ]
+ },
+ // height: 300,
+ // buttons: [{text: 'btn-txt', onclick: function () {}}],
+ // recordCanvas: true,
+ });
+
+
+ }
+
+ });
+ </script>
+
+
+</body>
+
+</html>
\ No newline at end of file
---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscr...@echarts.apache.org
For additional commands, e-mail: commits-h...@echarts.apache.org
