2012-05-19 5 views
3

Я пытаюсь захватить изображение панорамы Streetview, которые появляются в окне карты Google. Я создал кнопку, вызывающую функцию captureImage(), но я изо всех сил пытаюсь передать переменную var = img, возвращаемую в HTML.Пасс canvas.toDataURL вернуться к div

Я думаю, что существует проблема с переменной «contentString» и «content», которые являются локальными. Должен ли я написать функцию captureImage() в initialize()? Спасибо вам.

Мой код выглядит следующим образом:

function initialize() { 

//code here 

    var contentString = '<input type="button" value="Grab this picture" onClick="captureImage()" /> <div id="content" style="width:300px;height:400px;"></div>'; 
    var infowindow = new google.maps.InfoWindow({ 
     content: contentString 
    }); 

//code here 

} 

function captureImage() 
{ 
    var canvas = document.getElementById("content"); 
    var img = canvas.toDataURL("image/png"); 
    document.write('<img src="'+img+'"/>'); 

} 

HTML:

<div id="dialog" title="Image box"> 
     <p>Here is the image from Streetview :</p> 
        <img scr=""></img> 
    </div> 
+0

невозможно захватить из div. Все так не работает. – xiaoyi

+0

Спасибо, что я этого не знал. Альтернативой будет запрос API Карт Google Карт. https://developers.google.com/maps/documentation/imageapis/ – Florent

+0

Другим методом было бы отобразить содержимое HTML в холст, а затем экспортировать элемент canvas в JPEG с помощью canvas.toDataURL («image/png») ;». – Florent

ответ

0

Было бы проще, я думаю, чтобы установить непосредственно ЦСИ <img> «s с:

http://maps.googleapis.com/maps/api/streetview?size=<width>x<height>&location=lat,%20lng&fov=90&heading=235&pitch=10&sensor=false