How can I use an SVG image as a map marker in OpenLayers-3?

Question

I am trying to create map \"pin-drops\" (ie. map markers) in OpenLayers-3 (OL3) using SVG images.

Currently, I am using PNG images as the pindrops that reference the

Answer 1

SVG icons work fine as long as the content-type of your SVG image file is image/svg+xml. Also note that no external references are supported inside the SVG. OpenLayers 3 simply uses the drawImage function of the 2d context. You can find more details on the requirements of SVG content here: https://developer.mozilla.org/en-US/docs/Web/API/Canvas_API/Drawing_DOM_objects_into_a_canvas.