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

本文介绍了如何在iOS上的谷歌地图上进行徒手画？的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！ 问题描述

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

In drawing application we can identify when the user is starting to draw and moving the finger to make a line/shape. I'm trying to do the same on a map, how can I do this?

推荐答案

基本步骤将涉及：

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

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 }

2）自由手绘图叠加视图。

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() } }

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

//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() } }

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

func createPolygonFromTheDrawablePoints(){ let numberOfPoints = self.coordinates.count //do not draw in mapview a single point if numberOfPoints > 2 { addPolyGonInMapView(drawableLoc: coordinates) }//neglects a single touch coordinates = [] self.canvasView.image = nil self.canvasView.removeFromSuperview() let origImage = UIImage(named: "pen") let tintedImage = origImage?.withRenderingMode(UIImageRenderingMode.alwaysTemplate) drawBtn.setImage(tintedImage, for: .normal) drawBtn.tintColor = UIColor.red drawBtn.backgroundColor = UIColor.white } func addPolyGonInMapView( drawableLoc:[CLLocationCoordinate2D]){ isDrawingModeEnabled = true let path = GMSMutablePath() for loc in drawableLoc{ path.add(loc) } let newpolygon = GMSPolygon(path: path) newpolygon.strokeWidth = 3 newpolygon.strokeColor = UIColor.black newpolygon.fillColor = UIColor.black.withAlphaComponent(0.5) newpolygon.map = googleMapView if cancelDrawingBtn.isHidden == true{ cancelDrawingBtn.isHidden = false } userDrawablePolygons.append(newpolygon) addPolygonDeleteAnnotation(endCoordinate: drawableLoc.last!,polygon: newpolygon) }

我已经为绘图创建了一个演示项目/在Swift 3中删除谷歌地图上的多个多边形此处。

I have created a demo project for drawing/deleting multiple polygons on Google Map in Swift 3 here.

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