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

[Feature] crosshair can update when chart updated by datazoom #3667

Open
xile611 opened this issue Jan 14, 2025 · 0 comments
Open

[Feature] crosshair can update when chart updated by datazoom #3667

xile611 opened this issue Jan 14, 2025 · 0 comments
Assignees

Comments

@xile611
Copy link
Contributor

xile611 commented Jan 14, 2025

What problem does this feature solve?

const response = await fetch('https://lf9-dp-fe-cms-tos.byteorg.com/obj/bit-cloud/stocks.json');
const data = await response.json();
const spec = {
  color: ['#1ac7c2', '#6f40aa', '#ccf59a', '#D4ADFC'],
  type: 'bar',
  dataId: 'bar',
  xField: 'Date',
  yField: 'Close',
  seriesField: 'Symbol',
  dataZoom: [
    {
      orient: 'bottom',
      backgroundChart: {
        area: {
          style: {
            lineWidth: 1,
            fill: '#D1DBEE'
          }
        },
        line: {
          style: {
            stroke: '#D1DBEE',
            lineWidth: 1
          }
        }
      },
      selectedBackgroundChart: {
        area: {
          style: {
            lineWidth: 1,
            fill: '#fbb934'
          }
        },
        line: {
          style: {
            stroke: '#fbb934',
            lineWidth: 1
          }
        }
      }
    }
  ],
  legends: {
    visible: true,
    orient: 'top'
  },
  title: {
    text: 'This line chart shows the weekly price of several technology stocks in from 2016 to 2018 relative to each stock’s price on the highlighted date.',
    textStyle: {
      height: 50,
      lineWidth: 3,
      fill: '#333',
      fontSize: 25,
      fontFamily: 'Times New Roman'
    }
  },
  data: [
    {
      id: 'bar',
      values: data
    }
  ],
  crosshair: {
    trigger: []
  }
};

const vchart = new VChart(spec, { dom: CONTAINER_ID, animation: false });
vchart.renderSync();

vchart.setDimensionIndex('2018-02-07', { tooltip: false })

// 只为了方便控制台调试用,不要拷贝
window['vchart'] = vchart;

当 crosshair 常显的时候,crosshair 能够动态更新位置

What does the proposed API look like?

暂无

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant