I'm currently working on a student project and I need help. I'm using Python, VueJS and OpenStreetMap. The task is to use free tools or services to get a layer of roads and draw a heat map on them. The heat map I need is what you see when you build a route in a navigator, which shows traffic congestion in green, yellow and red colors.
Just about what I need. So that the heat map of the traffic only covers the road sections, and does not go beyond them.

If any way, even with paid services, you can't draw a road heatmap layer like the one in the picture above, here's another option that will work for me.

The last picture is something I already know how to draw, but it doesn't work for me because the heat map goes too far out of the way. I need the heat map to stay only within the boundaries of the road. I also need it to be uninterrupted, meaning that the entire road is green and only in the places I want it to be in other colors.

If you're interested, there's a device that is installed in public transport that detects, recognizes potholes on the road in real time. Then all the collected telemetry is uploaded to the server, where I already display a heat map with potholes on the roads on the web map.
So if anyone knows how to draw the heat map I need, I would be very grateful.