Вопрос:

Bing Maps V8 Pushpin Непрозрачность

javascript css bing-maps

380 просмотра

1 ответ

1070 Репутация автора

Я хотел, чтобы при наведении указателя мыши на другой элемент на странице изменилась прозрачность кнопок Bing Maps V8 . Я знаю, что это возможно с помощью Google Maps, поскольку я реализовал его там, но я пока не смог найти такой вариант с Bing Maps.

В настоящее время я использую модифицированный Pushpin, чтобы отметить местоположение автобуса на карте:

Пользовательские кнопки

Вот пример кода, который я использую для инициализации контактов:

new Microsoft.Maps.Pushpin(map.getCenter(), {
    icon: 'img/bus1.png',
    anchor: new Microsoft.Maps.Point(14, 44),
    visible: false,
    text: "",
    title: ""
})

PushpinOptions объект , кажется, не имеет ничего , касающиеся непрозрачности. Есть ли официальный или хакерский способ, который используется для этого?

Автор: Chase Ingebritson Источник Размещён: 08.11.2017 11:06

Ответы (1)


1 плюс

12131 Репутация автора

Решение

Изменение непрозрачности канцелярской кнопки не является часто запрашиваемой функцией, на самом деле я думаю, что это уже второй раз за 10 лет, когда кто-либо спрашивал об этом. Тем не менее, есть несколько способов сделать это. Поскольку вы используете URL-адрес изображения, самым простым способом будет просто создать другое изображение, к которому будет применена ваша непрозрачность, а затем обновить свойство значка по мере необходимости.

Если вы хотите сделать более сложным, но сделать более гибкое решение, вы можете использовать SVG для кнопок и динамически контролировать прозрачность таким образом. Вот пример, который создает кнопки на основе SVG с различными настройками: https://bingmapsv8samples.azurewebsites.net/#SVG%20Pushpin%20Maker Поскольку вы не используете свойство text, вы можете легко использовать его в качестве заполнителя в SVG для непрозрачности и динамически обновлять одно свойство при необходимости.

Другой метод - использовать холст HTML5, вот пример, который масштабирует изображение кнопки: https://github.com/Microsoft/BingMapsV8CodeSamples/blob/master/Samples/Pushpins/Pushpin_Scaled.html.

Автор: rbrundritt Размещён: 09.11.2017 06:10
Вопросы из категории :
32x32