Chart Editor

Overview

Chart Editor is an AnyChart Extension that provides a UI allowing you to create and set up various chart types. The result can be saved with the data in XML or JSON format or in a reusable format with a JavaScript code string.

Prerequisites

Chart Editor works only if proper AnyChart files are included.

Minimal

<!-- anychart -->
<script src="https://cdn.anychart.com/releases/8.4.0/js/anychart-bundle.min.js"></script>

<!-- anychart CSS -->
<link href="https://cdn.anychart.com/releases/8.4.0/css/anychart-ui.min.css" type="text/css" rel="stylesheet">
<link href="https://cdn.anychart.com/releases/8.4.0/fonts/css/anychart-font.min.css" type="text/css" rel="stylesheet">

Maps

It is recommended to include proj4.js if you plan to use Maps:

<!-- include this if you plan to use Maps -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/proj4js/2.3.15/proj4.js"></script>

Themes

If you want to use themes, you need to include desired theme files as well:

<!-- themes -->
<script src="https://cdn.anychart.com/releases/8.4.0/themes/coffee.min.js"></script>
<script src="https://cdn.anychart.com/releases/8.4.0/themes/dark_blue.min.js"></script>
<script src="https://cdn.anychart.com/releases/8.4.0/themes/dark_earth.min.js"></script>
<script src="https://cdn.anychart.com/releases/8.4.0/themes/dark_glamour.min.js"></script>
<script src="https://cdn.anychart.com/releases/8.4.0/themes/dark_provence.min.js"></script>
<script src="https://cdn.anychart.com/releases/8.4.0/themes/dark_turquoise.min.js"></script>
<script src="https://cdn.anychart.com/releases/8.4.0/themes/light_blue.min.js"></script>
<script src="https://cdn.anychart.com/releases/8.4.0/themes/light_earth.min.js"></script>
<script src="https://cdn.anychart.com/releases/8.4.0/themes/light_glamour.min.js"></script>
<script src="https://cdn.anychart.com/releases/8.4.0/themes/light_provence.min.js"></script>
<script src="https://cdn.anychart.com/releases/8.4.0/themes/light_turquoise.min.js"></script>
<script src="https://cdn.anychart.com/releases/8.4.0/themes/monochrome.min.js"></script>
<script src="https://cdn.anychart.com/releases/8.4.0/themes/morning.min.js"></script>
<script src="https://cdn.anychart.com/releases/8.4.0/themes/pastel.min.js"></script>
<script src="https://cdn.anychart.com/releases/8.4.0/themes/sea.min.js"></script>
<script src="https://cdn.anychart.com/releases/8.4.0/themes/wines.min.js"></script>

Files

Chart Editor files to be included:

<!-- chart editor CSS-->
<link href="https://cdn.anychart.com/releases/8.4.0/css/anychart-editor.min.css" type="text/css" rel="stylesheet"></script>
<!-- chart editor JS-->
<script src="https://cdn.anychart.com/releases/8.4.0/js/anychart-editor.min.js"></script>

Using

AnyChart Chart Editor UI can be configured and used in several ways - please see Configuration and Use Cases to learn more.

Contributing

AnyChart Chart Editor is developed and supported by AnyChart team, but it is not a part of the main AnyChart library. It is open source, but subject to licensing. If you want to contribute, fork, or report issues, please see https://github.com/AnyChart/chart-editor/.

Licensing

Please contact AnyChart Licensing Team if you are planning to use AnyChart Charts Editor in your project.