Graphic Walker Export Chart Config API

When you embed graphic walker in your own service, it would be great to allow users to save their visualizations in your service. In this case, you need a way to access graphic-walker's view state, export, and save it.

Graphic Walker now does not provide a direct callback to export the view status when changing, but it will be supported in version 0.5.0.

Now, in version 4.x, it provides a ref that allows you to get the store inside graphic-walker. You can pass a ref variable to it to get the store and then use all internal API on it.

Example of export chart's config

// in a react functional component:
const gw = useRef<VizSpecStore | null>(null);

function exportChartConfigs () {
  let chartConfigList = [];
  if (gw.current) {
    chartConfigList = gw.current.exportCode();
  }
  return chartConfigList;
}


return <div>
  <button onClick={exportChartConfigs}>Export Charts</button>
  <GraphicWalker storeRef={gw} />
</div>

Or Play with a live demo in Code Sandbox