由于get请求中最多只能包含2048个字符,因此您无法使用Google静态地图生成包含大量多边形点的多边形图像。特别是如果您尝试在一个地图上绘制许多复杂的多边形。如果您使用Google Maps API,则不会有任何问题-它非常好用!但我想要一张图片(jpg或png)......那么,有没有机会从Google Maps API创建图像?或者有什么方法可以“欺骗”2048个字符的限制?谢谢!
另一个注意事项是(据我所知),静态地图 API 仅允许在地图上绘制单个编码折线(如果您自己关闭它或填充它,则可能看起来像多边形,但它仍然是折线,而不是多边形)。
简化您的折线的一种选择是 Douglas Peucker 算法。下面是一种实现,它通过 google.maps.Polyline
对象扩展了一个 simplify
方法。
这依赖于加载 Google 地图 JS API,如果您使用静态地图,则可能不需要,但以下代码可以轻松重新编写。
google.maps.Polyline.prototype.simplify = function(tolerance) {
var points = this.getPath().getArray(); // An array of google.maps.LatLng objects
var keep = []; // The simplified array of points
// Check there is something to simplify.
if (points.length <= 2) {
return points;
}
function distanceToSegment(p, v, w) {
function distanceSquared(v, w) {
return Math.pow((v.x - w.x),2) + Math.pow((v.y - w.y),2)
}
function distanceToSegmentSquared(p, v, w) {
var l2 = distanceSquared(v, w);
if (l2 === 0) return distanceSquared(p, v);
var t = ((p.x - v.x) * (w.x - v.x) + (p.y - v.y) * (w.y - v.y)) / l2;
if (t < 0) return distanceSquared(p, v);
if (t > 1) return distanceSquared(p, w);
return distanceSquared(p, { x: v.x + t * (w.x - v.x), y: v.y + t * (w.y - v.y) });
}
// Lat/Lng to x/y
function ll2xy(p){
return {x:p.lat(),y:p.lng()};
}
return Math.sqrt(distanceToSegmentSquared(ll2xy(p), ll2xy(v), ll2xy(w)));
}
function dp( points, tolerance ) {
// If the segment is too small, just keep the first point.
// We push the final point on at the very end.
if ( points.length <= 2 ) {
return [points[0]];
}
var keep = [], // An array of points to keep
v = points[0], // Starting point that defines a segment
w = points[points.length-1], // Ending point that defines a segment
maxDistance = 0, // Distance of farthest point
maxIndex = 0; // Index of said point
// Loop over every intermediate point to find point greatest distance from segment
for ( var i = 1, ii = points.length - 2; i <= ii; i++ ) {
var distance = distanceToSegment(points[i], points[0], points[points.length-1]);
if( distance > maxDistance ) {
maxDistance = distance;
maxIndex = i;
}
}
// check if the max distance is greater than our tollerance allows
if ( maxDistance >= tolerance ) {
// Recursivly call dp() on first half of points
keep = keep.concat( dp( points.slice( 0, maxIndex + 1 ), tolerance ) );
// Then on second half
keep = keep.concat( dp( points.slice( maxIndex, points.length ), tolerance ) );
} else {
// Discarding intermediate point, keep the first
keep = [points[0]];
}
return keep;
};
// Push the final point on
keep = dp(points, tolerance);
keep.push(points[points.length-1]);
return keep;
};
var line = new google.maps.Polyline({path: path});
var encoded = google.maps.geometry.encoding.encodePath(line.getPath());
var tol = 0.0001;
while (encoded.length > 1800) {
path = line.simplify(tol);
line = new google.maps.Polyline({path: path});
encoded = google.maps.geometry.encoding.encodePath(path);
tol += .005;
}
虽然我不确定它在带有覆盖层的Google地图上的性能如何。
编辑:如果您正在使用html2canvas,请务必查看此问题: https://dev59.com/vnTYa4cB1Zd3GeqPycAt#17816195
自2016年9月起,URL限制大小已更改为8192个字符。
https://developers.google.com/maps/documentation/static-maps/intro#url-size-restriction
公共问题跟踪器中还有一个功能请求,已标记为已解决。