Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Bug] The axes of the histogram and scatter plot do not align correctly #20619

Open
xieyeying opened this issue Dec 25, 2024 · 1 comment
Open
Labels
bug en This issue is in English pending We are not sure about whether this is a bug/new feature.

Comments

@xieyeying
Copy link

Version

5.5.1

Link to Minimal Reproduction

Steps to Reproduce

I encountered an issue while trying to align the axes of a histogram and a scatter plot. The problem is that the x-axis and y-axis of the histogram do not correctly align with the corresponding axes of the scatter plot.

I created two histograms and one scatter plot, and all three use corresponding x-axis and y-axis ranges.
However, when rendering these three charts simultaneously, the axes of the histogram do not align correctly with those of the scatter plot. There is an offset or misalignment in the values on both the x-axis and y-axis.

Is there any way to ensure that the axes of these two charts align perfectly?

this is option: option.value = {
backgroundColor: '#FAFAFA',
dataset: [
{
source: chartData.value.actual_to_predicted
},
{
transform: {
type: 'ecStat:histogram',
config: {}
}
},
{
transform: {
type: 'ecStat:histogram', // 分箱 统计每个区间内的数据点数量
config: { dimensions: [1] }, // 表示将使用第二列来生成数据
}
}
],
tooltip: {},
grid: [
{ // 中间的散点图
top: '30%',
right: '30%'
},
{ // 上面的柱状图
bottom: '70%',
right: '30%'
},
{ // 右边的柱状图
top: '30%',
left: '70%'
}
],
xAxis: [
{
type: 'value',
scale: true,
gridIndex: 0,
min: xAxisMin,
max: xAxisMax,
},
{
type: 'category',
scale: true,
axisTick: { show: false },
axisLabel: { show: false },
axisLine: { show: false },
splitLine: { show: false },
gridIndex: 1,
},
{
scale: true,
axisTick: { show: false },
axisLabel: { show: false },
axisLine: { show: false },
splitLine: { show: false },
gridIndex: 2,
}
],
yAxis: [
{
scale: true,
type: 'value',
gridIndex: 0,
max: yAxisMax,
min: yAxisMin,
},
{
scale: true,
axisTick: { show: false },
axisLabel: { show: false },
axisLine: { show: false },
splitLine: { show: false },
gridIndex: 1,
},
{
scale: true,

    type: 'category',
    axisTick: { show: false },
    axisLabel: { show: false },
    axisLine: { show: false },
    splitLine: { show: false },
    gridIndex: 2,
  }
],

Current Behavior

image

Expected Behavior

one-to-one correspondence

Environment

OS: macOS Monterey
Browser: Chrome 96.0.4664.55
Framework Vue@3

Any additional comments?

No response

@xieyeying xieyeying added the bug label Dec 25, 2024
@echarts-bot echarts-bot bot added en This issue is in English pending We are not sure about whether this is a bug/new feature. labels Dec 25, 2024
@helgasoft
Copy link

Your Minimal Reproduction code is incomplete.
The official example works OK.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug en This issue is in English pending We are not sure about whether this is a bug/new feature.
Projects
None yet
Development

No branches or pull requests

2 participants