docs-mintlify/embedding/vizard.mdx
Chart Prototyping generates code of a front-end application that works with the REST (JSON) API and visualizes data on charts. It's convenient for boostrapping a new embedded analytics application or copying and pasting code to an existing one.
<Info>Chart Prototyping is part of Playground.
</Info>To access Chart Prototyping from Playground, compose and run a query, expand the Chart pane, and click Code on the right:
<iframe width="100%" height="400" src="https://www.youtube.com/embed/OFiJ8AVNHQw" title="YouTube video" frameBorder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowFullScreen />Chart Prototyping shows you a preview of the chart on the Preview tab:
<Frame> </Frame>You can also customize the chart by choosing a visualization type, a framework, a charting library, or one of other options in the sidebar.
<Info>If you'd like to request the support for a specific charting library or framework, please contact us.
</Info>You can also browse the generated code of this application on the Code tab:
<Frame> </Frame>Finally, you can download a ZIP archive with the code and the file with your Cube Cloud credentials using the buttons on the bottom of the Code tab:
<Frame> </Frame>First, unarchive the code. Then, rename the credentials file to .env.local
(so that it starts with a dot) and place it into the folder with unarchived code.
You can now run the application with the following commands:
npm install
npm run dev