WPF Bing 地图中的信息框

发布于 2024-12-06 16:07:20 字数 409 浏览 2 评论 0原文

我最近开始在 WPF 中做一些事情,并且想到了将地图集成到我的应用程序中的想法。我用 Google 地图尝试了一些东西,但功能不是那么好,所以过了一段时间我就放弃了 WPF 中的 Google 地图。

过了一会儿,我偶然发现了 Bing 地图。这看起来比 Google 地图与 WPF 一起使用更有前景。我已经开始使用 Bing 地图,它的功能非常棒!

然而,当我尝试在地图上放置图钉时,当将鼠标悬停在图钉上时,我并不清楚如何向图钉添加信息框。我找到了一些如何执行此操作的示例,但它需要链接到 xaml 的程序代码。我实际上正在寻找一种不使用过程代码的方法。

是否可以仅使用 xaml 将信息框添加到图钉?或者有人有更好的替代方法吗?

虽然有一个工具提示属性可用,但我实际上并不是在寻找它。我实际上是在寻找谷歌地图的图钉风格(如果有的话)。

I've recently started doing some stuff in WPF and I came up with an idea to integrate maps into my application. I tried some stuff with Google Maps, but the capabilities aren't that great, so after a while I gave up on Google Maps in WPF.

A little while later I bumped into Bing Maps. This looked way more promising than Google Maps to use with WPF. I've started playing around with Bing's Maps and the capabilities are great!

However, when I tried to put a pushpin on the map it wasn't immediately clear to me how to add a infobox to the pushpin, when hovering over it. I have found some examples how to do so, but it required procedural code linked to the xaml. I was actually looking for a method without using procedural code.

Is it possible to add a infobox to a pushpin with just xaml? Or does anyone have a good alternative method on how to do so?

There is a tooltip property available though, but I wasn't actually looking for that. I was actually looking for Google Maps' pushpin kind of style (if it is available).

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

天赋异禀 2024-12-13 16:07:20

假设我正确理解了您想要的内容,我相信简短的答案是:抱歉,但仅使用 XAML 无法将 Google 地图风格的信息框添加到图钉中。不过,如果可以的话,我会尽力提供帮助。

免责声明:我一直在使用 Silverlight 的 Bing Maps 控件,因此希望这也适用于该控件的 WPF 版本。

我想您不想使用内置的工具提示,要么是因为您希望它看起来不同(即不仅仅是一个带有文本的黄色框),要么是因为您希望它在用户将鼠标移开时不会消失。

如果您只是想让它看起来有所不同,我可以提供以下内容。当我为图钉指定模板时,我继续使用重新模板化的工具提示,并允许用户单击图钉来获取更多信息。

Bing Map with custom ToolTip

这是 ToolTip 模板,定义为 StaticResource,当然可以包含您想要的任何内容

<Style x:Key="MyToolTipStyle" TargetType="ToolTip">
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate>
                <Border CornerRadius="5" BorderBrush="Black" BorderThickness="2" Background="#5c87b2">
                    <ContentPresenter Margin="5">
                        <ContentPresenter.Content>
                            <StackPanel Margin="5" MaxWidth="400">
                                <TextBlock Text="{Binding Name}" FontWeight="Bold" FontSize="16" Foreground="White" TextWrapping="Wrap"/>
                                <TextBlock Text="{Binding Description}" Foreground="White" TextWrapping="Wrap"/>
                            </StackPanel>
                        </ContentPresenter.Content>
                    </ContentPresenter>
                </Border>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

:我使用它的地方:

<maps:Map>
    <maps:MapItemsControl ItemsSource="{Binding SearchResultsManager.Items}">
        <maps:MapItemsControl.ItemTemplate>
            <DataTemplate>
                <maps:Pushpin Location="{Binding Location}" Cursor="Hand" MouseLeftButtonUp="Pushpin_MouseLeftButtonUp">
                    <ToolTipService.ToolTip>
                        <ToolTip Style="{StaticResource MyToolTipStyle}" />
                    </ToolTipService.ToolTip>
                </maps:Pushpin>
            </DataTemplate>
        </maps:MapItemsControl.ItemTemplate>
    </maps:MapItemsControl>
