Static Maps: Drawing polygons with many points. (2048 char limitation) -


because there limitation 2048 characters in request, not able generate image google static maps contains polygon great number of polygon points.

especially if try draw many complex polygons on 1 map. if use google maps api, have no problem - works well! want have image (jpg or png)...

so, there opportunity create image google maps api? or way 'trick' 2048 char limitation?

thanks!

there's no way 'trick' character limit, possible simplify polyline bring encoded polyline string below character limit. may or may not result in polygon of suitable fidelity needs.

one additional caveat (to best of knowledge) static maps api allows single encoded polyline drawn on map (this can polygon, if either close or fill it, it's still polyline, not polygon).

one option simplifying polyline douglas peucker algorithm. below implementation extends google.maps.polyline object simplify method.

this relies on having google maps js api loaded, may not want if you're using static maps, code below re-written.

google.maps.polyline.prototype.simplify = function(tolerance) {      var points = this.getpath().getarray(); // array of google.maps.latlng objects     var keep = []; // simplified array of points      // check there 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 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 segment small, keep first point.          // push final point on @ end.         if ( points.length <= 2 ) {             return [points[0]];         }          var keep = [],  // array of points keep             v = points[0], // starting point defines segment             w = points[points.length-1], // ending point defines segment             maxdistance = 0, // distance of farthest point             maxindex = 0; // index of said point          // loop on every intermediate point find point greatest distance segment         ( var = 1, ii = points.length - 2; <= ii; i++ ) {             var distance = distancetosegment(points[i], points[0], points[points.length-1]);             if( distance > maxdistance ) {                 maxdistance = distance;                 maxindex = i;             }         }          // check if max distance greater our tollerance allows          if ( maxdistance >= tolerance ) {              // recursivly call dp() on first half of points             keep = keep.concat( dp( points.slice( 0, maxindex + 1 ), tolerance ) );              // on second half             keep = keep.concat( dp( points.slice( maxindex, points.length ), tolerance ) );          } else {             // discarding intermediate point, keep first             keep = [points[0]];         }         return keep;     };      // push final point on     keep = dp(points, tolerance);     keep.push(points[points.length-1]);     return keep;  }; 

this has been cobbled of couple of examples (here , here).

you can take original polyline , feed through function increasing tolerance until resulting encoded polyline falls below url length limit (which depend on other parameters you're passing static maps).

something should work:

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; } 

Comments

Popular posts from this blog

c# - DetailsView in ASP.Net - How to add another column on the side/add a control in each row? -

javascript - firefox memory leak -

Trying to import CSV file to a SQL Server database using asp.net and c# - can't find what I'm missing -