get data from hashmap into highcharts

Im new to angular and charts, so i choose to work with highcharts, i have this service that return a hashmap i want to put the values into vertical bar i want so replace the static data with the dynamic data from the service using this way:

chart = new Chart({
  chart: {
    type: 'column'
  },
  title: {
    text: 'errors'
  },
  credits: {
    enabled: false
  },
  series: [{
    name: 'Population',
    data: this.data,
  }]

})

and this is my service inside ngOnInit:

this.dashboardHttpService.exceptionsByMicroseviceDaily().subscribe(success=> {
this.data=Object(success);
console.log(this.data);
})

i got no result, please how vertical bar of high charts work with hashmap

Edit:
this is what console.log(this.data) renders:
{Timeout: 180, ClientHandler: 307, Transport: 199, UnknownHost: 127, Reflections: 140}

ClientHandler:307
Reflections:140
Timeout:180
Transport:199
UnknownHost:127

and this is what i put on my html page:

dashboard.component.html

 <div class="content"> <div [chart]="chart"></div>

everything works fine with static data so there's no dependancy or configuration missing or something like that.

The reason the chart does not work is because your series will look like the following when you assigned the dynamic this.data to the chart:

series: [{
    name: 'Population',
    data: [Timeout: 180, ClientHandler: 307, Transport: 199, UnknownHost: 127, Reflections: 140]
}]

This is an incorrect format for series. The format should be one of the two below:

Plot all data points as one

series [{ name: 'Population', data:[180, 307, 199, 127, 140] }]

Plot all data points as a serie per name

series [{ name: 'Timeout', data: [180] }, { name: 'ClientHandler', data: [307] }, { ... }]

So, you would need to write a loop which divides the response into one of the above formats. Seeing your chart structure, I think you are looking for the second approach.

I made a simple for-loop which extracts the data from the object for demo purposes:

var testdata = {Timeout: 180, ClientHandler: 307, Transport: 199, UnknownHost: 127, Reflections: 140}
var chartdata = []
var i = 0;
Object.keys(testdata).forEach(function(key) {

  chartdata[i++] = {name: key, data: [testdata[key]]};

});

After this loop, chartdata will be looking like:

[{ name: 'Timeout', data: [180] }, { name: 'ClientHandler', data: [307] }, { ... }]

All which is left is change the code from series to accept the chartdata as the whole series object:

series: chartdata

The chart will work.

Here you can find a very simple JSFiddle showing this.