Mapa de google dentro de canvas
Publicado por Eduardo (1 intervención) el 17/04/2019 01:43:28
Buenas,
Disculpen, necesito ayuda con este codigo, quiero hacer que al hacer click en el boton, se ejecute una funcion que me ponga un mapa, y debajo, un canvas pero con el mapa dentro, ya aparece el mapa, pero no logro hacer que aparezca dentro canvas.
Si alguien sabe como, agradeceria que me dijeran como, de antemano gracias.
Este es el codigo que llevo
Disculpen, necesito ayuda con este codigo, quiero hacer que al hacer click en el boton, se ejecute una funcion que me ponga un mapa, y debajo, un canvas pero con el mapa dentro, ya aparece el mapa, pero no logro hacer que aparezca dentro canvas.
Si alguien sabe como, agradeceria que me dijeran como, de antemano gracias.
Este es el codigo que llevo
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
<!DOCTYPE html>
<html>
<head>
<script src="https://maps.googleapis.com/maps/api/js?v=3.exp"></script>
<script>
function mapa() {
var mapProp= {
center:new google.maps.LatLng(22.122512099999998, -100.98636359999999),zoom:5,};
var map = new google.maps.Map(document.getElementById("googleMap"),mapProp);
var c = document.getElementById("mycanvas");
var ctx = c.getContext("webgl2");
var img = document.getElementById("googleMap");
ctx.drawImage(img,0,0);
}</script>
</head>
<body>
<h1>Mapa de google</h1>
<div id="googleMap" style="width:640px;height:400px;"></div>
<p>Mapa en Canvas</p>
<canvas id="mycanvas" width="640" height="400"
style="border:1px solid #d3d3d3;">
Your browser does not support the HTML5 canvas tag.</canvas>
<br>
<button onclick="mapa()">Mapa</button>
</body>
</html>
Valora esta pregunta
0