@visactor/vchart-theme-utils NPM

@visactor/vchart-theme

Description

The extension themes for VChart.

The list of themes included here is as follows, with links to the theme JSON files:

vScreenVolcanoBlue 大屏-火山蓝
vScreenClean 大屏-清新蜡笔
vScreenOutskirts 大屏-郊外
vScreenBlueOrange 大屏-汽车蓝橙
vScreenFinanceYellow 大屏-金融黄
vScreenWenLvCyan 大屏-文旅青
vScreenElectricGreen 大屏-电力绿
vScreenECommercePurple 大屏-电商紫
vScreenRedBlue 大屏-红蓝
vScreenPartyRed 大屏-党建红

Usage

Import the full theme map and register them in sequence:

import { allThemeMap } from '@visactor/vchart-theme';
import VChart from '@visactor/vchart';

// register themes
allThemeMap.forEach((theme, name) => {
  VChart.ThemeManager.registerTheme(name, theme);
});

// apply a theme
VChart.ThemeManager.setCurrentTheme('vScreenVolcanoBlue');

If you only use a specific theme, you can also import the specific theme JSON from this package:

import vScreenVolcanoBlue from '@visactor/vchart-theme/public/vScreenVolcanoBlue.json';
import VChart from '@visactor/vchart';

// register the theme
VChart.ThemeManager.registerTheme('vScreenVolcanoBlue', vScreenVolcanoBlue);

// apply the theme
VChart.ThemeManager.setCurrentTheme('vScreenVolcanoBlue');