How to add HeatMap

[maxchris100]

How to add HeatMap like this, any idea?
https://docs.mapbox.com/help/tutorials/make-a-heatmap-with-mapbox-gl-js/

[maxchris100]

FeatureCollection f = FeatureCollection(features: [
Feature(
id: 1249,
properties: {"dbh": 12},
geometry: GeometryObject.deserialize({
"type": "Point",
"coordinates": [-6.1512002, 106.7061369]
})),
Feature(
id: 1250,
properties: {"dbh": 10},
geometry: GeometryObject.deserialize({
"type": "Point",
"coordinates": [-6.1513002, 106.7062369]
}))
]);
var a = f.toJson();
var b = json.encode(a);
await controller.states.mbController?.style.addSource(GeoJsonSource(
id: "heatmap",
data: b,
));
Map paint = {
'id': 'kelurahan-heat',
'type': 'heatmap',
'source': 'heatmap',
'maxzoom': 13,
'paint': {
'heatmap-weight': {
'property': 'dbh',
'type': 'exponential',
'stops': [
[1, 0],
[62, 1]
]
},
'heatmap-intensity': {
'stops': [
[11, 1],
[15, 3]
]
},
'heatmap-color': [
'interpolate',
['linear'],
['heatmap-density'],
0,
'rgba(236,222,239,0)',
0.2,
'rgb(208,209,230)',
0.4,
'rgb(166,189,219)',
0.6,
'rgb(103,169,207)',
0.8,
'rgb(28,144,153)'
],
'heatmap-radius': {
'stops': [
[11, 15],
[15, 20]
]
},
'heatmap-opacity': {
'default': 1,
'stops': [
[14, 1],
[15, 0]
]
}
}
};
String prop = json.encode(paint);
await controller.states.mbController?.style
.addLayer(HeatmapLayer.decode(prop));

      try this code but not working sir