Miniatures show meaning in tables

In the process of data analytics, tables are a common form of representation, which can clearly display data and facilitate reading. However, when the amount of data that needs to be displayed is large or the trend and distribution of the data need to be displayed more intuitively, it may be difficult to rely on tables alone to meet the needs. At this time, the miniature can come into play.

A minigraph is a small chart embedded in a table, which can be used to display information such as trends and distributions without affecting the original table data display. By embedding minigraphs in tables, we can make the data more vivid and intuitive, which helps to better perform data analytics.

Chart Types Supported by Minicharts

In VTable, the table shows the typecellTypeSet tosparklineUsed to generate minigraphs. At present, the miniature chart types provided by VTable only support line graphs. Over time, VTable will gradually enrich the chart types of minigraphs, and will also support various miniature chart types such as bar graphs and area graphs in the future.

Introduction to sparklineSpec configuration for miniatures

SparklineSpec is a configuration object used to set the specific style and behavior of the miniature.

This configuration item can be defaulted and will use the internal default configuration. At the same time, it can be a static object or a function that dynamically generates configuration objects based on cell information. The example code is as follows:

  // ...其他配置
  columns: [
    {
      field: 'timeSeriesData',
      cellType: 'sparkline',
      sparklineSpec: {
        type: 'line',
        // ...其他sparklineSpec配置
      },
      // ...其他配置
    },
    // ...其他列
  ],
  // ...其他配置
}

Or:

{
  // ...其他配置
  columns: [
    {
      field: 'timeSeriesData',
      cellType: 'sparkline',
      sparklineSpec: (cellInfo) => {
        return {
          type: 'line',
          // ...根据cellInfo动态配置
        };
      },
      // ...其他列配置
    },
    // ...其他列
  ],
  // ...其他配置
}

Currently,sparklineSpecFor specific configurable content, please refer to the api.

example

This example will show the miniature effect in different configurations:

Through the above introduction and examples, we can quickly create and configure the table display type sparkline miniature in VTable. Although only line graphs are currently supported, with subsequent development, the functions and types of minigraphs will become more and more perfect, providing more convenient and practical functions for data lake visualization.