Rotate Point Markers GeoJSON Leaflet

Question

I've created a Leaflet map displaying a point layer as GeoJSON. I used a custom icon (an arrow). I would like to rotate this icon on the basis of an attribute included in the GeoJSON file (field "dir"). How should I do?

JSscript code:

var map = L.map('map',{
    center: [5,28],
    zoom: 5,
    minZoom: 2,
    maxZoom: 18
});

L.tileLayer('http:...',{attribution: ...);

var icon = new L.Icon({
    iconUrl:"assets/icon/arrow.svg",
    iconSize: [30],
    });

function funzione (feature, layer) {
    layer.bindPopup("Information <br>" + feature.properties.name);
    layer.setIcon(icon);
};

L.geoJSON(data,{
    onEachFeature: funzione
}).addTo(map);

GeoJson file:

var data = {
"type": "FeatureCollection",
"crs": { "type": "name", "properties": { "name": "urn:ogc:def:crs:OGC:1.3:CRS84" } },                                                                        "features": [
{ "type": "Feature", "properties": { "time": 155011, "lat": -22.978704, "lon": -43.129650, "name": "harbour", "dir": 180} } 
]};

Answer 1

From @Alessandro's comment I looked at the issue with the plugin but it seems to work fine for me. In your case you want to apply this using the following code after renaming icon var to newIcon:

L.geoJSON(data, {
    pointToLayer: function (feature, latlng) {
        return L.marker(latlng, {icon: newIcon, rotationAngle: feature.properties.dir})
    }
}).addTo(map);