Vue Graphic Walker

@kanaries/vue-graphic-walker is a Vue component that allows you to create a graphic walker (a lite opensource tableau alternative).

graphic-walker-banner

Usage

Step 1: install package

npm i --save @kanaries/vue-graphic-walker

Step 2: use component in vue.

<script setup lang="ts">
import { VueGraphicWalker } from '@kanaries/vue-graphic-walker';
</script>

<template>
  <VueGraphicWalker />
</template>

Docs

props of component is same as graphic-walker:

export interface IGWProps {
    dataSource?: IRow[];
    rawFields?: IMutField[];
    spec?: Specification;
    hideDataSourceConfig?: boolean;
    i18nLang?: string;
    i18nResources?: { [lang: string]: Record<string, string | any> };
    keepAlive?: boolean;
    /**
     * auto parse field key into a safe string. default is true
     */
    fieldKeyGuard?: boolean;
    /** @default "vega" */
    themeKey?: IThemeKey;
    dark?: IDarkMode;
    storeRef?: React.MutableRefObject<IGlobalStore | null>;
    toolbar?: {
        extra?: ToolbarItemProps[];
        exclude?: string[];
    };
}

GitHub

View Github