@splunk/dashboard-core v27.0.0
@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>
);
23 days ago
24 days ago
24 days ago
25 days ago
25 days ago
25 days ago
26 days ago
2 months ago
3 months ago
3 months ago
4 months ago
6 months ago
6 months ago
9 months ago
6 months ago
6 months ago
8 months ago
8 months ago
9 months ago
9 months ago
6 months ago
6 months ago
9 months ago
10 months ago
12 months ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago