You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@echarts.apache.org by GitBox <gi...@apache.org> on 2021/08/04 11:14:52 UTC
[GitHub] [echarts] chj-damon opened a new issue #15479: 自定义图表的arcTo画的弧线在鼠标hover时会失效
chj-damon opened a new issue #15479:
URL: https://github.com/apache/echarts/issues/15479
### Version
5.1.2
### Steps to reproduce
```ts
import * as echarts from 'echarts/core';
import { CustomSeriesOption } from 'echarts/charts';
const CylinderBody = echarts.graphic.extendShape({
shape: {
x: 0,
y: 0,
},
buildPath: function (ctx, shape) {
const { x, y, xAxisPoint, itemWidth } = shape;
const c0 = [x itemWidth / 2, y];
const c1 = [x - itemWidth / 2, y];
const c2 = [xAxisPoint[0] - itemWidth / 2, xAxisPoint[1]];
const c3 = [xAxisPoint[0] itemWidth / 2, xAxisPoint[1]];
const arc = [xAxisPoint[0], xAxisPoint[1] itemWidth / 2];
ctx
.moveTo(c0[0], c0[1])!
.lineTo(c1[0], c1[1])
.lineTo(c2[0], c2[1])
.arcTo(arc[0], arc[1], c3[0], c3[1], (itemWidth / 2) * Math.sqrt(2))
// .lineTo(c3[0], c3[1])
.closePath();
},
});
echarts.graphic.registerShape('cylinderBody', CylinderBody);
export default function createCylinderSeries(seriesData: { name?: string; data: number[] }) {
return {
type: 'custom',
name: seriesData.name,
data: seriesData.data,
yAxisIndex: 0,
// silent: true,
renderItem: (_, api) => {
const location = api.coord([api.value(0), api.value(1)]);
const xAxisPoint = api.coord([api.value(0), 0]);
return {
type: 'cylinderBody',
shape: {
x: location[0],
y: location[1],
itemWidth: 20,
xAxisPoint,
},
style: {
fill: 'red',
},
};
},
} as CustomSeriesOption;
}
```
使用：
```ts
const option = {
color: [theme.colors.primary300],
legend: {
...baseChartConfig.legend,
},
grid: {
...baseChartConfig.grid,
},
xAxis: {
type: "category",
data: xAxisData,
...baseChartConfig.xAxis,
},
yAxis: {
name: unit,
...baseChartConfig.yAxis,
},
series: [createCylinderSeries({ name, data })],
};
```
### What is expected?
期望自定义图表可以正常渲染
### What is actually happening?
在鼠标没有hover在柱子上时表现正常，但是鼠标hover上去之后，柱子会变形，看到的表现就是arcTo没有生效
<!-- This issue is generated by echarts-issue-helper. DO NOT REMOVE -->
<!-- This issue is in English. DO NOT REMOVE -->
--
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org
[GitHub] [echarts] pissang commented on issue #15479: 自定义图表的arcTo画的弧线在鼠标hover时会失效
Posted by GitBox <gi...@apache.org>.
pissang commented on issue #15479:
URL: https://github.com/apache/echarts/issues/15479#issuecomment-893169710
可以暂时使用 arc 命令来替代
--
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org
[GitHub] [echarts] echarts-bot[bot] commented on issue #15479: 自定义图表的arcTo画的弧线在鼠标hover时会失效
Posted by GitBox <gi...@apache.org>.
echarts-bot[bot] commented on issue #15479:
URL: https://github.com/apache/echarts/issues/15479#issuecomment-892573692
--
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org
[GitHub] [echarts] echarts-bot[bot] commented on issue #15479: 自定义图表的arcTo画的弧线在鼠标hover时会失效
Posted by GitBox <gi...@apache.org>.
echarts-bot[bot] commented on issue #15479:
URL: https://github.com/apache/echarts/issues/15479#issuecomment-892573692
--
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org
[GitHub] [echarts] pissang commented on issue #15479: 自定义图表的arcTo画的弧线在鼠标hover时会失效
Posted by GitBox <gi...@apache.org>.
pissang commented on issue #15479:
URL: https://github.com/apache/echarts/issues/15479#issuecomment-893169710
可以暂时使用 arc 命令来替代
--
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org