Change Plot Type

Plot refers to a line in a line chart, a column in the column chart or an area in the area chart.

In this article, we'll see how to change the plot types of the chart.

Let's create a time series chart using a line as the data plot showcasing online sales of SuperStore in the United States of America.

The chart is shown below:

FusionTime will load here..

To change the plot type of the above chart change the code below in the index.html file:

let fusionDataStore = new FusionCharts.DataStore();
let fusionTable = fusionDataStore.createDataTable(data, schema);

new FusionCharts({
    type: 'timeseries',
    renderAt: 'container',
    width: "95%",
    height: 650,
    dataSource: {
        data: fusionTable,
        chart: {
        },
        caption: {
          text: 'Online Sales of a SuperStore in the US'
        },
        yaxis: {
            "plot": {
                "value": "Sales",
                "type": "column"  
            }
        }
    }
}).render()

In the above code:

  • Create plot object for y-axis in dataSource.

  • Set the type attribute to column.

The chart with the updated plot type is shown below:

FusionTime will load here..