c3.js更改最小/最大值会更改边界

时间:2018-07-24 08:48:13

标签: javascript d3.js c3.js

我有y轴的动态最小值和最大值

  calculateMin() {
    let min = _.minBy(this.props.chartData, function(o) { return o.value; })['value'];
    return this.props.chartData.length <= 1 ? min - 5 : min;
  }

  calculateMax() {
    let max = _.maxBy(this.props.chartData, function(o) { return o.value; })['value'];
    return this.props.chartData.length <= 1 ? max + 5 : max;

  componentDidUpdate() {
    this.ref.current.chart.axis.range({min: {y: this.calculateMin()}, max: {y: this.calculateMax()}});

但是更改时间范围后,我总是会像这样:

enter image description here

enter image description here

enter image description here

enter image description here

我在做什么错以及如何解决?

P.S这是我图表的轴配置:

 axis={{
            x: {
              type: 'timeseries',
              tick: {
                format: x => {
                  return (
                    x.getDate() + ' ' + MONTHS_FOR_CHARTS[x.getUTCMonth()]
                  );
                },
                padding: 0,
                extent: [2, 3],
                count: 4,
              },
            },
            y: {
              // padding: 0,
              inner: true,
              tick: {
                format: data => data + '%',
              },
            },

0 个答案:

没有答案