Can we create bar chart in lightning component?

Hello,

Yes, you can create Bar chart in lightning component using HighStock.js and HighChart.js. These are help you to create chart in lightning component.

I have a sample to create chart in lightning component:-

ChartCmp:-

<aura:component >
<ltng:require scripts="/resource/highstock_4_2_3/js/highstock-all.js, /resource/highstock_4_2_3/js/highcharts-3d.js, /resource/highmaps_4_2_3/js/modules/map.js"
afterScriptsLoaded="{!c.afterScriptsLoaded}"/>

<div aura:id="chart" class="chart_sec" style="width:20%; height:200px;"/>
</aura:component>

ChartCmp.js:-

({
afterScriptsLoaded : function(component, event, helper) {
var chart = new Highcharts.Chart({
chart: {
renderTo: component.find("chart").getElement(),
plotBackgroundColor: null,
plotBorderWidth: null,
plotShadow: false,
type: 'pie',

},
title: {
text: 'Browser market January, 2015 to May, 2015'
},
tooltip: {
pointFormat: '{series.name}: <b>{point.percentage:.1f}%</b>'
},
plotOptions: {
pie: {
allowPointSelect: true,
cursor: 'pointer',
dataLabels: {
enabled: true,
format: '<b>{point.name}</b>: {point.percentage:.1f} %',
style: {
color: (Highcharts.theme && Highcharts.theme.contrastTextColor) || 'black'
}
}
}
},
series: [{
type: 'pie',
name: 'Browser share',
data: [
['Firefox', 45.0],
['Chrome', 26.8],
{
name: 'IE',
y: 9.8,
sliced: true,
selected: true
},
['Safari',8.0],
['Opera', 9.2],
['Others', 10.7]
]
}]
});
},

})

ChartApp:-

<aura:application access="GLOBAL" extends="ltng:outApp">
<c:ChartCmp />
</aura:application>