</maps:Map>

然后,当用户单击图钉将他们带到详细信息区域时,我会进行处理。

private void Pushpin_MouseLeftButtonUp(object sender, MouseButtonEventArgs e)
{
    // Get a reference to the object that was clicked.
    var clickedSearchResult = (sender as FrameworkElement).DataContext as SearchResultViewModel;

    // Do something with it.
}

但是,我想您希望防止工具提示消失,以便用户可以单击其中的控件。不幸的是,我不确定是否有一种简单的方法可以做到这一点。您可能必须定义自己的自定义控件,这当然需要一些 C#/VB 代码。

也许这个新控件可以源自图钉,并且它可以在鼠标悬停和/或单击时显示信息框内容。您可以使用 VisualStateManager 将大部分代码保留在 XAML 中。 C#/VB 只需要提供内容的依赖属性和一些覆盖,以便在正确的时间在视觉状态之间进行转换。

我希望这至少有一点帮助!

Assuming I understand correctly what you want, I believe the short answer is: Sorry, but it's not possible to add a Google-Maps-style info box to a pushpin with just XAML. However, I'll try to help if I can.

Disclaimer: I've been playing with the Bing Maps control for Silverlight, so hopefully this will be applicable to the WPF version of the control as well.

I imagine that you don't want to use the built-in ToolTip either because you want it to look different (i.e. not just a yellow box with text) or because you want it to not disappear when the user moves the mouse away.

If you just want it to look different, I can offer the following. When I specified a template for my Pushpins, I went ahead and used a re-templated ToolTip and allowed the user to click the pushpin to get more information.

Bing Map with custom ToolTip

Here's the ToolTip template, defined as a StaticResource, which of course could contain anything you want:

<Style x:Key="MyToolTipStyle" TargetType="ToolTip">
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate>
                <Border CornerRadius="5" BorderBrush="Black" BorderThickness="2" Background="#5c87b2">
                    <ContentPresenter Margin="5">
                        <ContentPresenter.Content>
                            <StackPanel Margin="5" MaxWidth="400">
                                <TextBlock Text="{Binding Name}" FontWeight="Bold" FontSize="16" Foreground="White" TextWrapping="Wrap"/>
                                <TextBlock Text="{Binding Description}" Foreground="White" TextWrapping="Wrap"/>
                            </StackPanel>
                        </ContentPresenter.Content>
                    </ContentPresenter>
                </Border>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

And here's where I used it:

<maps:Map>
    <maps:MapItemsControl ItemsSource="{Binding SearchResultsManager.Items}">
        <maps:MapItemsControl.ItemTemplate>
            <DataTemplate>
                <maps:Pushpin Location="{Binding Location}" Cursor="Hand" MouseLeftButtonUp="Pushpin_MouseLeftButtonUp">
                    <ToolTipService.ToolTip>
                        <ToolTip Style="{StaticResource MyToolTipStyle}" />
                    </ToolTipService.ToolTip>
                </maps:Pushpin>
            </DataTemplate>
        </maps:MapItemsControl.ItemTemplate>
    </maps:MapItemsControl>
</maps:Map>

Then I'd handle when the user clicked on the pushpin to take them to a details area.

private void Pushpin_MouseLeftButtonUp(object sender, MouseButtonEventArgs e)
{
    // Get a reference to the object that was clicked.
    var clickedSearchResult = (sender as FrameworkElement).DataContext as SearchResultViewModel;

    // Do something with it.
}

However, I imagine you want to keep the ToolTip from disappearing, so that the user can click on controls inside it. Unfortunately, I'm not sure there's a simple way to do that. You might have to define your own custom control, which of course would require some C#/VB code.

Perhaps this new control could derive from Pushpin, and it could show the info box content on mouse-over and/or click. You could use the VisualStateManager to keep most of the code in XAML. The C#/VB would just have to provide a dependency property for the content and some overrides to transition between the visual states at the correct times.

I hope that's at least a little bit helpful!

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文