failed to add a leaflet ruler plugin

i always get : js: Uncaught ReferenceError: map is not defined

Add Leaflet-Ruler plugin

    m.get_root().header.add_child(folium.CssLink("https://unpkg.com/[email protected]/dist/leaflet.css"))
    m.get_root().header.add_child(folium.CssLink("https://cdn.rawgit.com/gokertanrisever/leaflet-ruler/master/src/leaflet-ruler.css"))
    m.get_root().html.add_child(folium.JavascriptLink("https://unpkg.com/[email protected]/dist/leaflet.js"))
    m.get_root().html.add_child(folium.JavascriptLink("https://cdn.rawgit.com/gokertanrisever/leaflet-ruler/master/src/leaflet-ruler.js"))
    my_js = '''
    L.control.ruler().addTo(map);
    '''
    m.get_root().script.add_child(folium.Element(my_js))

i trired to add this plugin to a folium map in python but i always get error