How do I decrease the size of Icon in openlayers 3, i am using bing maps

openlayers-3
user1960217 picture user1960217 · Mar 5, 2015 · Viewed 12.3k times · Source

This is my code:

var iconFeature = new ol.Feature({
   geometry: new ol.geom.Point(ol.proj.transform([-95.3698,29.7604], 'EPSG:4326' , 'EPSG:3857')),
   name: 'Null Island',
});

var iconStyle = new ol.style.Style({
  image: new ol.style.Icon({
    opacity: 0.75,
    src: 'flag.png',
    height:10,
    width:10,
  })
});
iconFeature.setStyle(iconStyle);

I have tried using anchor also, but I could not decrease the size, please help

Answer

tsauerwein picture tsauerwein · Mar 6, 2015

ol.style.Icon takes a scale parameter that you can use to scale your icon.

var iconStyle = new ol.style.Style({
  image: new ol.style.Icon({
    opacity: 0.75,
    src: 'flag.png',
    // the real size of your icon
    size: [10, 10],
    // the scale factor
    scale: 0.5
  })
});

Related questions

Access to Image from origin 'null' has been blocked by CORS policy

I have JavaScript application in OpenLayers 3, and my base layer is created from local tiles. I work only in my computer so I do not know why I have CORS error. var newLayer = new ol.layer.Tile({ source: new ol.…

Read More
how to add markers with OpenLayers 3

I'm trying to add makers on a OpenLayers 3 map. The only example I have found is this one in the OpenLayers example list. But the example uses ol.Style.Icon instead of something like OpenLayers.Marker in OpenLayers 2. First Question …

Read More
Adding event handler to feature in OpenLayers 3?

I am using the following code to add a feature to a vector layer in OpenLayers 3 (OL3): marker = new ol.Feature({ geometry: new ol.geom.Point([longitude, latitude]), name: "Location Marker" }); markerStyle = new ol.style.Style({ image: new ol.style.…

Read More