Chart from JSON

Demonstrates how to use the Builder Api to create a Chart from JSON using SciChart.js. Adjust the JSON in the window below and the chart will re-build. Choose from pre-selected defaults to learn more about the Builder API.

{
    "surface": { "theme": { "type": "Navy" }},
    "series": { "type": "SplineLineSeries",
        "options": { "stroke": "red" },
        "xyData": { "xValues": [1,3,4,7,9], "yValues": [10,6,7,2,16] }
    },
    "yAxes": { "type": "NumericAxis", "options": { "visibleRange": {"min": 0, "max": 20} } },
    "annotations": [{
        "type": "SVGTextAnnotation", "options": { "text": "Builder API Demo", "x1": 0.5, "y1": 0.5, "opacity": 0.33,
              "yCoordShift": -26, "xCoordinateMode": "Relative", "yCoordinateMode": "Relative",
              "horizontalAnchorPoint": "Center", "verticalAnchorPoint": "Center",
              "fontSize": 42, "fontWeight": "Bold"
            }
        },
        {
            "type": "SVGTextAnnotation", "options": { "text": "Create SciChart charts from JSON", "x1": 0.5, "y1": 0.5, "opacity": 0.33,
                "yCoordShift": 26, "xCoordinateMode": "Relative", "yCoordinateMode": "Relative",
                "horizontalAnchorPoint": "Center", "verticalAnchorPoint": "Center",
                "fontSize": 36, "fontWeight": "Bold"
            }
        }]
}

2D Charts

3D Charts

JavaScript 3D Chart Types

JavaScript 3D Bubble Chart JavaScript Surface Mesh 3D Chart JavaScript Point Line 3D Chart LiDAR 3D Point Cloud of Geospatial Data Tenor Curves Demo JavaScript Realtime Surface Mesh 3D Chart

Quick Links

Home WPF Charts WPF 3D Charts iOS & macOS Charts Android Charts JavaScript Charts Pricing News NEW! SciChart Blog About Us EULA Sitemap

Useful Links

Download FREE Trials Installing and Uninstalling SciChart WPF Testimonials & Reviews Community & Support WPF Chart Examples iOS & macOS Chart Examples Android Chart Examples JavaScript Chart Examples

Contact us

Not sure where to start? Contact us, we are happy to help!

SciChart Ltd, 16 Beaufort Court, Admirals Way, Docklands, London, E14 9XL.

SciChart.js

SciChart.js Demo

Chart from JSON

Featured Apps

Performance Demos & Showcases

Scientific & Medical Charts

Financial Charts

2D Charts

JavaScript Chart Types

Chart Annotations

Chart Legends

Chart Axis APIs

Axis Label Customization

Styling and Theming

Tooltips and Hit-Test

Zoom and Pan a Chart

Transforming Data with Filters

Animation API

Builder (JSON / JS Objects) API

Subcharts API

Multiple Charts

3D Charts

JavaScript 3D Chart Types

Quick Links

Useful Links

Contact us