Question

我需要在我的应用程序中绘制一个公园的自定义图像映射，并在其上添加show gps标记。

然而我的问题是地图应该在我的应用程序中绘制为一个直的矩形（见左下图），但在现实生活中，公园是旋转的（参见下面的示例）

我有实时地图的所有4个角的GPS坐标以及标记的GPS坐标，但我仍然坚持如何计算地图中每个标记的（x，y）位置我的应用程序，地图显示为一个直的矩形。

欢迎任何建议！

我到目前为止的代码：

    public class GeoLocation
    {
        public double Lattitude { get; set; }

        public double Longitude { get; set; }

        public GeoLocation()
        {
        }

        public GeoLocation(double lat, double lon)
        {
            Lattitude = lat;
            Longitude = lon;
        }

        public double Angle(GeoLocation point)
        {
            var deltaX = point.Lattitude - Lattitude;
            var deltaY = point.Longitude - Longitude;
            return (Math.Atan2(deltaY, deltaX));
        }

        public GeoLocation Rotate(GeoLocation center, double angleInRad)
        {
            var s = Math.Sin(angleInRad);
            var c = Math.Cos(angleInRad);

            // translate point back to origin:
            var x = (double)(Lattitude - center.Lattitude);
            var y = (double)(Longitude - center.Longitude);

            // rotate point
            var xnew = x * c - y * s;
            var ynew = x * s + y * c;

            // translate point back:
            x = xnew + center.Lattitude;
            y = ynew + center.Longitude;
            return new GeoLocation(x, y);
        }
    }
        public partial class MainWindow : Window
        {
            public MainWindow()
            {
                InitializeComponent();
                var url = "file://c:\\db\\mapgrab.jpg";
                var bitmap = new BitmapImage();
                bitmap.BeginInit();
                bitmap.UriSource = new Uri(url, UriKind.Absolute);
                bitmap.CacheOption = BitmapCacheOption.OnLoad;
                bitmap.EndInit();
                mapImg.Source = bitmap;


                var TopLeftGps = new GeoLocation(52.11070994543701, 4.411896866166349);
                var TopRightGps = new GeoLocation(52.11475153599096, 4.415646979517055);
                var BottomRightGps = new GeoLocation(52.1117075980591, 4.424232274309553);
                var currentPosGps = new GeoLocation(52.11129692591393, 4.4174530542349295);

                var imageWidth = 702;
                var imageHeight = 924;
                var angle = TopLeftGps.Angle(TopRightGps);
                var topRight = TopRightGps.Rotate(TopLeftGps, -angle);
                var bottomRight = BottomRightGps.Rotate(TopLeftGps, -angle);
                var maxX = topRight.Lattitude - TopLeftGps.Lattitude;
                var maxY = bottomRight.Longitude - topRight.Longitude;

                var markerPos = new GeoLocation(currentPosGps.Lattitude, currentPosGps.Longitude).Rotate(TopLeftGps, -angle);
                var diffX = markerPos.Lattitude - TopLeftGps.Lattitude;
                var diffY = markerPos.Longitude - TopLeftGps.Longitude;
                var percentageX = diffX / maxX;
                var percentageY = diffY / maxY;
                var posX = percentageX * imageWidth;
                var posY = percentageY * imageHeight;


                var markerImg = new Border();
                markerImg.Background = new SolidColorBrush(Colors.Red);
                markerImg.Width = 32;
                markerImg.Height = 32;
                Canvas.SetLeft(markerImg, posX);
                Canvas.SetTop(markerImg, posY);
                canvas.Children.Add(markerImg);
            }
        }
    }

Answer 1

您正在寻找的是从北对齐坐标(x,y)到旋转坐标(x',y')

的2D旋转变换

旋转可以表示为2x2矩阵R，如果我们将坐标表示为列向量，则计算将为：

[x',y']=R*[x,y]

*为matrix multiplication，R为

角度θ是所需的旋转角度。

因此标记角点：

theta可以通过求解来计算（例如在wolframAlpha中）：

tan（θ）=（Ay-Dy）/（Ax-Dx）

Answer 2

我有类似的问题。这是一个JavaScript示例，如何旋转地图上的点。坐标是从中心点开始测量的。角度以辐射为单位。

var x_new_centered = -1 * y_centered * Math.sin(a) + x_centered * Math.cos(a)
var y_new_centered = y_centered * Math.cos(a) + x_centered * Math.sin(a);

在这里，您会找到一个jsfiddle，该点在未旋转，旋转且旋转并裁剪的地图上绘制了一个点：https://jsfiddle.net/vienom/4ger35uq/

如何在旋转的自定义图像映射上绘制gps标记

2 个答案: