経緯
マーカーにhtmlを使いたいとずっと思っていた。ふと見るとgoogleがAdvancedMarkerViewというベータ版の機能を提供しているではないか。
以前だとこれを実現しようとするとRichMarkerと巷で言われているoverlayviewを派生させて無理やり？作っていた。しかし、今回、Googleが正式に提供してくれることで、本来のマーカーの利用しやすくなった。というかGoogleが提供してくれるようになった。
RichMarkerをたくさん描画すると圧倒的にマーカーより思いこともあり、AdvancedMakrerViewに期待できないかと思っている。
とりあえずJSでやってみる
Advanced Markers (beta) | Maps JavaScript API | Google Developers
できた。ソースはおいおい載せる。
Blazorでやってみる
ライブラリはここのを利用する
GitHub - rungwiroon/BlazorGoogleMaps: Blazor interop for GoogleMap library
しかし、AdvancedMarkerViewのライブラリはまだない。
頑張って自作する。
だがうまくいかない。 AdvancedMarkerViewを呼ぶことはできる。
しかし、contentのプロパティに値を渡すことができない。contentに値をセットしないとデフォルトで値が渡るのでマーカーの設置はできるのだ。
contentのプロパティはelement型なのだが、C#にそのようなプロパティはない?
ElementReferenceがあるじゃないかと思ったが、うまくいかない。
後記
githubのやり取りを見るとやはり、このライブラリを作ってくれというやりとりはあるようだが、2022/11/19現在では、まだ実装はされていない。作者も忙しいとのことだった。
AdvancedMarkerViewはクラスタリングに対応がまだできていない。Google側が提供をまだできていないといったほうが正しいだろう。頑張れば自作できるっぽい。
下記がyoutubeのコメントでgoogleが返信を返していた内容だ。
Announcing: Advanced Markers - YouTube
The js-markerclusterer utility library currently uses Marker class to construct and render the cluster icon, so it doesn't support the marker.AdvanceMarkerView class features. You can see a sample of the js-markerclusterer's default renderer implementation here: https://googlemaps.github.io/js-markerclusterer/classes/DefaultRenderer.html
誰か、elementをC#から渡して、AdvancedMarkerViewを使える方法を教えてください。