Question

我使用jQuery在我的网页上加载图片，如下所示：

$(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);
    });
});

如何设置图像的宽度和高度？

我已经尝试过了 image.width = 100;和image.height = 50;（作为js语句）没有成功。

正如我的相关HTML代码所示：

....
<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 1

您可以添加图片的其他属性，如Google地图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)
    };

希望这有帮助。

Answer 2

您可以使用选择查询选择任何元素，例如$('#image-id')。.css()函数用于在特定元素中设置css样式。传递css()函数内的值。

$('#map').css({'height':'50px;','width':'50px;'});。 map是该特定image元素的ID。

$(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);
    });


$('#map').css({'height':'50px;','width':'50px;'});
});

Answer 3

对于jQuery，您可以使用prop函数：

$(element).prop('width', 100);
$(element).prop('height', 50);

其中$（element）是图像标记的选择器。 prop（）的第一个参数是属性/属性的名称，第二个参数是属性的新值。

对于纯JavaScript，您需要选择元素，然后将属性更改为：

document.getElementById('img').width = 100;
document.getElementById('img').height= 50;

其中'img'是图像的Id。您还可以使用其他选择器，如getElementsByClassName或getElementsByName。

设置加载jQuery的图像的宽度和高度

3 个答案: