diff --git a/packages/react-vega-demo/stories/index.stories.js b/packages/react-vega-demo/stories/index.stories.js
index 300437a2..127e130c 100644
--- a/packages/react-vega-demo/stories/index.stories.js
+++ b/packages/react-vega-demo/stories/index.stories.js
@@ -6,5 +6,6 @@ import ReactVegaDemo from './ReactVegaDemo';
import ReactVegaLiteDemo from './ReactVegaLiteDemo';
import './style.css';
-storiesOf('react-vega', module).add('Vega', () => );
-storiesOf('react-vega', module).add('VegaLite', () => );
+storiesOf('react-vega', module)
+ .add('Vega', () => )
+ .add('VegaLite', () => );
diff --git a/packages/react-vega-demo/stories/style.css b/packages/react-vega-demo/stories/style.css
index d6590515..2c281abf 100644
--- a/packages/react-vega-demo/stories/style.css
+++ b/packages/react-vega-demo/stories/style.css
@@ -1,6 +1,5 @@
body{
font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
- text-align: center;
}
h1, h2, h3{
diff --git a/packages/react-vega-demo/stories/vegaLiteWithLayers.stories.js b/packages/react-vega-demo/stories/vegaLiteWithLayers.stories.js
new file mode 100644
index 00000000..9218dc2c
--- /dev/null
+++ b/packages/react-vega-demo/stories/vegaLiteWithLayers.stories.js
@@ -0,0 +1,36 @@
+/* eslint-disable react/jsx-filename-extension */
+import React from 'react';
+// eslint-disable-next-line import/no-extraneous-dependencies
+import { storiesOf } from '@storybook/react';
+import { VegaLite } from '../../react-vega/src';
+
+const DATA = {
+ myData: [
+ { a: "A", b: 20 },
+ { a: "B", b: 34 },
+ { a: "C", b: 55 },
+ { a: "D", b: 19 },
+ { a: "E", b: 40 },
+ { a: "F", b: 34 },
+ { a: "G", b: 91 },
+ { a: "H", b: 78 },
+ { a: "I", b: 25 }
+ ]
+};
+
+const SPEC = {
+ description: "A simple bar chart with embedded data.",
+ layer: [
+ {
+ data: { name: "myData" },
+ encoding: {
+ x: { field: "a", type: "ordinal" },
+ y: { field: "b", type: "quantitative" }
+ },
+ mark: "bar"
+ }
+ ]
+};
+
+storiesOf('react-vega', module)
+ .add('VegaLite with layers', () => <>
{JSON.stringify(SPEC, null, 2)}
>);
diff --git a/packages/react-vega/src/Vega.tsx b/packages/react-vega/src/Vega.tsx
index 21501e7c..18465689 100644
--- a/packages/react-vega/src/Vega.tsx
+++ b/packages/react-vega/src/Vega.tsx
@@ -5,7 +5,6 @@ import isFunction from './utils/isFunction';
import { PlainObject, View, ViewListener } from './types';
import shallowEqual from './utils/shallowEqual';
import { NOOP } from './constants';
-import getDatasetNamesFromSpec from './utils/getDatasetNamesFromSpec';
export type VegaProps = VegaEmbedProps & {
data?: PlainObject;
@@ -53,10 +52,10 @@ export default class Vega extends React.PureComponent {
};
update() {
- const { data, spec } = this.props;
+ const { data } = this.props;
if (data) {
- const datasetNames = getDatasetNamesFromSpec(spec).filter(name => data[name]);
+ const datasetNames = Object.keys(data);
if (this.vegaEmbed.current && datasetNames.length > 0) {
this.vegaEmbed.current.modifyView(view => {