Question

我真的想在WPF中创建自己的地图控件，因为唯一一个适合我要求的地图控件就是Google Maps JavaScript API，因为它几乎可以做任何我需要的东西，但这只适用于网络和移动设备而我已经尝试过Bing和ESRI地图，但他们不能做我想做的事。

我已经开始了一个小实验项目，看看我是否可以在缩放时加载图块，它有点工作，这里是代码：

    <ScrollViewer Margin="10" PanningMode="Both" HorizontalScrollBarVisibility="Visible">
        <Canvas x:Name="lyrTiles" Height="3000" Width="3000"/>
    </ScrollViewer>

    <Grid x:Name="lyrControl" Margin="10">
        <Button x:Name="moveUp" Content="U" HorizontalAlignment="Left" Margin="35,10,0,0" VerticalAlignment="Top" Width="20" Height="20"/>
        <Button x:Name="moveRight" Content="R" HorizontalAlignment="Left" Margin="55,30,0,0" VerticalAlignment="Top" Width="20" Height="20"/>
        <Button x:Name="moveDown" Content="D" HorizontalAlignment="Left" Margin="35,50,0,0" VerticalAlignment="Top" Width="20" Height="20"/>
        <Button x:Name="moveLeft" Content="L" HorizontalAlignment="Left" Margin="15,30,0,0" VerticalAlignment="Top" Width="20" Height="20"/>
        <Button x:Name="zoomIn" Content="ZI" HorizontalAlignment="Left" Margin="35,81,0,0" VerticalAlignment="Top" Width="20" Height="20"/>
        <Button x:Name="zoomOut" Content="ZO" HorizontalAlignment="Left" Margin="35,311,0,0" VerticalAlignment="Top" Width="20" Height="20"/>
        <Slider x:Name="zoomSlider" HorizontalAlignment="Left" Margin="35,106,0,0" VerticalAlignment="Top" Orientation="Vertical" Height="200" Width="20" VerticalContentAlignment="Center" HorizontalContentAlignment="Center" Interval="1"/>
        <Button x:Name="typeHybrid" Content="Hybrid" HorizontalAlignment="Right" Margin="0,10,65,0" VerticalAlignment="Top" Width="50" Height="15" Padding="0,-1,0,0" FontSize="10"/>
        <Button x:Name="typeTerrain" Content="Terrain" HorizontalAlignment="Right" Margin="0,10,10,0" VerticalAlignment="Top" Width="50" Height="15" Padding="0,-1,0,0" FontSize="10"/>
        <Button x:Name="typeSatellite" Content="Satellite" HorizontalAlignment="Right" Margin="0,10,120,0" VerticalAlignment="Top" Width="50" Height="15" Padding="0,-1,0,0" FontSize="10"/>
        <Button x:Name="typeRoad" Content="Road" HorizontalAlignment="Right" Margin="0,10,175,0" VerticalAlignment="Top" Width="50" Height="15" Padding="0,-1,0,0" FontSize="10"/>
        <Label x:Name="copyright" Content="Map data ©2014 Google" HorizontalAlignment="Right" VerticalAlignment="Bottom" Padding="0" Width="200" FontSize="10" FontFamily="Calibri" FontWeight="Bold"/>
    </Grid>
    <Canvas x:Name="lyrActive" Margin="10,10,27,28" MouseWheel="lyrActive_MouseWheel" Background="#00000000"/>




    public int zoomLevel = 0;
    public int zoomWidth = 2;

    public MainWindow()
    {
        InitializeComponent();

        Image i = new Image(); i.Width = 250; i.Height = 250; i.Margin = new Thickness(0, 0, 0, 0);
        i.Source = new BitmapImage(new Uri("https://a.tiles.mapbox.com/v3/examples.map-9ijuk24y/0/0/0.png"));
        lyrTiles.Children.Add(i);
    }

    private void lyrActive_MouseWheel(object sender, MouseWheelEventArgs e)
    {
        if (e.Delta > 0)
        {
            lyrTiles.Children.Clear();
            zoomLevel += 1; zoomWidth = zoomWidth + zoomWidth / 2;
            for (int x = 0; x < zoomWidth; x++)
            {
                for (int y = 0; y < zoomWidth; y++)
                {
                    lyrTiles.Children.Add(new Image()
                    {
                        Margin = new Thickness(250 * x, 250 * y, 0, 0),
                        Source = new BitmapImage(new Uri("https://a.tiles.mapbox.com/v3/examples.map-9ijuk24y/" + zoomLevel + "/" + x + "/" + y + ".png"))
                    });
                }
            }
        }
    }

    private void ScrollViewer_MouseWheel(object sender, MouseWheelEventArgs e)
    {
        if (e.Delta > 0)
        {
            lyrTiles.Children.Clear();
            zoomLevel += 1; zoomWidth = zoomWidth + zoomWidth / 2;
            for (int x = 0; x < zoomWidth; x++)
            {
                for (int y = 0; y < zoomWidth; y++)
                {
                    lyrTiles.Children.Add(new Image()
                    {
                        Margin = new Thickness(250 * x, 250 * y, 0, 0),
                        Source = new BitmapImage(new Uri("https://a.tiles.mapbox.com/v3/examples.map-9ijuk24y/" + zoomLevel + "/" + x + "/" + y + ".png"))
                    });
                }
            }
        }
    }

这是我应该渲染瓷砖的正确方法吗？我知道我必须删除那些不可见的但这只是一个非常简单的项目，看看我能做些什么来制作地图。我怎样才能让这项工作变得更好？

此外，我认为最大和最重要的事情是坐标，因为它们可用于定位地图中心的所有内容，因此可以下载正确的图块以将标记放置在特定位置。我怎么能这样做，我需要某种巨大的纬度和经度轴吗？

Answer 1

以下是一些可能为您节省一些工作的项目：

开放源代码：

商业：

如果您不介意使用Bing：

从头开始创建一个简单的WPF地图控件

1 个答案: