Changing the default Marker Style in LeafletJS

Default marker
var LeafIcon = L.Icon.extend({
options: {
iconSize: [38, 95],
shadowSize: [50, 64],
iconAnchor: [22, 94],
shadowAnchor: [4, 62],
popupAnchor: [-3, -76]
}
});
var customIcon = new LeafIcon({
iconUrl: 'http://leafletjs.com/examples/custom-icons/leaf-green.png',
shadowUrl: 'http://leafletjs.com/examples/custom-icons/leaf-shadow.png'
})
var drawControl = new L.Control.Draw({position: 'bottomleft',draw: {marker: {icon: customIcon},},edit: {featureGroup: drawnItems}});map.addControl(drawControl);

Full Code;

--

--

--

I am an undergraduate at the University of Moratuwa following a degree in Information Technology and Management.

Love podcasts or audiobooks? Learn on the go with our new app.

Recommended from Medium

Progressive Web Apps and React.js

A phone and laptop

Understanding Javascript imports and exports

Local Storage: What, When, and How?

React Native: Working with Objects

How To Setup An Express JS Server With Nodemon and Babel

ESP32 Project #7: Bluetooth

Why has Node.Js become a gold standard for Enterprise Web Apps?

Essential Methods of JavaScript for Beginners

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store
Bojitha Piyathilake

Bojitha Piyathilake

I am an undergraduate at the University of Moratuwa following a degree in Information Technology and Management.

More from Medium

The Async Evolution: A JavaScript Cheat Code

Enhancing Recursion with Memoization

Bezier Surface Implementation in OpenGL

Types of Errors