11

マップ注釈の周りにクリクルを描く方法を見つけました。私はこのようにします:

     MKCircle *circle = [MKCircle circleWithCenterCoordinate:theCoordinate radius:15000];
     [myMap addOverlay:circle];

 -(MKOverlayView *)mapView:(MKMapView *)mapView viewForOverlay:(id)overlay
 {
    MKCircleView *circleView = [[MKCircleView alloc] initWithOverlay:overlay];
    circleView.fillColor =[UIColor redColor];

   return circleView;
}

それは問題なく動作しますが、次のように塗りつぶしの色が均一ではない円を描きたいと思います:

ここに画像の説明を入力

4

6 に答える 6

7

グラデーションで円を描くには、独自の注釈ビュー クラスを提供する必要があります。これは、既存の注釈ビュー クラスがサポートしていないためです。できることは- (void)fillPath:(CGPathRef)path inContext:(CGContextRef)context、のサブクラスでメソッドをオーバーライドできることですMKCircleView。開始するためのコード (最適化されていない、ハードコードされた fill パラメーターを使用) を次に示します。

@interface TWOGradientCircleView : MKCircleView
@end

@implementation TWOGradientCircleView

- (void)fillPath:(CGPathRef)path inContext:(CGContextRef)context
{
    CGRect rect = CGPathGetBoundingBox(path);

    CGContextAddPath(context, path);
    CGContextClip(context);

    CGFloat gradientLocations[2] = {0.6f, 1.0f};
    // Start color white with 0.25 alpha,
    // End color green with 0.25 alpha
    CGFloat gradientColors[8] = {1.0f, 1.0f, 1.0f, 0.25f, 0.0f, 1.0f, 0.0f, 0.25f};
    CGColorSpaceRef colorSpace = CGColorSpaceCreateDeviceRGB();
    CGGradientRef gradient = CGGradientCreateWithColorComponents(colorSpace, gradientColors, gradientLocations, 2);
    CGColorSpaceRelease(colorSpace);

    CGPoint gradientCenter = CGPointMake(CGRectGetMidX(rect), CGRectGetMidY(rect));
    CGFloat gradientRadius = MIN(rect.size.width, rect.size.height) / 2;

    CGContextDrawRadialGradient(context, gradient, gradientCenter, 0, gradientCenter, gradientRadius, kCGGradientDrawsAfterEndLocation);

    CGGradientRelease(gradient);
}

MKCircleViewそれを使用するには、次のように置き換えTWOGradientCircleViewます。

- (MKOverlayView *)mapView:(MKMapView *)mapView viewForOverlay:(id)overlay
{
    MKCircleView *circleView = [[TWOGradientCircleView alloc] initWithOverlay:overlay];

    return circleView;
}

グラデーションを描画する代わりに画像を使用したい場合は、上のグラデーション描画を画像描画に置き換えることができます。ズームインすると画像がぼやけるため、ズームを無効にするか、Apple が WWDC10 のセッションで示したように画像を並べて表示する必要があります (サンプル コードを含むリポジトリについては、こちらを参照してください)。パターン イメージで を設定しUIColorても、半径が 15000 の場合は機能しません (非常に巨大なイメージを使用しない限り ;))。

于 2013-02-05T17:11:56.347 に答える
4

Swift 2.0 (iOS7+) でソリューションを実装するには、次のソリューションを使用しました

import Foundation
import MapKit

class TWOGradientCircleRenderer: MKCircleRenderer {

    override func fillPath(path: CGPath, inContext context: CGContext) {
        let rect:CGRect = CGPathGetBoundingBox(path)

        CGContextAddPath(context, path);
        CGContextClip(context);

        let gradientLocations: [CGFloat]  = [0.6, 1.0];
        let gradientColors: [CGFloat] = [1.0, 1.0, 1.0, 0.25, 0.0, 1.0, 0.0, 0.25];
        let colorSpace = CGColorSpaceCreateDeviceRGB();
        let gradient = CGGradientCreateWithColorComponents(colorSpace, gradientColors, gradientLocations, 2);

        let gradientCenter = CGPointMake(CGRectGetMidX(rect), CGRectGetMidY(rect));
        let gradientRadius = min(rect.size.width, rect.size.height) / 2;

        CGContextDrawRadialGradient(context, gradient, gradientCenter, 0, gradientCenter, gradientRadius, .DrawsAfterEndLocation);
    }
}

そして、 MKMapViewDelegate に追加する必要があります

func mapView(mapView: MKMapView, rendererForOverlay overlay: MKOverlay) -> MKOverlayRenderer {
        if overlay is MKCircle {
            let circleRenderer = TWOGradientCircleRenderer(overlay: overlay)
            return circleRenderer
        } else {
            return MKOverlayRenderer()
        }
    }
于 2016-02-23T23:42:37.157 に答える
3

塗りつぶしの色を で作成した色に設定してみました[UIColor colorWithPatternImage:]か?

于 2013-01-30T21:12:40.783 に答える
2

この回答は Swift 3.0 / iOS 10 向けです。

class CircleRenderer: MKCircleRenderer {
    override func fillPath(_ path: CGPath, in context: CGContext) {
        let rect: CGRect = path.boundingBox
        context.addPath(path)
        context.clip()
        let gradientLocations: [CGFloat]  = [0.6, 1.0]
        let gradientColors: [CGFloat] = [1.0, 1.0, 1.0, 0.25, 0.0, 1.0, 0.0, 0.25]
        let colorSpace = CGColorSpaceCreateDeviceRGB()
        guard let gradient = CGGradient(colorSpace: colorSpace, colorComponents: gradientColors, locations: gradientLocations, count: 2) else { return }

        let gradientCenter = CGPoint(x: rect.midX, y: rect.midY)
        let gradientRadius = min(rect.size.width, rect.size.height) / 2
        context.drawRadialGradient(gradient, startCenter: gradientCenter, startRadius: 0, endCenter: gradientCenter, endRadius: gradientRadius, options: .drawsAfterEndLocation)
    }
}

そして、オーバーレイ デリゲート メソッド:

func mapView(_ mapView: MKMapView, rendererFor overlay: MKOverlay) -> MKOverlayRenderer {
    let circleRenderer = CircleRenderer(overlay: overlay)

    return circleRenderer
}

職場でのこの例:

ここに画像の説明を入力

于 2017-01-13T02:39:00.807 に答える
1

** 回答の更新のみ:

IOS 7 では、fillPath:inContext は MKCircleView に廃止されました。代わりに MKCircleRenderer を使用してみてください。

https://developer.apple.com/library/ios/documentation/MapKit/Reference/MKOverlayPathRenderer_class/Reference/Reference.html#//apple_ref/occ/cl/MKOverlayPathRenderer

于 2013-10-13T15:30:14.217 に答える