1. Download the Highcharts plugin
Official Download URL: http://www.highcharts.com/download
2. Introduce the required JS file
<script src= "~/scripts/jquery-1.10.2.min.js" ></script>
<script src= "~/scripts/highcharts-4.2.5/js/highcharts.js" ></script>
3. Create DIV container
<div id= "Container" style= "min-width:800px;height:400px" ></div>
4. Writing Highcharts Code
<script type= "Text/javascript" >
$ (function () {
$ (' #container '). Highcharts ({//Chart display container, same as Div ID
Chart: {
Type: ' column '//Specifies the chart types, default is line chart
},
Title: {
Text: ' URL traffic statistics '//Specify chart title
},
Xaxis: {
Categories: [' Maximum daily visits ', ' evaluation day visits ', ' minimum daily visits ']//Specify X-axis grouping
},
YAxis: {
Title: {
Text: ' Access = number of people (million) '//Specify the title of the y-axis
}
},
Series: [{//Specify data columns
Name: ' 2015 ',//Data column name
Data: [1, 0, 4]//
}, {
Name: ' 2016 ',
Data: [5, 7, 3]
}]
})
});
</script>
Chart plug-in--highcharts plug-in use (a bar chart)