UIViewでMKPolylineと同じUIBezierPathを描画する方法

Question

現在、私はMKMapViewで自分の位置を追跡しています。私の目的は、追跡された場所から作成されたMKPolylineと同じベジェパスを描くことです。

私が試みたことは次のとおりです。すべての位置座標をCLLocation配列に格納する。その配列を繰り返し、CLLocationCoordinate2D配列にlat/lng座標を格納します。次に、ポリラインが画面のビューにあることを確認して、CGPoints内のすべての位置座標を変換します。

現在の試行：

@IBOutlet weak var bezierPathView: UIView! 

var locations = [CLLocation]() // values from didUpdateLocation(_:) 

func createBezierPath() { 
    bezierPathView.isHidden = false 

     var coordinates = [CLLocationCoordinate2D]() 
     for location in locations { 
      coordinates.append(location.coordinate) 
     } 

     let polyline = MKPolyline(coordinates: coordinates, count: coordinates.count) 
     fitPolylineInView(polyline: polyline) 

     let mapPoints = polyline.points() 

     var points = [CGPoint]() 

     for point in 0...polyline.pointCount 
     { 
      let coordinate = MKCoordinateForMapPoint(mapPoints[point]) 
      points.append(mapView.convert(coordinate, toPointTo: polylineView)) 
     } 

     print(points) 

     let path = UIBezierPath(points: points) 
     path.lineWidth = 2.0 
     path.lineJoinStyle = .round 

     let layer = CAShapeLayer(path: path, lineColor: UIColor.red, fillColor: UIColor.black) 
     bezierPathView.layer.addSublayer(layer) 
} 

extension UIBezierPath { 
    convenience init(points:[CGPoint]) 
    { 
     self.init() 

     //connect every points by line. 
     //the first point is start point 
     for (index,aPoint) in points.enumerated() 
     { 
      if index == 0 { 
       self.move(to: aPoint) 
      } 
      else { 
       self.addLine(to: aPoint) 
      } 
     } 
    } 
} 

extension CAShapeLayer 
{ 
    convenience init(path:UIBezierPath, lineColor:UIColor, fillColor:UIColor) 
    { 
     self.init() 
     self.path = path.cgPath 
     self.strokeColor = lineColor.cgColor 
     self.fillColor = fillColor.cgColor 
     self.lineWidth = path.lineWidth 

     self.opacity = 1 
     self.frame = path.bounds 
    } 
} 

私は変換（_ :)メソッド）彼らが正しいか（わからないから保存されたコンソールにポイントを出力することができるしています。しかし、bezierPathViewには出力がありません。空白の背景ビューコントローラーになります。

Answer 1

拡張機能は正常に動作します。この問題は、表示されていないビューにレイヤーを追加するコードにある可能性があります。

私はあなたのプロジェクトを単純化することをお勧めします。たとえば、あなたのビューに間違いなくあらかじめ定義されたポイントの配列を使用することをお勧めします。あなたのストロークと塗りの黒と黄色のような、はっきりと見える

let points = [ 
    CGPoint(x: 10, y: 10), 
    CGPoint(x: 490, y: 10), 
    CGPoint(x: 490, y: 290), 
    CGPoint(x: 10, y: 290), 
    CGPoint(x: 10, y: 10) 
] 

使用色：たとえば、幅の広い500個のピクセルと300個のピクセルの高さのビューのために、あなたのようなものを使用することができます。

例えば、あなたのパスが正しくビューに追加されていることを確認してください：

let path = UIBezierPath(points: points) 

let shapeLayer = CAShapeLayer(path: path, lineColor: UIColor.blue, fillColor: UIColor.lightGray) 

view.layer.addSublayer(shapeLayer) 

は、XcodeののInterface Builderでのビューが含まれているコントローラを点検。デバッグビュー階層の機能では：