Question

生成c3图表时，您可以定义许多属性以及其他工具提示，如下所示：

generateData = () => {
  const x = randomNR(0, 100);
  const y = randomNR(0, 100);
  const together = x + y;

  return {
    data: {
      columns: [
        ['data1', x],
        ['data2', y],
      ],
      type: 'donut',
    },
    tooltip: {
      format: {
        value: function() {
          return `${x} + ${y} = ${together}`
        }
      }
    },
    donut: {
      title: `Tooltip not getting updated`
    }
  }
};

但是，当生成图表时，我们只能加载新的data属性。我想知道是否也可以更新工具提示？这是我的情况（仅用于说明目的）：https://plnkr.co/edit/8PrbjVqhS9BBYpSbZmkM?p=preview

如您所见，更新数据时，工具提示不再代表正确的值。

Answer 1

尝试类似的方法？

function randomNR(min, max) {
  return Math.floor(Math.random() * (max - min + 1) + min);
}

function f() {
  let x;
  let y;
  let together;
  return () => {
    x = randomNR(0, 100);
    y = randomNR(0, 100);
    together = x + y;
    return {
      data: {
        columns: [
          ['data1', x],
          ['data2', y],
        ],
        type: 'donut',
      },
      tooltip: {
        format: {
          value: function() {
            return `${x} + ${y} = ${together}`
          }
        }
      },
      donut: {
        title: `Tooltip not getting updated`
      }
    }
  };
}

const myGen = f();

const chart = c3.generate({
  bindto: '#chart',
  ...myGen()
});

setTimeout(function() {
  // HOW TO UPDATE THE TOOLTIP HERE?
  chart.load(myGen().data);
}, 2500);

是否可以动态更改c3图表上的工具提示？

1 个答案: