Question

我有一个c3.js图表，其中包含4个数据集。是否可以将工具栏设置为仅显示1组数据？

在下面的代码中，我只希望工具提示显示data4。

var chart = c3.generate({
    bindto: '#chart3',
    data: {
      //x: 'x1',
      xFormat: '%d/%m/%Y %H:%M', // how the date is parsed
      xs: {
            'data1': 'x1',
            'data2': 'x2',
            'data3': 'x3',
            'data4': 'x4'
      },      
      columns: [
        x1data,
        y1data,
        x2data,
        y2data,  
        x3data,
        y3data,
        x4data,
        y4data,          
      ],
      types: {
        data1: 'area',
      }, 
    },
    legend: {
        show: false
    }   

});

有show：false的工具提示选项，但是将其全部禁用。只能显示1个数据集吗？

Answer 1

tooltip.position（）函数可用于控制工具提示的位置，我们可以将工具提示的位置设置在画布之外，这是一种快速技巧，可以在我们不希望看到它时将其隐藏。但是，我不知道如何返回未记录的默认值-也许其他人可以对此进行详细说明。

  tooltip: {
    grouped: false,
    position: (data, width, height, element) => {
      if (data[0].id === 'data2'){    // <- change this value to suit your needs
          return { top: 40, left: 0 };
      }
      return { top: -1000, left: 0 };
    }
  }

编辑：在寻找解决方案后，我发现Billboard.js（github上C3.js的一个分支）提供了一个tooltip.onshow（）函数，API文档说这是“将在显示工具提示”。因此，看来Billboard.js已经具有潜在的解决方案，您可以在其中拦截数据并隐藏工具提示。

c3.js-隐藏特定数据集的工具提示

1 个答案: