Newton's Programmatic Measurements
    Wondering what’s next for npm?Check out our public roadmap! »

    @splunk/dashboard-core

    22.0.0 • Public • Published

    @splunk/dashboard-core

    @splunk/dashboard-core is a core component in Dashboard Framework that manages the state between visualizations, inputs and their datasources. You must wrap this component with a DashboardContextProvider.

    It renders a dashboard according to a JSON definition.

    Install

    npm install react react-dom styled-components @splunk/react-ui @splunk/dashboard-core @splunk/dashboard-presets
    
        --or--
    
    yarn add react react-dom styled-components @splunk/react-ui @splunk/dashboard-core @splunk/dashboard-presets
    

    Usage

    import React from 'react';
    import DashboardCore from '@splunk/dashboard-core';
    import CloudViewOnlyPreset from '@splunk/dashboard-presets/CloudViewOnlyPreset';
    import { DashboardContextProvider } from '@splunk/dashboard-context';
    import GeoRegistry from '@splunk/dashboard-context/GeoRegistry';
    import GeoJsonProvider from '@splunk/dashboard-context/GeoJsonProvider';
    
    const definition = {
        dataSources: {
            search1: {
                options: {
                    data: {
                        columns: [['168']],
                        fields: [
                            {
                                name: 'count',
                            },
                        ],
                    },
                    meta: {},
                },
                type: 'ds.test',
            },
        },
        visualizations: {
            single1: {
                type: 'viz.singlevalue',
                options: {},
                dataSources: {
                    primary: 'search1',
                },
            },
            single2: {
                type: 'viz.singlevalue',
                options: {},
                dataSources: {
                    primary: 'search1',
                },
            },
            single3: {
                type: 'viz.singlevalue',
                options: {},
                dataSources: {
                    primary: 'search1',
                },
            },
        },
        layout: {
            type: 'absolute',
            options: {
                width: 1000,
                height: 400,
            },
            structure: [
                {
                    item: 'single1',
                    position: {
                        x: 0,
                        y: 100,
                        w: 200,
                        h: 200,
                    },
                },
                {
                    item: 'single2',
                    position: {
                        x: 400,
                        y: 100,
                        w: 200,
                        h: 200,
                    },
                },
                {
                    item: 'single3',
                    position: {
                        x: 800,
                        y: 100,
                        w: 200,
                        h: 200,
                    },
                },
            ],
        },
    };
    
    const geoRegistry = GeoRegistry.create();
    geoRegistry.addDefaultProvider(new GeoJsonProvider());
    
    export default () => (
        <DashboardContextProvider geoRegistry={geoRegistry}>
            <DashboardCore
                width="100%"
                height={450}
                preset={CloudViewOnlyPreset}
                definition={definition}
            />
        </DashboardContextProvider>
    );

    Keywords

    none

    Install

    npm i @splunk/dashboard-core

    DownloadsWeekly Downloads

    132

    Version

    22.0.0

    License

    SEE LICENSE IN LICENSE.md

    Unpacked Size

    835 kB

    Total Files

    19

    Last publish

    Collaborators

    • avatar
    • avatar