Flame Chart

Overview

JavaScript flame charts typically used for profiling in software, flame charts help you break down the most frequent code paths easily.

Actions

There are some default user interactions you should know about flame charts.

Click

You can click on the chart to zoom in on any piece of the bar.

Click + Drag

You can click and drag to zoom the chart in. You can click on a bar to zoom out.

Type

ZingChart flame charts use the type attribute. In your chart object, add a type attribute and set the value to flame.

let chartConfig = {
	type: 'flame'
};

Data

To enter data into the flame chart, use the series array. Each object in the series array requires a name, value or children array to function properly. More information regarding the series array is available here.

{
  "children": [
    {
      "name": "genunix`syscall_mstate", 
      "value": 89
    }, 
    {
      "children": [
        {
          "name": "genunix`gethrtime_unscaled", 
          "value": 4
        }, 
			]
		}
  ]
}

Summary

Got a question about how depth charts work? We are happy to help. Email support@zingchart.com or start a chat right here on this page for help.