How to output/input in flowy.js flowchart

I’m trying to use a library called flowy which is a drag and drop flowchart but I’m having trouble outputting flowchart data from a data object.

I see on the github page flowy.output(); and flowy.import(output)

but I’m havimg trouble implementing.

Also how can I save a flow diagram that I create?

I tried making a json object to import but I don’t seem to get any blocks outputted. Here is a jsfiddle of what I’m working with.

<link rel="stylesheet" href=""> 
<script src=""></script>
//<div class="create-flowy">The block to be dragged</div>
//<div class="create-flowy">The block</div> 
<div id="canvas" class="create-flowy"></div>
<div id="block-id">


var spacing_x = 50;
var spacing_y = 100;
// Initialize Flowy
flowy(document.getElementById("canvas"), onGrab, onRelease, onSnap, onRearrange, spacing_x, spacing_y);
function onGrab(block){
	// When the user grabs a block
function onRelease(){
	// When the user releases a block
function onSnap(block, first, parent){
	// When a block snaps with another one
  return true;
function onRearrange(block, parent){
	// When a block is rearranged

// As an object

	"html": "",
	"blockarr": [],
	"blocks": [
			"id": 1,
			"parent": 0,
			"data": [
				"name": "blockid",
				"value": "1"
      "id": 2,
      "parent": 1,
      "connector": 2,
      "data": {
      "name": "block-id",
				"value": "2"
			"attr": [
				"id": "block-id",
				"class": "create-flowy"

Thanks so much!