Luigi Cerone Luigi Cerone - 3 months ago 9
jQuery Question

Set width and height of an image loaded with jQuery

I load an image on my web page using

jQuery
like this:

$(function () {
$('#mySelect').change(function () {
var selectedCity = $('#mySelect').val();
var myLatLng = new google.maps.LatLng(eval(selectedCity).lan, eval(selectedCity).lng);
venueMap.setCenter(myLatLng);
image = 'img.png';
marker = new google.maps.Marker({
position: myLatLng,
map: venueMap,
icon: image
});
marker.setMap(venueMap);
});
});


how can I set the width and the height of the image?

I've tried
image.width = 100;
and
image.height = 50;
(as js statements) with no success.

As asked my relevant HTML code:

....
<body>
<center>
<h2>Testing jQuery with Google Maps</h2>
<br>
<br>
<select id="mySelect">
<option value="Rome">Rome</option>
<option value="London">London</option>
</select>
<br>
<br>

<div id="map"></div>
</center>
</body>
.....

Answer

You can add other properties of the image as shown on Google Maps Documentation

    var image = {
      url: 'image.png',
      // This marker is 20 pixels wide by 32 pixels high.
      size: new google.maps.Size(20, 32),
      // The origin for this image is (0, 0).
      origin: new google.maps.Point(0, 0),
      // The anchor for this image is the base at (0, 32).
      anchor: new google.maps.Point(0, 32)
    };

Hope this helps.