Highcharts-bar Chart

1. The bar chart requires the following types of data formats:

["Luke Skywalker", "Darth Vader", "Yoda", "Princess Leia"] [2, 4, 1, 1]

2. Bar Chart code example:

$(function () {    $(' #container '). Highcharts ({chart: {type:' Bar '}, Xaxis: {categories: [' Jan ', ' Feb ', ' Mar ', ' Apr ', ' may ', ' June ', ' Jul ', ' April ', ' Sep ', ' Oct ', ' Nov ', ' Dec ']}, Plotoptions: {series: {allowpointselect:true}}, yaxis:{min:0, Title: {text:' Sales '}, the series: [{data: [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4]        }]    }); //The button action$ (' #button '). Click (function () {        varselectedpoints = $ (' #container '). Highcharts (). getselectedpoints (); Alert (' You selected ' + Selectedpoints.length + ' points '); });});

View Code

：

3. The difference between a histogram (column chart) and a bar chart (bar chart) is that the type attribute of the chart is different, one is column and one bar, but the data and formatting are the same; Change the Type property of chart in item 2 to Column , you can get the following effect:

4. If you need to display the results of different states in the same category (Stackedbar), the data format needs to be modified accordingly:

["Luke Skywalker", "Princess Leia", "Yoda", "Darth Vader"][{"Completed", [1, 0, 0, 1]},{"Active", [1, 1, 1, 2]},{ "Pipeline", [0, 0, 0, 1]}]

5.

Highcharts-bar Chart