Question

在绘图应用程序中，我们可以识别用户何时开始绘制和移动手指以形成线条/形状。我想在地图上做同样的事情，我该怎么做？

Answer 1

基本步骤将涉及：

1）每当用户开始绘制时添加叠加视图。

if($_POST['trademarktm'] == 'copyright') {
echo "<div id='generated_footer_date' style='background-color:$backgroundColor; color:$fontColor; opacity: $opacity; ' >$trademark $date $company </div>";          
} else {
echo "error";
}

2）在叠加视图中进行自由手绘。

lazy var canvasView:CanvasView = {

    var overlayView = CanvasView(frame: self.googleMapView.frame)
    overlayView.isUserInteractionEnabled = true
    overlayView.delegate = self
    return overlayView

}()
@IBAction func drawActn(_ sender: AnyObject?) {

    self.coordinates.removeAll()
    self.view.addSubview(canvasView)
    let origImage = UIImage(named: "pen")
    let tintedImage = origImage?.withRenderingMode(UIImageRenderingMode.alwaysTemplate)
    drawBtn.setImage(tintedImage, for: .normal)
    drawBtn.tintColor = UIColor.white
    drawBtn.backgroundColor = UIColor.red

}

3）使用委托模式从OverlayView到Controller获取数组中的所有坐标

class CanvasView: UIImageView {

    weak var delegate:NotifyTouchEvents?
    var lastPoint = CGPoint.zero
    let brushWidth:CGFloat = 3.0
    let opacity :CGFloat = 1.0


    override func touchesBegan(_ touches: Set<UITouch>, with event: UIEvent?) {


        if let touch = touches.first {

            self.delegate?.touchBegan(touch: touch)
            lastPoint = touch.location(in: self)
        }
    }


    override func touchesMoved(_ touches: Set<UITouch>, with event: UIEvent?) {

        if let touch = touches.first  {

            self.delegate?.touchMoved(touch: touch)
            let currentPoint = touch.location(in: self)
            drawLineFrom(fromPoint: lastPoint, toPoint: currentPoint)
            lastPoint = currentPoint
        }
    }

    override func touchesEnded(_ touches: Set<UITouch>, with event: UIEvent?) {

        if let touch = touches.first  {

            self.delegate?.touchEnded(touch: touch)

        }
    }

    func drawLineFrom(fromPoint: CGPoint, toPoint: CGPoint) {

        UIGraphicsBeginImageContext(self.frame.size)
        let context = UIGraphicsGetCurrentContext()
        self.image?.draw(in: CGRect(x: 0, y: 0, width: self.frame.size.width, height: self.frame.size.height))

        context?.move(to: fromPoint)
        context?.addLine(to: toPoint)

        context?.setLineCap(.round)
        context?.setLineWidth(brushWidth)
        context?.setStrokeColor(UIColor.black.cgColor)
        context?.setBlendMode(.normal)
        context?.strokePath()

        self.image = UIGraphicsGetImageFromCurrentImageContext()
        self.alpha = opacity
        UIGraphicsEndImageContext()

    }

}

4）将坐标更改为多边形。

//MARK: GET DRAWABLE COORDINATES
extension ViewController:NotifyTouchEvents{

    func touchBegan(touch:UITouch){

        let location = touch.location(in: self.googleMapView)
        let coordinate = self.googleMapView.projection.coordinate(for: location)
        self.coordinates.append(coordinate)

    }

    func touchMoved(touch:UITouch){

        let location = touch.location(in: self.googleMapView)
        let coordinate = self.googleMapView.projection.coordinate(for: location)
        self.coordinates.append(coordinate)

    }

    func touchEnded(touch:UITouch){

        let location = touch.location(in: self.googleMapView)
        let coordinate = self.googleMapView.projection.coordinate(for: location)
        self.coordinates.append(coordinate)
        createPolygonFromTheDrawablePoints()
    }
}

我已经在Swift 3 here中创建了一个用于在Google Map上绘制/删除多个多边形的演示项目。

请记住在AppDelegate中设置API密钥并更改捆绑包标识符以运行项目。

Answer 2

Map Kit Polyline or Polygon Drawing - https://github.com/tazihosniomar/MapKitDrawing

此链接包含用于在Apple Map上绘制多边形的演示项目。但是，Google Map View的逻辑仍然相同。因此，您可以从中复制实现逻辑并将其应用于Google Map。

我希望这会对你有所帮助。

Answer 3

使用polyline画一条线。请参阅Google Maps Shapes。

要使用polyline，您需要提供locatoin坐标。要转换屏幕上的某个点，请使用GMSProjection类的coordinateForPoint:(CGPoint)point方法。

Polyline实际上在两个坐标之间画一条线。因此，通过移动mapView，这些线也将移动。我想这就是你想要的。

如何在iOS上的谷歌地图上进行徒手画？

3 个答案: