ruta con lineas curvas en google maps

maximendez88 · #1 (**permalink**) 07/11/2012, 13:20

buenas tengo la siguiente aplicación la cual me va creando una ruta que voy haciendo... el tema esta en que la ruta se hace perfecto y todo... pero marca una linea recta.... a mi me gustaria que esta linea sea mas gruesa y tambien q sea curva y no recta.... espero que alguien me ayude... este es mi codigo... nadie sabe?????????

Código HTML:

Ver original<html>
<head>
<meta charset="utf-8" />
 <script src="https://maps.googleapis.com/maps/api/js?sensor=false"></script>
<title>Test Google Maps</title>
</head>
<body>
    <!-- MAPA -->
    <div id="map_canvas" style="width: 600px; height: 600px;"></div>
    <input type="text" name="ciudad" id="ciudad" /> <button onclick="agregarCiudad();">Agregar</button>
    
    <!-- funcion para agregar ciudad. La separo porque es sólo ejemplo -->
    <script type="text/javascript">
        function agregarCiudad(){
            showAddress(document.getElementById('ciudad').value);
            document.getElementById('ciudad').value = '';
        }
    </script>
    
    <script type="text/javascript">
    //variables y objetos globales
    var map             //mapa
    var geocoder;       //geocoder
    var _path = [];     // ruta
    var _poliLinea = new google.maps.Polyline({ //polilinea
        path: _path,
        strokeColor: '#FF0000',
        strokeOpacity: 1.0,
        strokeWeight: 2
    });
 
    //inicializo
    initialize();
 
    function initialize() {
        //centrado
        var myLatLng = new google.maps.LatLng(37.4419, -122.1419);
        //opciones
        var mapOptions = {
            zoom: 1,
            center: myLatLng,
            mapTypeId: google.maps.MapTypeId.TERRAIN
        };
        //geocoder
        geocoder = new google.maps.Geocoder();
        //creo mapa
        map = new google.maps.Map(document.getElementById('map_canvas'), mapOptions);
        
        //asigno polilinea al mapa
        _poliLinea.setMap(map);
    }
 
    function showAddress(s_address) {
        var address = s_address;
        //busco la direccion dada
        geocoder.geocode( { 'address': address}, function(results, status) {
          if (status == google.maps.GeocoderStatus.OK) {
            //centro el mapa en el resultado
            map.setCenter(results[0].geometry.location);
            //creo marcador
            var marker = new google.maps.Marker({
                map: map,
                position: results[0].geometry.location
            });
            //agrego punto a la linea
            agregarRuta(results[0].geometry.location)
          } else {
            alert('Error: ' + status);
          }
        });
     }
     
    function agregarRuta(o_punto){
        //creo punto a partir de la dirección dada
        var o_LL = new google.maps.LatLng(o_punto.Xa, o_punto.Ya)
        //agrego el punto al array de la ruta
        _path.push(o_LL);
        //cargo la nueva ruta en la polilinea
        _poliLinea.setPath(_path);
        //centro el mapa en el último punto
        map.setCenter(o_LL);
        //Hago un poco de zoom
        map.setZoom(6);
    }
    </script>
</body>
</html>

maximendez88 · #2 (**permalink**) 09/11/2012, 10:56

entonces??????????? no c a c