有什么方法可以根据负/正值隐藏条形图?

时间:2019-11-04 12:54:45

标签: javascript charts bar-chart lightningchart

我正在使用LightningChartJS创建带有条形图的图表。我有正值和负值的数据。是否有任何可用的属性可以用来根据我想看到的东西隐藏负条或正条?

注意:我显然可以编写一些基本的逻辑来实现此功能,但我正在寻找一些内置功能。<​​/ p>

const rectangles = chart.addRectangleSeries()
const addValues = (entries) => {
      for (const entry of entries) {
        bars.push(add(entry))
      }
}


const add = (entry) => {
      // Create rect dimentions.
      const rectDimensions = {
        x: x - figureThickness,
        y: 0,
        width: figureThickness,
        height: entry.value
      }
      // Add rect to the series.
      x += figureThickness + figureGap
      // Return data-structure with both original 'entry' and the rectangle figure that represents it.
      return {
        entry,
        rect
      }
    }

    chart.addValues([
  { category: '', value: 20 },
  { category: '', value: 40 },
  { category: '', value: -23 },
  { category: '', value: -29 },
  { category: '', value: 15 }
])

1 个答案:

答案 0 :(得分:2)

要隐藏基于值的序列/图,您必须在应用程序端实现此逻辑。

为此,您有两个选择:

  1. 将条形图分成两个RectangleSeries,一个具有正值,另一个具有负值。

  2. 像现在一样仅使用一个RectangleSeries,但是分别对每个图形进行样式设置。使用RectangleSeries.add()添加矩形时,您会收到对图形的引用。

在任何一种情况下,您都必须处理隐藏不要想要看到的系列/图形,并恢复想要看到的图形。 RectangleSeries和图形都具有dispose()和restore()方法。