主页 / 问题 / 954998
Accepted
Александр
Asked:2020-03-11 18:57:30 +0000 UTC2020-03-11 18:57:30 +0000 UTC

Yandex Maps API：如何将照片附加到标签？[关闭]

  • 772

如何将图像附加到标签上，以便在单击气球时打开？

яндекс-карты

2 个回答

  1. Best Answer

    balloonContentBody负责标签气球的内容。因此，要添加图像，您需要在单引号中添加img HTML 标签。在src属性中指定路径 - Internet 上图像的链接。强制属性：高度和宽度。

    balloonContentBody: '<img src="" height="" width="">'

    标签代码示例：

    var point = new ymaps.Placemark([0, 0], {
        balloonContentHeader: 'Париж',
        balloonContentBody: '<img src="https://34travel.me/media/upload/images/2016/october/Paris_palasatka/02.jpg" height="153" width="200">',
        balloonContentFooter: 'Париж - столица Франции',
    }, {
        preset: 'islands#darkOrangeDotIcon'
    });
    • 4

  2. 我用同样的方法实现了给地图添加标记的功能（这里使用的是按地址添加，不是按坐标添加）

    function addPointToMap(address, text = "") {
$.get("https://geocode-maps.yandex.ru/1.x/?apikey="+API_KEY+"&geocode=" + address + "&format=json", function (data) {
    let coord = data.response.GeoObjectCollection.featureMember[0].GeoObject.Point.pos.split(" ");
    myMap.geoObjects
        .add(new ymaps.Placemark([coord[1], coord[0]], {
            balloonContent: text
        }, {
            preset: 'islands#icon',
            iconColor: '#0095b6'
        }))
    });
}

    以此类推，你可以为现成的坐标写：

    function addPointToMap(coord, text = "") {
    myMap.geoObjects
        .add(new ymaps.Placemark([coord[1], coord[0]], {
            balloonContent: text
        }, {
            preset: 'islands#icon',
            iconColor: '#0095b6'
        }))
    });
}

    在里面text你可以把你的html代码和图片放在一起

    • 1

相关问题