2017-11-08 1 views
0

Bing Maps V8 Pushpins의 불투명도를 변경하려면 페이지의 다른 요소 위로 마우스를 가져 가면됩니다. Google지도를 통해 구현할 수 있기 때문에 이것이 가능하다는 것을 알고 있지만 아직 Bing Maps에서 그러한 옵션을 찾을 수 없었습니다. Bing Maps V8 고정 핀 불투명도

현 I지도에, 버스의 위치를 ​​표시하기 위해 수정 된 압정을 이용하고 :

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

Custom Pushpins

하면 I가 핀을 초기화하는 데 사용하는 코드의 예는

PushpinOptions 개체에는 불투명도와 관련된 내용이없는 것 같습니다. 이 문제를 해결하는 데 사용되는 공식 또는 해킹 방법이 있습니까?

+0

은 왜 안 부분적으로 투명 PNG? –

답변

1

압정의 불투명도를 변경하는 것은 일반적으로 요구되는 기능이 아니며, 실제로 이것이 10 년 만에 두 번째라고 생각합니다. 즉, 이것에 대해 여러 가지 방법이 있습니다. 이미지 URL을 사용하기 때문에 가장 쉬운 방법은 불투명도가 적용된 다른 이미지를 만든 다음 필요에 따라 아이콘 속성을 업데이트하는 것입니다.

좀 더 복잡하지만 더 유연한 솔루션을 만들고 싶다면 푸시 핀에 SVG를 사용하고 그런 식으로 불투명도를 동적으로 제어 할 수 있습니다. 다음은 설정이 다른 SVG 기반 압핀을 만드는 예제입니다. https://bingmapsv8samples.azurewebsites.net/#SVG%20Pushpin%20Maker 텍스트 속성을 사용하지 않으므로이를 불투명도 SVG의 자리 표시 자로 쉽게 사용할 수 있으며 필요에 따라 단일 속성을 동적으로 업데이트 할 수 있습니다.

또 다른 방법은 여기서, HTML5 캔버스를 사용하는 것입니다 압정 이미지 확장 예는 다음과 같습니다 https://github.com/Microsoft/BingMapsV8CodeSamples/blob/master/Samples/Pushpins/Pushpin_Scaled.html

+0

마우스를 가져 가면 투명한 PNG를 시도했는데 문제가 해결 된 것으로 보입니다. 호버에 압정을 새로 고침하는 방법을 알아 내야합니다. 어쨌든, 감사합니다! –