我想知道是否可以在使用Google Maps API的iOS应用中实现RouteBoxer？如果不是，是否有另一种方法可以在路线上找到POI？我对HTML不太熟悉，但是是否可以通过发出HTTP请求来访问RouteBoxer？使用RouteBoxer是否需要网页和 map 可见？我在后端使用Parse.com，因此如果需要，我也可以使用Javascript在云中发出HTTP请求。
最佳答案
我现在找到了解决方案(我不知道这是正确的方法)。我正在做的是将Routeboxer.JS文件添加到项目中，并创建HTML文件以从Routeboxer.js文件中调用box函数，该函数返回盒子。
这是HTML文件代码。
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:v="urn:schemas-microsoft-com:vml">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8"/>
<title>Google Maps JavaScript API Search Along a Route Example</title>
<script src="http://maps.google.com/maps/api/js" type="text/javascript"></script>
<script src="RouteBoxer.js" type="text/javascript"></script>
<script type="text/javascript">
var boxpolys = null;
var directions = null;
var routeBoxer = null;
var distance = null; // km
function initialize() {
// Default the map view to the continental U.S.
routeBoxer = new RouteBoxer();
directionService = new google.maps.DirectionsService();
}
function route(source, destination, distance) {
// Convert the distance to box around the route from miles to km
//distance = parseFloat(document.getElementById("distance").value) * 1.609344;
routeBoxer = new RouteBoxer();
directionService = new google.maps.DirectionsService();
//route("Hyderabad", "Vijayawada", "5");
distance = parseFloat(distance) * 1.609344;
var request = {
origin: source,
destination: destination,
travelMode: google.maps.DirectionsTravelMode.DRIVING
}
// Make the directions request
//onload="route('Vijayawada','Hyderabad','5');
var boxes;
directionService.route(request, function(result, status) {
if (status == google.maps.DirectionsStatus.OK) {
//directionsRenderer.setDirections(result);
// Box around the overview path of the first route
var path = result.routes[0].overview_path;
var boxes = routeBoxer.box(path, distance);
//This object to get the boxes array to get the places from api call
var result = JSON.stringify(boxes);
console.log(result);
var data = [];
for (var i = 0; i < boxes.length; i++) {
//This object to draw the boxes..
var str = {"NE": [boxes[i].getNorthEast().lat(), boxes[i].getNorthEast().lng()], "SE": [boxes[i].getSouthWest().lat(), boxes[i].getNorthEast().lng()], "SW": [boxes[i].getSouthWest().lat(), boxes[i].getSouthWest().lng()], "NW": [boxes[i].getNorthEast().lat(), boxes[i].getSouthWest().lng()], "WW": [boxes[i].getNorthEast().lat(), boxes[i].getNorthEast().lng()]};
data.push(str)
}
var latLng = JSON.stringify(data)
console.logCoord(latLng);
//return JSON.Stringify(boxes);
} else {
alert("Directions query failed: " + status);
return "Direction query failed";
}
});
}
//As direction service.route method is Asynchronous call we can't return anything from this function so we added the console.log to get the data back to iOS
console = new Object();
console.log = function(log) {
var iframe = document.createElement("IFRAME");
iframe.setAttribute("src", "ios-log:#iOS#" + log);
document.documentElement.appendChild(iframe);
iframe.parentNode.removeChild(iframe);
iframe = null;
};
console.debug = console.log;
console.info = console.log;
console.warn = console.log;
console.error = console.log;
console.logCoord = function(log) {
var coordiframe = document.createElement("IFRAME");
coordiframe.setAttribute("src", "ios-coor:#iOS#" + log);
document.documentElement.appendChild(coordiframe);
coordiframe.parentNode.removeChild(coordiframe);
coordiframe = null;
};
console.debug = console.logCoord;
console.info = console.logCoord;
console.warn = console.logCoord;
console.error = console.logCoord;
</script>
</head>
<body>
</body>
</html>
之后，将UIWebView对象添加到视图控制器。无需用户可见。在viewDidLoad方法中，使用本地HTML文件加载URL。这里最简单的3是HTML文件名。
override func viewDidLoad() {
super.viewDidLoad()
// Do any additional setup after loading the view, typically from a nib.
let url = NSBundle.mainBundle().URLForResource("simpletest-3", withExtension:"html")
let request = NSURLRequest(URL: url!)
webView.loadRequest(request)
}
以下是从javascript ..!中计算路由方法的示例函数。调用此函数之前，必须完成Web视图的加载
@IBAction func onClick(sender: UIButton!) {
let function = String(format: "route('%@', '%@', '%@')", "Hyderabad", "Mysore", "5")
//let function = String(format: "route('Vijayawada','Hyderabad','5')")
let result = webView.stringByEvaluatingJavaScriptFromString(function)
print("result is : \(result)")
}
在webview的Delegate方法中，我们可以获得结果(Boxes数组，以及在 map 上绘制Boxes的坐标)。
extension MapViewController: UIWebViewDelegate {
func webViewDidFinishLoad(webView: UIWebView) {
print("web view did finsih loading")
}
func webView(webView: UIWebView, shouldStartLoadWithRequest request: NSURLRequest, navigationType: UIWebViewNavigationType) -> Bool {
if let urlString = request.URL?.absoluteString.stringByRemovingPercentEncoding {
if urlString.hasPrefix("ios-log:") {
let logString = urlString.componentsSeparatedByString(":#iOS#")[1]
self.getPlacesForJsonData(logString)
return false
}
if urlString.hasPrefix("ios-coor:") {
let logString = urlString.componentsSeparatedByString(":#iOS#")[1]
//print("logString is \(logString)")
let data: NSData = logString.dataUsingEncoding(NSUTF8StringEncoding)!
do {
let json = try NSJSONSerialization.JSONObjectWithData(data, options: NSJSONReadingOptions.MutableLeaves)
//print("coordString is \(json)")
if let json = json as? NSArray {
self.drawBoxes(json)
}
} catch {
print("JSON conversion error")
}
return false
}
}
return true
}
}
最后一件事是沿着路线在 map 上绘制方框。
func drawBoxes(boxes: NSArray) {
if boxes.count > 0 {
for dict in boxes {
let path = GMSMutablePath()
path.addCoordinate(CLLocationCoordinate2DMake((dict["NE"] as! NSArray)[0].doubleValue, (dict["NE"] as! NSArray)[1].doubleValue))
path.addCoordinate(CLLocationCoordinate2DMake((dict["SE"] as! NSArray)[0].doubleValue, (dict["SE"] as! NSArray)[1].doubleValue))
path.addCoordinate(CLLocationCoordinate2DMake((dict["SW"] as! NSArray)[0].doubleValue, (dict["SW"] as! NSArray)[1].doubleValue))
path.addCoordinate(CLLocationCoordinate2DMake((dict["NW"] as! NSArray)[0].doubleValue, (dict["NW"] as! NSArray)[1].doubleValue))
// Create the polygon, and assign it to the map.
let polygon = GMSPolygon(path: path)
polygon.fillColor = UIColor(red:1.0, green:0, blue:0, alpha:0.25);
//polygon.strokeColor = UIColor.blackColor()
polygon.strokeWidth = 0
polygon.map = mapView
}
}
}
如果您对此有任何疑问，希望这对您有所帮助。