C# WPF Bing地图展示
微信公众号：Dotnet9，网站：Dotnet9，问题或建议，请网站留言；
如果您觉得Dotnet9对您有帮助，欢迎赞赏
内容目录
- 实现效果
- 业务场景
- 编码实现
- 本文参考
- 源码下载
1.实现效果
Bing地图展示界面
2.业务场景
Bing地图控件的使用
3.编码实现
3.1 添加Nuget库
站长使用 .Net Core 3.1 创建的WPF工程，创建“BingMap”解决方案后，需要添加三个Nuget库：MaterialDesignThemes、MaterialDesignColors和Bing WPF地图控件Microsoft.Maps.MapControl.WPF，其中Bing地图控件是.net framework 4.6.1版本，所以项目使用framework版本要好点，其实影响也不大。
MaterialDesign控件库
Bing WPF地图控件Microsoft.Maps.MapControl.WPF
注意
使用bing map地图控件需要注册开发者账号，站长只是按视频教程敲的代码，VS 2019设计器能正常加载地图，但运行时会有提示请注册开发者账号，否则地图无法正常显示
需要注册Bing地图开发者账号
3.2 工程结构
不需要截图，只修改了两个文件，App.xaml添加MD控件样式，MainWindow主窗口实现效果。
3.3 App.xaml引入MD控件样式
<Application x:Class="BingMap.App"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="clr-namespace:BingMap"
StartupUri="MainWindow.xaml">
<Application.Resources>
<ResourceDictionary>
<ResourceDictionary.MergedDictionaries>
<ResourceDictionary Source="pack://application:,,,/MaterialDesignThemes.Wpf;component/Themes/MaterialDesignTheme.Dark.xaml"/>
<ResourceDictionary Source="pack://application:,,,/MaterialDesignThemes.Wpf;component/Themes/MaterialDesignTheme.Defaults.xaml"/>
<ResourceDictionary Source="pack://application:,,,/MaterialDesignColors;component/Themes/Recommended/Primary/MaterialDesignColor.Blue.xaml"/>
<ResourceDictionary Source="pack://application:,,,/MaterialDesignColors;component/Themes/Recommended/Accent/MaterialDesignColor.LightBlue.xaml"/>
</ResourceDictionary.MergedDictionaries>
</ResourceDictionary>
</Application.Resources>
</Application>
3.4 主窗体 MainWindow.xaml
加载Bing地图控件，设置地图属性等：
<Window x:Class="BingMap.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:local="clr-namespace:BingMap"
mc:Ignorable="d"
xmlns:materialDesign="http://materialdesigninxaml.net/winfx/xaml/themes"
xmlns:m="clr-namespace:Microsoft.Maps.MapControl.WPF;assembly=Microsoft.Maps.MapControl.WPF"
Title="Bing地图" Height="600" Width="1080" WindowStyle="None" ResizeMode="NoResize"
WindowStartupLocation="CenterScreen" Background="#FF3A3A3A">
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="40"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="250"/>
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>
<StackPanel Grid.Row="1" Margin="10">
<Grid>
<TextBox Background="White" Padding="10 0 25 0"/>
<materialDesign:PackIcon Kind="MapMarker" VerticalAlignment="Center" Margin="2"/>
<Button HorizontalAlignment="Right" Style="{StaticResource MaterialDesignFlatButton}">
<materialDesign:PackIcon Kind="Search"/>
</Button>
</Grid>
<ListView>
<ListViewItem>
<Border BorderBrush="LightGray" BorderThickness="0 0 0 1" Width="260">
<Grid>
<StackPanel Height="50">
<TextBlock Text="鸡腿"/>
<StackPanel Orientation="Horizontal">
<TextBlock Text="4.5" Foreground="#DDFF6F0B" Margin="1" FontSize="10"/>
<materialDesign:PackIcon Kind="Star" Foreground="#DDFF6F0B" Margin="1" VerticalAlignment="Center" Width="12" Height="12"/>
<materialDesign:PackIcon Kind="Star" Foreground="#DDFF6F0B" Margin="1" VerticalAlignment="Center" Width="12" Height="12"/>
<materialDesign:PackIcon Kind="Star" Foreground="#DDFF6F0B" Margin="1" VerticalAlignment="Center" Width="12" Height="12"/>
<materialDesign:PackIcon Kind="Star" Foreground="#DDFF6F0B" Margin="1" VerticalAlignment="Center" Width="12" Height="12"/>
<materialDesign:PackIcon Kind="StarHalf" Foreground="#DDFF6F0B" Margin="1" VerticalAlignment="Center" Width="12" Height="12"/>
</StackPanel>
<TextBlock Text="Open until 6:00PM" Opacity="0.7"/>
</StackPanel>
<Image HorizontalAlignment="Right" Margin="0 0 50 0" Width="50" Height="50" Source="https://img.dotnet9.com/logo.png"/>
</Grid>
</Border>
</ListViewItem>
<ListViewItem>
<Border BorderBrush="LightGray" BorderThickness="0 0 0 1" Width="260">
<Grid>
<StackPanel Height="50">
<TextBlock Text="La Casita Grill"/>
<StackPanel Orientation="Horizontal">
<TextBlock Text="4.5" Foreground="#DDFF6F0B" Margin="1" FontSize="10"/>
<materialDesign:PackIcon Kind="Star" Foreground="#DDFF6F0B" Margin="1" VerticalAlignment="Center" Width="12" Height="12"/>
<materialDesign:PackIcon Kind="Star" Foreground="#DDFF6F0B" Margin="1" VerticalAlignment="Center" Width="12" Height="12"/>
<materialDesign:PackIcon Kind="Star" Foreground="#DDFF6F0B" Margin="1" VerticalAlignment="Center" Width="12" Height="12"/>
<materialDesign:PackIcon Kind="Star" Foreground="#DDFF6F0B" Margin="1" VerticalAlignment="Center" Width="12" Height="12"/>
<materialDesign:PackIcon Kind="StarHalf" Foreground="#DDFF6F0B" Margin="1" VerticalAlignment="Center" Width="12" Height="12"/>
</StackPanel>
<TextBlock Text="Open until 6:00PM" Opacity="0.7"/>
</StackPanel>
<Image HorizontalAlignment="Right" Margin="0 0 50 0" Width="50" Height="50" Source="https://img.dotnet9.com/logo.png"/>
</Grid>
</Border>
</ListViewItem>
<ListViewItem>
<Border BorderBrush="LightGray" BorderThickness="0 0 0 1" Width="260">
<Grid>
<StackPanel Height="50">
<TextBlock Text="La Casita Grill"/>
<StackPanel Orientation="Horizontal">
<TextBlock Text="4.5" Foreground="#DDFF6F0B" Margin="1" FontSize="10"/>
<materialDesign:PackIcon Kind="Star" Foreground="#DDFF6F0B" Margin="1" VerticalAlignment="Center" Width="12" Height="12"/>
<materialDesign:PackIcon Kind="Star" Foreground="#DDFF6F0B" Margin="1" VerticalAlignment="Center" Width="12" Height="12"/>
<materialDesign:PackIcon Kind="Star" Foreground="#DDFF6F0B" Margin="1" VerticalAlignment="Center" Width="12" Height="12"/>
<materialDesign:PackIcon Kind="Star" Foreground="#DDFF6F0B" Margin="1" VerticalAlignment="Center" Width="12" Height="12"/>
<materialDesign:PackIcon Kind="StarHalf" Foreground="#DDFF6F0B" Margin="1" VerticalAlignment="Center" Width="12" Height="12"/>
</StackPanel>
<TextBlock Text="Open until 6:00PM" Opacity="0.7"/>
</StackPanel>
<Image HorizontalAlignment="Right" Margin="0 0 50 0" Width="50" Height="50" Source="https://img.dotnet9.com/logo.png"/>
</Grid>
</Border>
</ListViewItem>
<ListViewItem>
<Border BorderBrush="LightGray" BorderThickness="0 0 0 1" Width="260">
<Grid>
<StackPanel Height="50">
<TextBlock Text="La Casita Grill"/>
<StackPanel Orientation="Horizontal">
<TextBlock Text="4.5" Foreground="#DDFF6F0B" Margin="1" FontSize="10"/>
<materialDesign:PackIcon Kind="Star" Foreground="#DDFF6F0B" Margin="1" VerticalAlignment="Center" Width="12" Height="12"/>
<materialDesign:PackIcon Kind="Star" Foreground="#DDFF6F0B" Margin="1" VerticalAlignment="Center" Width="12" Height="12"/>
<materialDesign:PackIcon Kind="Star" Foreground="#DDFF6F0B" Margin="1" VerticalAlignment="Center" Width="12" Height="12"/>
<materialDesign:PackIcon Kind="Star" Foreground="#DDFF6F0B" Margin="1" VerticalAlignment="Center" Width="12" Height="12"/>
<materialDesign:PackIcon Kind="StarHalf" Foreground="#DDFF6F0B" Margin="1" VerticalAlignment="Center" Width="12" Height="12"/>
</StackPanel>
<TextBlock Text="Open until 6:00PM" Opacity="0.7"/>
</StackPanel>
<Image HorizontalAlignment="Right" Margin="0 0 50 0" Width="50" Height="50" Source="https://img.dotnet9.com/logo.png"/>
</Grid>
</Border>
</ListViewItem>
</ListView>
</StackPanel>
<Button Grid.Column="1" HorizontalAlignment="Right" Style="{StaticResource MaterialDesignFlatButton}">
<materialDesign:PackIcon Kind="Close"/>
</Button>
<m:Map Mode="Road" Grid.Column="1" Grid.Row="1" ZoomLevel="16" Center="-23.1870304,-50.6606103">
<Canvas
m:MapLayer.Position="-23.1870304,-50.6606103"
m:MapLayer.PositionOrigin="BottomCenter" Width="30" Height="30">
<materialDesign:PackIcon Kind="MapMarker" Width="30" Height="30" Foreground="#FF3C3C3C"/>
</Canvas>
</m:Map>
</Grid>
</Window>
4.本文参考
Design com WPF 大神的学习视频：Bing Maps
开源控件库：MaterialDesignInXamlToolkit
本站对MD开源控件库的介绍：控件介绍
5.代码下载
文中代码已经全部给出。
除非注明，文章均由 Dotnet9 整理发布，欢迎转载。
转载请注明本文地址：https://dotnet9.com/6814.html
欢迎扫描下方二维码关注 Dotnet9 的微信公众号，本站会及时推送最新技术文章
C# WPF Bing地图展示的更多相关文章
- 翻译：Bing地图瓦片体系
Bing Maps Tile System Bing地图瓦片体系 原文链接:http://msdn.microsoft.com/en-us/library/bb259689.aspx Bing Map ...
- Bing地图切片原理
Bing地图切片系统 Bing地图提供了一个可以直接平移和缩放的世界地图.为了让地图操作更加平滑和及时响应,我们选择提前渲染地图不同层级的细节,并把每个层级的地图切割成为瓦片以便快速的还原展示.这篇文 ...
- LBS数据分析：使用地图展示统计数据——麻点图与麻数图
作为一个LBS的APP,都获得了用户经纬度,也都使用了友盟统计.google ana等等统计分析系统,不过没有地图展示功能,不能进行直观的展示. 友盟统计.google ana等系统是总体数据统计,无 ...
- silverlight调用bing地图 和 显示中文地图
bing地图sdk: https://msdn.microsoft.com/en-us/library/ff428643.aspx 引用dll:https://www.microsoft.com/en ...
- 【iOS】7.4 定位服务->3.1 地图框架MapKit 功能1：地图展示
> 本文并非最终版本,如果想要关注更新或更正的内容请关注文集,联系方式详见文末,如有疏忽和遗漏,欢迎指正. --- > 本文相关目录: ================== 所属文集:[[ ...
- 基于MySQL + Node.js + Leaflet的离线地图展示，支持百度、谷歌、高德、腾讯地图
1. 基本说明 本项目实现了离线展示百度.谷歌.高德.腾讯地图.主要功能如下: 实现了地图瓦片图下载.存储.目前支持存储至MySQL Node.js服务调用MySQL中的瓦片图 Leaflet展示地图 ...
- openlayers4 入门开发系列之地图展示篇（附源码下载）
前言 openlayers4 官网的 api 文档介绍地址 openlayers4 api,里面详细的介绍 openlayers4 各个类的介绍,还有就是在线例子:openlayers4 官网在线例子 ...
- Echarts地图展示及属性分析
Echarts,一个效果非常棒的可视化库,可以生产各种图表,动态展示,附上官方网址:http://www.echartsjs.com/index.html 之前带本科实习时有同学用过,狗哥的博客也用这 ...
- 【Android】3.5 示例5--多地图展示
分类:C#.Android.VS2015.百度地图应用: 创建日期:2016-02-04 3.5 示例5--多地图展示 一.简介 地图控件自v2.3.5版本起,支持多实例,即开发者可以在一个页面中建立 ...
随机推荐
- PS-蒙版的深入解析
ps四大核心技术是什么?通道.蒙版.路径.选区 通道: 通道的详解,不过比较早的文章了. http://www.blueidea.com/tech/graph/2004/2056.asp PS通道快速 ...
- https原理总结
博客搬家: https原理总结 最近在公司项目的服务器上做一些内部接口,要求使用https,于是花时间研究了一波.我们熟知的http在传输时未对数据进行加密,在传输一些敏感信息时存在着不小的安全隐患. ...
- 详解python的装饰器decorator
装饰器本质上是一个python函数,它可以让其它函数在不需要任何代码改动的情况下增加额外的功能. 装饰器的返回值也是一个函数对象.它经常用于有切面需求的场景,比如:插入日志,性能测试,事务处理,缓存, ...
- num05---装饰模式
当系统需要新的功能的时候,一般都是向旧的类中添加新的代码.比如一个人这个类,需要新增穿衣的功能,那么就会在人这个类中去添加对应的穿衣方法代码,用来增强人这个类的行为功能.但是这样做,会因为新加入的字段 ...
- 从敏捷开发到微服务，maybe再到中台
-- 先说下准备这个的背景: 本来是想让我分享下敏捷开发,可能是听我说为as**搭建并完善了敏捷开发体系的原因吧. 我一般分享一个东西,希望大家能真的理解,而不只是知道. 我不大相信有万能的东西,不希 ...
- pytorch之 sava_reload_model
import torch import matplotlib.pyplot as plt # torch.manual_seed(1) # reproducible # fake data x = t ...
- .NET Core之单元测试（四）：Fluent Assertions的使用
目录 什么是Fluent Assertions 待测试API 测试用例 什么是Fluent Assertions Fluent Assertions 是 .NET 平台下的一组扩展方法,用于单元测试中 ...
- Windows渗透备忘录
Windows渗透备忘录 mimikatz mimikatz.exe ""privilege::debug"" ""sekurlsa::lo ...
- ES6学习笔记（一）：轻松搞懂面向对象编程、类和对象
目录 面向过程编程P OP(Process oriented programming) 面向对象编程OOP(Object Oriented Programming) 总结 @ 面向过程编程P OP(P ...
- Hexo | 超详细的hexo+githhub page搭建过程
首先安装node.js 安装git 去Git官网根据你的电脑参数,下载对应版本. 下载完成,通过在命令行输入 git version 查看是否安装成功,有输出版本号说明安装成功. 鼠标邮件菜单里就多了 ...