apache / apache/echarts

[Bug] 点击事件无效

Open
#20,514 3 comments 0 reactions 0 assignees View on GitHub
bug pending
Dominant language
TypeScript
Stars
67.3k
Forks
19.8k
Avg merge
11d 14h
Merged PRs (30d)
8

Description

### Version

5.5.1

### Link to Minimal Reproduction

1

### Steps to Reproduce

创建折线图,点击事件无效

### Current Behavior

const initChart = async () => {
myChart.value = echarts.init(chart.value);
myChart.value.setOption({
tooltip: {
trigger: "axis",
backgroundColor: "rgba(50,50,50,0.7)",
textStyle: { color: "#ffffff" },
},
legend: {
data: ["入场", "出场", "禁止"],
top: "4%",
itemWidth: 10,
itemHeight: 10,
icon: "circle", // 可以选择 'circle', 'rect', 'roundRect', 'triangle' 等
itemStyle: {
borderWidth: 2,
},
selectedMode: "multiple",
textStyle: {
color: "#ffffff",
padding: [0, 0, 0, 8],
},
itemGap: 20,
itemStyle: {
borderWidth: 2,
shadowBlur: 5, // 发光模糊程度
shadowColor: "#05e8fe", // 发光颜色
},
},
grid: {
left: "3%",
right: "4%",
bottom: "5%",
containLabel: true,
},
xAxis: {
type: "category",
boundaryGap: false,
data: Array.from({ length: 30 }, (_, i) => `${i + 1}日`),
axisLine: { lineStyle: { color: "#ccc" } },
axisLabel: { color: "#cccccc" },
},
yAxis: {
type: "value",
name: "次数",
nameTextStyle: { color: "#cccccc" },
axisLine: { lineStyle: { color: "#ccc" } },
axisLabel: { color: "#cccccc" },
splitLine: {
lineStyle: {
color: new echarts.graphic.LinearGradient(0, 0, 1, 0, [
{ offset: 0, color: "#05e8fe" },
{ offset: 0.5, color: "#0a74da" },
{ offset: 1, color: "#05e8fe" },
]),
type: "dashed", // 设置为虚线
width: 1.4, // 调整线条宽度
opacity: 0.4, // 调整透明度,使其更柔和
},
},
},
series: [
{
name: "入场",
type: "line",
smooth: true,
lineStyle: { color: "#3B9FF7" },
areaStyle: { color: "rgba(59, 159, 247, 0.2)" },
data: Array.from({ length: 30 }, () => Math.floor(Math.random() * 50)),
itemStyle: {
color: "#3B9FF7",
borderColor: "rgba(59, 159, 247, 0.8)",
borderWidth: 2,
shadowBlur: 10,
shadowColor: "rgba(59, 159, 247, 0.8)",
},
},
{
name: "出场",
type: "line",
smooth: true,
lineStyle: { color: "#F5C842" },
areaStyle: { color: "rgba(245, 200, 66, 0.2)" },
data: Array.from({ length: 30 }, () => Math.floor(Math.random() * 50)),
itemStyle: {
color: "#F5C842",
borderColor: "rgba(245, 200, 66, 0.8)",
borderWidth: 2,
shadowBlur: 10,
shadowColor: "rgba(245, 200, 66, 0.8)",
},
},
{
name: "禁止",
type: "line",
smooth: true,
lineStyle: { color: "#F24C4E" },
areaStyle: { color: "rgba(242, 76, 78, 0.2)" },
data: Array.from({ length: 30 }, () => Math.floor(Math.random() * 50)),
itemStyle: {
color: "#F24C4E",
borderColor: "rgba(242, 76, 78, 0.8)",
borderWidth: 2,
shadowBlur: 10,
shadowColor: "rgba(242, 76, 78, 0.8)",
},
},
],
});

// 鼠标移入事件
myChart.value.on("click", (params) => {
console.log('点击事件', params);
});
};

### Expected Behavior

点击无效 鼠标事件同样

### Environment

```markdown
- OS:win 11
- Browser: Chrome 130.0.6723.117
- Framework: vue@3
```

### Any additional comments?

_No response_

Contributor guide

Open the contributing guide

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.