iphone - 如何在 MKOverlayView 上显示图像？

Question

更新:

使用 MKOverlayView 投影到 MKMapView 的图像使用 Mercator projection ，而我用作输入数据的图像使用 WGS84 投影。有没有一种方法可以将输入图像转换为正确的投影 WGS84 -> Mercator，而无需平铺图像并且可以即时完成？

通常您可以使用程序 gdal2tiles 将图像转换为右投影. 但是，输入数据每十五分钟更改一次，因此必须每十五分钟转换一次图像。所以转换必须即时完成。我还希望平铺由 Mapkit 完成，而不是由我自己使用 gdal2tiles 或 GDAL 框架完成。

更新结束

我目前正在开展一个项目，该项目在世界某些地区显示降雨量雷​​达。雷达图像由 EUMETSAT 提供，他们提供了一个 KML 文件，可以加载到谷歌地球或谷歌地图中。如果我在 Google map 中加载 KML 文件，它会完美显示，但如果我使用 MKMapView 上的 MKOverlayView 绘制图像，图像会略有偏差。

例如，在左侧，谷歌地图和右侧相同的图像显示在 MKMapView 上。

图像覆盖的表面可以在 Google Maps 上查看，用于图像的卫星是“Meteosat 0 Degree”卫星。

两个图像覆盖的表面大小相同，这是 KML 文件中的 LatLonBox，它指定地面叠加层边界框的顶部、底部、右侧和左侧对齐的位置。

  <LatLonBox id="GE_MET0D_VP-MPE-latlonbox">
        <north>57.4922</north>
        <south>-57.4922</south>
        <east>57.4922</east>
        <west>-57.4922</west>
        <rotation>0</rotation>
  </LatLonBox>

我使用这些参数创建了一个名为 RadarOverlay 的新自定义 MKOverlay 对象，

[[RadarOverlay alloc] initWithImageData:[[self.currentRadarData objectAtIndex:0] valueForKey:@"Image"] withLowerLeftCoordinate:CLLocationCoordinate2DMake(-57.4922, -57.4922) withUpperRightCoordinate:CLLocationCoordinate2DMake(57.4922, 57.4922)];

自定义MKOverlay对象的实现；雷达叠加

- (id) initWithImageData:(NSData*) imageData withLowerLeftCoordinate:(CLLocationCoordinate2D)lowerLeftCoordinate withUpperRightCoordinate:(CLLocationCoordinate2D)upperRightCoordinate
{
     self.radarData = imageData;

     MKMapPoint lowerLeft = MKMapPointForCoordinate(lowerLeftCoordinate);
     MKMapPoint upperRight = MKMapPointForCoordinate(upperRightCoordinate);

     mapRect = MKMapRectMake(lowerLeft.x, upperRight.y, upperRight.x - lowerLeft.x, lowerLeft.y - upperRight.y);

     return self;
}

- (CLLocationCoordinate2D)coordinate
{
     return MKCoordinateForMapPoint(MKMapPointMake(MKMapRectGetMidX(mapRect), MKMapRectGetMidY(mapRect)));
}

- (MKMapRect)boundingMapRect
{
     return mapRect;
}

自定义MKOverlayView、RadarOverlayView的实现

- (void)drawMapRect:(MKMapRect)mapRect zoomScale:(MKZoomScale)zoomScale inContext:(CGContextRef)context
{
    RadarOverlay* radarOverlay = (RadarOverlay*) self.overlay;

    UIImage *image          = [[UIImage alloc] initWithData:radarOverlay.radarData];

    CGImageRef imageReference = image.CGImage;

    MKMapRect theMapRect    = [self.overlay boundingMapRect];
   CGRect theRect           = [self rectForMapRect:theMapRect];
    CGRect clipRect     = [self rectForMapRect:mapRect];

    NSUserDefaults *preferences = [NSUserDefaults standardUserDefaults];
    CGContextSetAlpha(context, [preferences floatForKey:@"RadarTransparency"]);

    CGContextAddRect(context, clipRect);
    CGContextClip(context);

    CGContextDrawImage(context, theRect, imageReference);

    [image release]; 
}

当我下载图像时，我翻转图像以便可以在 MKOverlayView 中轻松绘制它

size_t width    = (CGImageGetWidth(imageReference) / self.scaleFactor);
size_t height   = (CGImageGetHeight(imageReference) / self.scaleFactor);

// Calculate colorspace for the specified image
CGColorSpaceRef imageColorSpace = CGImageGetColorSpace(imageReference);

// Allocate and clear memory for the data of the image
unsigned char *imageData = (unsigned char*) malloc(height * width * 4);
memset(imageData, 0, height * width * 4);

// Define the rect for the image
CGRect imageRect;
if(image.imageOrientation==UIImageOrientationUp || image.imageOrientation==UIImageOrientationDown) 
    imageRect = CGRectMake(0, 0, width, height); 
else 
    imageRect = CGRectMake(0, 0, height, width); 

// Create the imagecontext by defining the colorspace and the address of the location to store the data
CGContextRef imageContext = CGBitmapContextCreate(imageData, width, height, 8, width * 4, imageColorSpace, kCGImageAlphaPremultipliedLast);

CGContextSaveGState(imageContext);

// Scale the image to the opposite orientation so it can be easylier drawn with CGContectDrawImage
CGContextTranslateCTM(imageContext, 0, height);
CGContextScaleCTM(imageContext, 1.0, -1.0);

if(image.imageOrientation==UIImageOrientationLeft) 
{
    CGContextRotateCTM(imageContext, M_PI / 2);
    CGContextTranslateCTM(imageContext, 0, -width);
}
else if(image.imageOrientation==UIImageOrientationRight) 
{
    CGContextRotateCTM(imageContext, - M_PI / 2);
    CGContextTranslateCTM(imageContext, -height, 0);
} 
else if(image.imageOrientation==UIImageOrientationDown) 
{
    CGContextTranslateCTM(imageContext, width, height);
    CGContextRotateCTM(imageContext, M_PI);
}

// Draw the image in the context
CGContextDrawImage(imageContext, imageRect, imageReference);
CGContextRestoreGState(imageContext);

翻转图像后，我对其进行操作，然后将其作为 NSData 对象存储在内存中。

看起来图像被拉伸(stretch)了，但在图像的中心，也就是赤道处，它看起来还不错。

Answer 1

您是否看过 WWDC 2010 视频中的“第 127 节课 - 使用叠加层自定义 map ”？其中一个示例采用地震数据，该数据给出了 0.5 x 0.5 度区域的地震风险并将其绘制成 map 。基于正方形，您的雷达数据看起来很相似。示例代码有一个名为 HazardMaps 的完整应用程序，它获取此数据并使用 MKMapPoints 创建叠加层。如果您还没有看过这个视频，我想它会给您很多有用的信息。他还谈到了转换为墨卡托投影。

要检查的另一件事是来自 EUMETSAT 的数据所在的坐标系(基准面)。谷歌地图使用一个名为 WGS-84 的系统。 ，这是一个通用标准。但是还有许多其他标准可以在世界不同地区给出更准确的位置。如果您在 Google map 中使用不同标准的经纬度，您的所有点都会有一定的偏差。偏移量不一致，它会随着您在 map 上移动而变化。谷歌地图有可能对数据很聪明，并且可以即时转换为 WGS-84。

您可以通过查看 KML 了解更多详细信息。我查看了但找不到带有矩形的最终 KML。也许它提供了有关它在元数据中使用的坐标系的信息。