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 <script src="https://maps.googleapis.com/maps/api/js?sensor=false"></script> <!-- 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 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);
}