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 2020/04/17 04:59:33 UTC
[GitHub] [incubator-echarts] walker-design opened a new issue #12451: 点击某个图表选中，其他图表的选中状态会被取消，即axisPointer里面的shadow效果消失了
walker-design opened a new issue #12451: 点击某个图表选中，其他图表的选中状态会被取消，即axisPointer里面的shadow效果消失了
URL: https://github.com/apache/incubator-echarts/issues/12451
### Version
4.6.0
### Reproduction link
[https://0gv53.csb.app/](https://0gv53.csb.app/)
### Steps to reproduce
在移动端页面多图表出现，点击某个图表，其他图表的选中状态会被取消，即axisPointer里面的shadow效果消失了
1、随便点击选中第一个图表，
2、在点击选中第二个图表，上一个图表的选中的状态会被取消。
### What is expected?
因为一个页面需要实现多表联动，用户需要看到他之前的状态选中，每个图表的选中状态能保留，相互不影响
### What is actually happening?
当前图表的选中状态会被其他图表点击取消
<!-- This issue is generated by echarts-issue-helper. 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.
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
With regards,
Apache Git Services
---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org
[GitHub] [incubator-echarts] echarts-bot[bot] commented on issue #12451: 点击某个图表选中，其他图表的选中状态会被取消，即axisPointer里面的shadow效果消失了
Posted by GitBox <gi...@apache.org>.
echarts-bot[bot] commented on issue #12451: 点击某个图表选中，其他图表的选中状态会被取消，即axisPointer里面的shadow效果消失了
URL: https://github.com/apache/incubator-echarts/issues/12451#issuecomment-615042443
Hi! We've received your issue and please be patient to get responded. 🎉
The average response time is expected to be within one day for weekdays.
In the meanwhile, please make sure that **you have posted enough image to demo your request**. You may also check out the [API](http://echarts.apache.org/api.html) and [chart option](http://echarts.apache.org/option.html) to get the answer.
If you don't get helped for a long time (over a week) or have an urgent question to ask, you may also send an email to dev@echarts.apache.org. Please attach the issue link if it's a technical questions.
If you are interested in the project, you may also subscribe our [mail list](https://echarts.apache.org/en/maillist.html).
Have a nice day! 🍵
----------------------------------------------------------------
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.
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
With regards,
Apache Git Services
---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org
[GitHub] [incubator-echarts] walker-design edited a comment on issue #12451: 点击某个图表选中，其他图表的选中状态会被取消，即axisPointer里面的shadow效果消失了
Posted by GitBox <gi...@apache.org>.
walker-design edited a comment on issue #12451:
URL: https://github.com/apache/incubator-echarts/issues/12451#issuecomment-617576204
`<template>
<div class="test">
<div class="line-bar-1"></div>
<div class="line-bar-2"></div>
</div>
</template>
<script>
import echarts from "echarts";
export default {
data() {
return {
chartInstance1: null,
chartInstance2: null
};
},
mounted() {
this.initLineBar1();
this.initLineBar2();
},
methods: {
initLineBar1() {
let element = document.querySelector(".line-bar-1");
if (!element) return;
this.chartInstance1 = echarts.init(element);
let option = {
tooltip: {
show: true,
trigger: "axis",
showContent: false,
axisPointer: {
type: "shadow",
shadowStyle: {
color: "#000000",
opacity: 0.1
}
}
},
xAxis: [
{
type: "category",
data: ["标签", "标签2", "标签3", "标签4", "标签5"],
}
],
yAxis: [
{
max: 1500,
name: "(万)",
nameLocation: "end",
nameGap: 2,
type: "value",
min: null,
minInterval: 0
},
{
name: "(%)",
min: -1290,
nameGap: 2,
position: "right",
type: "value",
scale: true
}
],
series: [
{
type: "bar",
yAxisIndex: 0,
data: [544,423, 345, 556, 657],
},
{
type: "line",
yAxisIndex: 1,
data: ["51.3", "100.0", "71.6", "100.0", "-455.7"],
}
],
};
this.chartInstance1.setOption(option, true);
},
initLineBar2() {
let element = document.querySelector(".line-bar-2");
if (!element) return;
this.chartInstance2 = echarts.init(element);
let option = {
tooltip: {
show: true,
trigger: "axis",
showContent: false,
axisPointer: {
type: "shadow",
shadowStyle: {
color: "#000000",
opacity: 0.1
}
}
},
xAxis: [
{
type: "category",
data: ["标签", "标签2", "标签3", "标签4", "标签5"],
}
],
yAxis: [
{
max: 1500,
name: "(万)",
nameLocation: "end",
nameGap: 2,
type: "value",
min: null,
minInterval: 0
},
{
name: "(%)",
min: -1290,
nameGap: 2,
position: "right",
type: "value",
scale: true
}
],
series: [
{
type: "bar",
yAxisIndex: 0,
data: [544,423, 345, 556, 657],
},
{
type: "line",
yAxisIndex: 1,
data: ["51.3", "100.0", "71.6", "100.0", "-455.7"],
}
],
};
this.chartInstance2.setOption(option, true);
}
}
};
</script>`
----------------------------------------------------------------
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.
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] [incubator-echarts] yufeng04 commented on issue #12451: 点击某个图表选中，其他图表的选中状态会被取消，即axisPointer里面的shadow效果消失了
Posted by GitBox <gi...@apache.org>.
yufeng04 commented on issue #12451: 点击某个图表选中，其他图表的选中状态会被取消，即axisPointer里面的shadow效果消失了
URL: https://github.com/apache/incubator-echarts/issues/12451#issuecomment-615311388
请问一下，多表联动是如何实现的呢？可以在[gallery](https://gallery.echartsjs.com/editor.html)提供一个简单的可复现demo吗？
----------------------------------------------------------------
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.
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
With regards,
Apache Git Services
---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org
[GitHub] [incubator-echarts] walker-design removed a comment on issue #12451: 点击某个图表选中，其他图表的选中状态会被取消，即axisPointer里面的shadow效果消失了
Posted by GitBox <gi...@apache.org>.
walker-design removed a comment on issue #12451:
URL: https://github.com/apache/incubator-echarts/issues/12451#issuecomment-617577083
`js
initLineBar1() {
let element = document.querySelector(".line-bar-1");
if (!element) return;
this.chartInstance1 = echarts.init(element);
let option = {
tooltip: {
show: true,
trigger: "axis",
showContent: false,
axisPointer: {
type: "shadow",
shadowStyle: {
color: "#000000",
opacity: 0.1
}
}
},
xAxis: [
{
type: "category",
data: ["标签", "标签2", "标签3", "标签4", "标签5"],
}
],
yAxis: [
{
max: 1500,
name: "(万)",
nameLocation: "end",
nameGap: 2,
type: "value",
min: null,
minInterval: 0
},
{
name: "(%)",
min: -1290,
nameGap: 2,
position: "right",
type: "value",
scale: true
}
],
series: [
{
type: "bar",
yAxisIndex: 0,
data: [544,423, 345, 556, 657],
},
{
type: "line",
yAxisIndex: 1,
data: ["51.3", "100.0", "71.6", "100.0", "-455.7"],
}
],
};
this.chartInstance1.setOption(option, true);
}
`
----------------------------------------------------------------
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.
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] [incubator-echarts] walker-design commented on issue #12451: 点击某个图表选中，其他图表的选中状态会被取消，即axisPointer里面的shadow效果消失了
Posted by GitBox <gi...@apache.org>.
walker-design commented on issue #12451:
URL: https://github.com/apache/incubator-echarts/issues/12451#issuecomment-617577083
`js
initLineBar1() {
let element = document.querySelector(".line-bar-1");
if (!element) return;
this.chartInstance1 = echarts.init(element);
let option = {
tooltip: {
show: true,
trigger: "axis",
showContent: false,
axisPointer: {
type: "shadow",
shadowStyle: {
color: "#000000",
opacity: 0.1
}
}
},
xAxis: [
{
type: "category",
data: ["标签", "标签2", "标签3", "标签4", "标签5"],
}
],
yAxis: [
{
max: 1500,
name: "(万)",
nameLocation: "end",
nameGap: 2,
type: "value",
min: null,
minInterval: 0
},
{
name: "(%)",
min: -1290,
nameGap: 2,
position: "right",
type: "value",
scale: true
}
],
series: [
{
type: "bar",
yAxisIndex: 0,
data: [544,423, 345, 556, 657],
},
{
type: "line",
yAxisIndex: 1,
data: ["51.3", "100.0", "71.6", "100.0", "-455.7"],
}
],
};
this.chartInstance1.setOption(option, true);
}
`
----------------------------------------------------------------
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.
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] [incubator-echarts] walker-design commented on issue #12451: 点击某个图表选中，其他图表的选中状态会被取消，即axisPointer里面的shadow效果消失了
Posted by GitBox <gi...@apache.org>.
walker-design commented on issue #12451:
URL: https://github.com/apache/incubator-echarts/issues/12451#issuecomment-617576204
<template>
<div class="test">
<div class="line-bar-1"></div>
<div class="line-bar-2"></div>
</div>
</template>
<script>
import echarts from "echarts";
export default {
data() {
return {
chartInstance1: null,
chartInstance2: null
};
},
mounted() {
this.initLineBar1();
this.initLineBar2();
},
methods: {
initLineBar1() {
let element = document.querySelector(".line-bar-1");
if (!element) return;
this.chartInstance1 = echarts.init(element);
let option = {
tooltip: {
show: true,
trigger: "axis",
showContent: false,
axisPointer: {
type: "shadow",
shadowStyle: {
color: "#000000",
opacity: 0.1
}
}
},
xAxis: [
{
type: "category",
data: ["标签", "标签2", "标签3", "标签4", "标签5"],
}
],
yAxis: [
{
max: 1500,
name: "(万)",
nameLocation: "end",
nameGap: 2,
type: "value",
min: null,
minInterval: 0
},
{
name: "(%)",
min: -1290,
nameGap: 2,
position: "right",
type: "value",
scale: true
}
],
series: [
{
type: "bar",
yAxisIndex: 0,
data: [544,423, 345, 556, 657],
},
{
type: "line",
yAxisIndex: 1,
data: ["51.3", "100.0", "71.6", "100.0", "-455.7"],
}
],
};
this.chartInstance1.setOption(option, true);
},
initLineBar2() {
let element = document.querySelector(".line-bar-2");
if (!element) return;
this.chartInstance2 = echarts.init(element);
let option = {
tooltip: {
show: true,
trigger: "axis",
showContent: false,
axisPointer: {
type: "shadow",
shadowStyle: {
color: "#000000",
opacity: 0.1
}
}
},
xAxis: [
{
type: "category",
data: ["标签", "标签2", "标签3", "标签4", "标签5"],
}
],
yAxis: [
{
max: 1500,
name: "(万)",
nameLocation: "end",
nameGap: 2,
type: "value",
min: null,
minInterval: 0
},
{
name: "(%)",
min: -1290,
nameGap: 2,
position: "right",
type: "value",
scale: true
}
],
series: [
{
type: "bar",
yAxisIndex: 0,
data: [544,423, 345, 556, 657],
},
{
type: "line",
yAxisIndex: 1,
data: ["51.3", "100.0", "71.6", "100.0", "-455.7"],
}
],
};
this.chartInstance2.setOption(option, true);
}
}
};
</script>
----------------------------------------------------------------
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.
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] [incubator-echarts] walker-design removed a comment on issue #12451: 点击某个图表选中，其他图表的选中状态会被取消，即axisPointer里面的shadow效果消失了
Posted by GitBox <gi...@apache.org>.
walker-design removed a comment on issue #12451:
URL: https://github.com/apache/incubator-echarts/issues/12451#issuecomment-617576204
`<template>
<div class="test">
<div class="line-bar-1"></div>
<div class="line-bar-2"></div>
</div>
</template>
<script>
import echarts from "echarts";
export default {
data() {
return {
chartInstance1: null,
chartInstance2: null
};
},
mounted() {
this.initLineBar1();
this.initLineBar2();
},
methods: {
initLineBar1() {
let element = document.querySelector(".line-bar-1");
if (!element) return;
this.chartInstance1 = echarts.init(element);
let option = {
tooltip: {
show: true,
trigger: "axis",
showContent: false,
axisPointer: {
type: "shadow",
shadowStyle: {
color: "#000000",
opacity: 0.1
}
}
},
xAxis: [
{
type: "category",
data: ["标签", "标签2", "标签3", "标签4", "标签5"],
}
],
yAxis: [
{
max: 1500,
name: "(万)",
nameLocation: "end",
nameGap: 2,
type: "value",
min: null,
minInterval: 0
},
{
name: "(%)",
min: -1290,
nameGap: 2,
position: "right",
type: "value",
scale: true
}
],
series: [
{
type: "bar",
yAxisIndex: 0,
data: [544,423, 345, 556, 657],
},
{
type: "line",
yAxisIndex: 1,
data: ["51.3", "100.0", "71.6", "100.0", "-455.7"],
}
],
};
this.chartInstance1.setOption(option, true);
},
initLineBar2() {
let element = document.querySelector(".line-bar-2");
if (!element) return;
this.chartInstance2 = echarts.init(element);
let option = {
tooltip: {
show: true,
trigger: "axis",
showContent: false,
axisPointer: {
type: "shadow",
shadowStyle: {
color: "#000000",
opacity: 0.1
}
}
},
xAxis: [
{
type: "category",
data: ["标签", "标签2", "标签3", "标签4", "标签5"],
}
],
yAxis: [
{
max: 1500,
name: "(万)",
nameLocation: "end",
nameGap: 2,
type: "value",
min: null,
minInterval: 0
},
{
name: "(%)",
min: -1290,
nameGap: 2,
position: "right",
type: "value",
scale: true
}
],
series: [
{
type: "bar",
yAxisIndex: 0,
data: [544,423, 345, 556, 657],
},
{
type: "line",
yAxisIndex: 1,
data: ["51.3", "100.0", "71.6", "100.0", "-455.7"],
}
],
};
this.chartInstance2.setOption(option, true);
}
}
};
</script>`
----------------------------------------------------------------
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.
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] [incubator-echarts] Ovilia commented on issue #12451: 点击某个图表选中，其他图表的选中状态会被取消，即axisPointer里面的shadow效果消失了
Posted by GitBox <gi...@apache.org>.
Ovilia commented on issue #12451:
URL: https://github.com/apache/incubator-echarts/issues/12451#issuecomment-618298995
这是符合预期的，不是 bug。如果想要保持，就记录下点击的数据，然后通过 setOption 设置一个灰色的背景（比如用 https://echarts.apache.org/zh/option.html#series-bar.showBackground）
----------------------------------------------------------------
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.
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] [incubator-echarts] Ovilia commented on issue #12451: 点击某个图表选中，其他图表的选中状态会被取消，即axisPointer里面的shadow效果消失了
Posted by GitBox <gi...@apache.org>.
Ovilia commented on issue #12451:
URL: https://github.com/apache/incubator-echarts/issues/12451#issuecomment-617526707
把最简单的代码在这里贴一下
----------------------------------------------------------------
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.
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] [incubator-echarts] walker-design edited a comment on issue #12451: 点击某个图表选中，其他图表的选中状态会被取消，即axisPointer里面的shadow效果消失了
Posted by GitBox <gi...@apache.org>.
walker-design edited a comment on issue #12451:
URL: https://github.com/apache/incubator-echarts/issues/12451#issuecomment-616274262
> 请问一下，多表联动是如何实现的呢？可以在[gallery](https://gallery.echartsjs.com/editor.html)提供一个简单的可复现demo吗？
你好，你提供的地址，只能实例生成一个图表，不能在页面中生成多个图表，可以PC点击打开我上面提供的地址https://0gv53.csb.app/ 或者使用安卓机打开这个链接地址，问题必现，🙏感谢你的回复
----------------------------------------------------------------
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.
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] [incubator-echarts] walker-design commented on issue #12451: 点击某个图表选中，其他图表的选中状态会被取消，即axisPointer里面的shadow效果消失了
Posted by GitBox <gi...@apache.org>.
walker-design commented on issue #12451:
URL: https://github.com/apache/incubator-echarts/issues/12451#issuecomment-617581057
https://gallery.echartsjs.com/editor.html?c=xvjll5ln10&v=1
已在gallery贴入最简代码。如果页面中绘制几个这种的图表。在安卓端点击某个图表的柱子，会取消其他图表的axisPointer效果。
----------------------------------------------------------------
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.
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] [incubator-echarts] walker-design commented on issue #12451: 点击某个图表选中，其他图表的选中状态会被取消，即axisPointer里面的shadow效果消失了
Posted by GitBox <gi...@apache.org>.
walker-design commented on issue #12451:
URL: https://github.com/apache/incubator-echarts/issues/12451#issuecomment-616274262
> 请问一下，多表联动是如何实现的呢？可以在[gallery](https://gallery.echartsjs.com/editor.html)提供一个简单的可复现demo吗？
你提供的地址，只能实例生成一个图表，不能在页面中生成多个图表，可以点击打开我上面提供的地址https://0gv53.csb.app/
----------------------------------------------------------------
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.
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