<div id="chart-container"></div>

#chart-container{
 height: 500px; 
}

const dataSource = {
           "chart": {
               "bgAlpha": "0",
               "canvasbgAlpha": "0",
               "palettecolors": "#BF835F,#ffd3ba,#40c8f4,#96dff6,#f7941d,#fed098",
               "borderAlpha": "0",
               "showBorder": "0",
               "borderAlpha": "0",
               "showhovereffect": "1",
               "use3DLighting": "0",
               "canvasBorderAlpha": "0",
               "numVDivLines": "0",
               "divLineAlpha": "0",
               "baseFontColor": "#000000",
               "showXAxisLine": "0",
               "showYAxisValues": "0",
               "plotBorderAlpha": "0",
               "labelFontSize": "12",
               "showValues": "1",
               "showToolTip": "0",
               //"plottooltext": "<b>$value</b>",
               "plotSpacePercent": "30",
               "decimals": "0",
               "placevaluesinside": "0",
               "numbersuffix": "%",
               "valueFontsize": "10",
               "showlabel": "1",
               "usePlotGradientColor": "0",
               "plotborderthickness": 0,
               "DivlineAlpha": 0,
               "showAlternateVGridColor": 0,
               "legendBgAlpha": 0,
               "yaxisMaxValue": 100,
               "maxBarHeight": 10,
           },
           "categories": [
               {
                   "category": [ {"label":"brand 1"}, {"label":"brand 2"}, {"label":"brand 3"}, {"label":"brand 4"}]
               }
           ],
           "dataset": [
               {
                   "seriesname": "Unaided",
                   "data": [
                       {
                           "value": "30"
                       },
                       {
                           "value": "26"
                       },
                       {
                           "value": "29"
                       },
                       {
                           "value": "31"
                       }
                   ]
               },
               {
                   "seriesname": "Aided",
                   "data": [
                       {
                           "value": "21"
                       },
                       {
                           "value": "28"
                       },
                       {
                           "value": "39"
                       },
                       {
                           "value": "41"
                       }
                   ]
               }
           ],
       };

FusionCharts.ready(function() {
  
  var myChart = new FusionCharts({
    type: 'stackedbar2d',
       height: '350',
       width: '100%',
       dataFormat: 'json',
       renderAt: 'chart-container',
    dataSource: dataSource
  }).render();
  
});