рисование пути на статической карте Google - PullRequest
2 голосов
/ 03 августа 2011

Я написал этот код на стороне клиента и отправил на сервер с целью отправки по электронной почте. В этом сообщении электронной почты изображение отображается в виде разорванного изображения. Я хочу нарисовать путь на статической карте Google. Вот код, который я использовал.

<img src = "http://maps.googleapis.com/maps/api/staticmap?size=400x400&path=weight:3%7Ccolor:orange%7Cenc:'+polyline+'" />

ломаная линия, которую я создал таким образом

 var polyline;
var points = new Array();
for(var i=0; i<googleRoute.getVertexCount(); i++)
{
    points[i] = new GLatLng(googleRoute.getVertex(i).lng(),googleRoute.getVertex(i).lat());
}
polyline = new GPolyline(points, '#ff0000', 5, 0.7);  

, когда я использовал этот код, изображение не будет отображаться. Я написал этот код на стороне клиента и отправил на сервер для отправки по электронной почте.в этом письме изображение выглядит как разорванное изображение. Что-то не так с моим кодом?

Ответы [ 2 ]

1 голос
/ 22 февраля 2012

при увеличении расстояния между двумя городами переменная ломаная будет включать в себя множество значений Глатланга.поэтому он вызывает превышение ограничения на количество символов в URL-адресе ( Какое ограничение на количество символов в URL-адресе )мы не можем отправить длинный URL, который превышает ограничение charcter, используя ajax-запрос.вот почему я получил это сломанное изображение.В качестве решения я игнорировал промежуточные значения Глатланга, увеличивая цикл for со значениями пропуска.Поэтому ломаная линия может быть принята для уменьшенных карт.

0 голосов
/ 22 февраля 2012

Если у вас есть массив точек, вы можете просто сделать:

$points = array('53.061969559518,-3.1661187796875', '52.647368106972,-2.6806604056641');
$pointsUrl = "";
for($i=0; $i<count($points); $i++) {
   $pointsUrl .= '%7C'.$points[$i];
}
echo '<img src="http://maps.googleapis.com/maps/api/staticmap?path=color:0x0000ff%7Cweight:5'.$pointsUrl.'&size=270x256&maptype=roadmap&sensor=false" />';  
...