Skip to content

This issue was moved to a discussion.

You can continue the conversation there. Go to discussion →

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

Getting the length of a horizontal bar after animation #317

Closed
thoughtassassin opened this issue May 31, 2022 · 1 comment
Closed

Getting the length of a horizontal bar after animation #317

thoughtassassin opened this issue May 31, 2022 · 1 comment
Labels

Comments

@thoughtassassin
Copy link

I created a Stack Overflow with this question. Here is the codepen that I am working on. I want to get the width of the bar in the offset function after the chart animates. Is there a way to do that? Currently, with the animation on the width returns NaN.

@stockiNail
Copy link
Contributor

@thoughtassassin I think you should use getProps method of data element.

Here is the doc from CHART.JS:

  /**
   * Gets the current or final value of each prop. Can return extra properties (whole object).
   * @param {string[]} props - properties to get
   * @param {boolean} [final] - get the final value (animation target)
   * @return {object}
   */
  getProps(props, final) {
   ... 
  }
}

To get the value of width at the end of animation, have a look to following code, taken from you codepen:

offset: function(context) {
  const chart = context.chart;
  const area = chart.chartArea;
  const meta = chart.getDatasetMeta(context.datasetIndex);
  const model = meta.data[context.dataIndex];
  // passing true you can get the final value of element property
  // at the end of animation
  const {width} = model.getProps(['width'], true); 
  console.log('width: ' + width); 
  return 4;
}

@chartjs chartjs locked and limited conversation to collaborators Jun 9, 2022
@simonbrunel simonbrunel converted this issue into discussion #320 Jun 9, 2022

This issue was moved to a discussion.

You can continue the conversation there. Go to discussion →

Labels
Projects
None yet
Development

No branches or pull requests

3 participants