Reword README, use a graph object in example

README.md

@@ -2,7 +2,7 @@
 
 This is a collection of packages for working with <a href="https://graphviz.org">Graphviz</a> in JavaScript. The main package, [viz](./packages/viz), is a WebAssembly build of Graphviz with a simple JavaScript wrapper.
 
-With Viz.js, you can easily render a graph written in [Graphviz's DOT language](https://www.graphviz.org/doc/info/lang.html) and display it as an SVG element in a webpage:
+With Viz.js, you can easily render a graph diagram as an SVG element to display it in a webpage:
 
 ```js
 import { instance } from "@viz-js/viz";

packages/examples/parcel/index.js

@@ -1,9 +1,19 @@
 import { graphvizVersion } from "@viz-js/viz";
 
+function randomNode() {
+  return Math.ceil(Math.random() * 10);
+}
+
+function randomGraph() {
+  return {
+    edges: Array.from({ length: 10 }, () => ({ tail: randomNode(), head: randomNode() }))
+  };
+}
+
 document.getElementById("version").appendChild(document.createTextNode(graphvizVersion));
 
 import("@viz-js/viz")
   .then(module => module.instance())
   .then(viz => {
-    document.getElementById("output").appendChild(viz.renderSVGElement("digraph { a -> b }"));
+    document.getElementById("output").appendChild(viz.renderSVGElement(randomGraph()));
   });

packages/examples/parcel/package.json

@@ -3,7 +3,7 @@
   "version": "0.0.0",
   "private": true,
   "dependencies": {
-    "@viz-js/viz": "3.1.0",
+    "@viz-js/viz": "3.1.0-dev",
     "parcel": "^2.9.3"
   },
   "browserslist": "> 0.5%, last 2 versions, not dead",

packages/viz/README.md

@@ -8,26 +8,23 @@ Viz.js is published on NPM as `@viz-js/viz`.
 
 ## Usage
 
-Call `instance()`, which returns a `Promise` that resolves to a new `Viz` instance. Then call any of the instance's `render` methods to render a graph written in [the DOT language](https://www.graphviz.org/doc/info/lang.html). The `renderSVGElement()` method is convenient for displaying a graph in a webpage. The instance can be reused for multiple `render` calls.
+Call `instance()`, which returns a `Promise` that resolves to a new `Viz` instance. Then call any of the instance's `render` methods to render a graph. A graph can be written in [the DOT language](https://www.graphviz.org/doc/info/lang.html) or as a plain JavaScript object. The `renderSVGElement()` method is convenient for displaying a graph in a webpage. The instance can be reused for multiple `render` calls.
 
 ```js
 <script type="module">
 
   import { instance } from "@viz-js/viz";
 
   instance().then(function(viz) {
+    // DOT string
     document.body.appendChild(viz.renderSVGElement("digraph { a -> b }"));
-  });
-
-</script>
-```
-
-```js
-<script src="viz-standalone.js"></script>
-<script>
-
-  Viz.instance().then(function(viz) {
-    document.body.appendChild(viz.renderSVGElement("digraph { a -> b }"));
+
+    // Graph object
+    document.body.appendChild(viz.renderSVGElement({
+      edges: [
+        { tail: "a", head: "b" }
+      ]
+    }));
   });
 
 </script>