Pentaho Usando Google Maps - uma Rota com vários Markers em volta

Continuando o exemplo Google maps: 

http://aprendapentaho.blogspot.com.br/2015/09/existem-variasmaneira-de-utilizar-o.html

Podemos criar diversos markers, informando ícones distintos para cada marker.

Para isso precisamos alterar o JavaScript do Mapa passando arrays de latitude e longitude, informamos os ícone para serem utilizados(se não informar irá utilizar o padrão), e também informamos o que será listado no clique do marker:

Para isso a função JavaScript ficará assim:

var map;

var directionsDisplay;

var directionsService = new google.maps.DirectionsService();

function initialize() {
debugger;
directionsDisplay = new google.maps.DirectionsRenderer();
var latlng = new google.maps.LatLng(-18.8800397, -47.05878999999999);

    var options = {
        zoom: 5,
center: latlng,
        mapTypeId: google.maps.MapTypeId.ROADMAP
    };

    map = new google.maps.Map(document.getElementById("mapa"), options);
directionsDisplay.setMap(map);
directionsDisplay.setPanel(document.getElementById("trajeto-texto"));



if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(function (position) {

pontoPadrao = new google.maps.LatLng(position.coords.latitude, position.coords.longitude);
map.setCenter(pontoPadrao);

var geocoder = new google.maps.Geocoder();

geocoder.geocode({
"location": new google.maps.LatLng(position.coords.latitude, position.coords.longitude)
            },
            function(results, status) {
if (status == google.maps.GeocoderStatus.OK) {
$("#txtEnderecoPartida").val(results[0].formatted_address);
}
            });
});
}
}

function attachSecretMessage(marker, secretMessage) {
  var infowindow = new google.maps.InfoWindow({
    content: secretMessage
  });

  marker.addListener('click', function() {
    infowindow.open(marker.get('map'), marker);
  });
}

initialize();

$("form").submit(function(event) {

event.preventDefault();

var enderecoPartida = $("#txtEnderecoPartida").val();
var enderecoChegada = $("#txtEnderecoChegada").val();

var request = {
origin: enderecoPartida,
destination: enderecoChegada,
//waypoints: [{location: 'Rodoviária, Curitiba'}, {location: 'Mercado, Festival'}],
travelMode: google.maps.TravelMode.DRIVING
};

directionsService.route(request, function(result, status) {
if (status == google.maps.DirectionsStatus.OK) {
directionsDisplay.setDirections(result);
}
});

});

$("");

$(function(){

var array_marker1 = [
  [' João da Silva - Brigadeiro frango 892 Curitiba PR', -25.429818707550634, -49.28400590000001],
  [' Carlos Almeida - Visconde de Guarapuava 150 Curitiba PR', -25.42701120754971, -49.243870000000015],
  ['Jean Francisco da Silva - Cruz Machado 32 Curitiba PR', -25.42956425755057, -49.27301109999996],
  ['Mauricio da Silva - Sete de Setembro 43 Curitiba PR',-25.43604810755275, -49.26236740000002],
  ['Joana Braga - Chile 3343 Curitiba PR', -25.452987707558535, -49.27117620000001],
  ['Julio Silveira - Iguacu 87 Curitiba PR', -25.43969965755398, -49.26268485000003],
  ['Marlene Mattos - Francisco Rocha 832 Curitiba PR', -25.438911307553735, -49.29122834999998],
  ['Joaquim Padilha - Silva Jardim 2232 Curitiba PR', -25.44501495755579, -49.281739000000016],
  ['Junior Fonseca - José Loureiro 678 Curitiba PR', -25.43124715755116, -49.26620034999996],
  ['Patricia da Paz - Praça Ozorio 23 Curitiba PR', -25.432811457551686, -49.27505959999996],
  ['Fernando Pedrosa - Visconde de Nacar 54 Curitiba PR', -25.444558307555685, -49.28864414999998],
  ['Kelvin Jeison - visconde de guarapuava 750 Curitiba PR', -25.44636735755626, -49.27561355],
  ['Sem Nome - R. Des. Motta, 750 - Água Verde, Fazendinha/Portão, Curitiba - PR', -25.43742330755322, -49.26142370000002],
  ['Paulo Coelho - Av. Silva Jardim, 13-29 - Rebouças, Matriz, Curitiba - PR, Brasil', -25.43742330755322, -49.26142370000002],
  
  ];
  
  

for (i = 0; i < array_marker1.length; i++) {  
//alert (array_marker1[i]);
  marker = new google.maps.Marker({
position: new google.maps.LatLng(array_marker1[i][1], array_marker1[i][2]),
    title: array_marker1[i].toString(),
icon: 'img/marker1.png', //define o ícone
    map: map
  });
  attachSecretMessage(marker, array_marker1[i].toString()); 
}


var array_marker2 = [
  [' 001 - Pablo da Costa - André de Barros 87 Curitiba PR', -25.436006957552745, -49.27170760000001],
  [' 002 - Vicente Machado Curitiba PR', -25.433630157551953, -49.27784125000005],
  [' 003 - Alfredo Bufren 98 Curitiba PR',-25.428608807550226, -49.26821755000003],
  ['  004 - Av. Vicente Machado, 2293-2327 - Centro, Santa Felicidade, Curitiba - PR, 80440-020, Brasil',-25.4417465075547, -49.29811749999999],
  [' 005 - Rua do Herval Curitiba PR', -25.432087407551446, -49.25545505000002],
  ];

for (i = 0; i < array_marker2.length; i++) {  
  marker = new google.maps.Marker({
position: new google.maps.LatLng(array_marker2[i][1], array_marker2[i][2]),
    title: array_marker2[i].toString(),
icon: 'img/marker2.png', //define o icone
    map: map
  });
  attachSecretMessage(marker, array_marker2[i].toString()); 
}

var array_marker3 = [
  [' CT 1 - Brigadeiro Franco 1050 Curitiba PR', -25.434307407552133, -49.28192419999999],
  [' CT 2 - Engenheiro Rebouças 430 Curitiba PR', -25.443225357555207, -49.26313204999997],
  [' CT 3 - Senador Souza Neves 874 Curitiba PR', -25.43131000755113, -49.248787400000026],
  
  ];

for (i = 0; i < array_marker3.length; i++) {  
  marker = new google.maps.Marker({
position: new google.maps.LatLng(array_marker3[i][1], array_marker3[i][2]),
    title: array_marker3[i].toString(),
icon: 'img/marker3.png', // define o icone
    map: map
  });
  attachSecretMessage(marker, array_marker3[i].toString()); 
}

var enderecoPartida = "Engenheiro rebouças 650 Curitiba PR";
        var enderecoChegada = "Brigadeiro Franco 654 Curitiba PR";
   
var request = {
origin: enderecoPartida,
destination: enderecoChegada,
   //waypoints: [{location: 'Brigadeiro Franco 354 Curitiba PR'}, {location: 'Getulio Vargas 354 Curitiba PR'}],
travelMode: google.maps.TravelMode.DRIVING
};
directionsService.route(request, function(result, status) {
if (status == google.maps.DirectionsStatus.OK) {
directionsDisplay.setDirections(result);

}
});
});

Explicações:

 icon: 'img/marker3.png' = se não informar (comentar a linha) é usado o padrão do google maps, no pentaho pode criar uma pasta chamada Google dentro do diretorio: 

c:\opt\biserver-ce\pentaho-solutions\system\common-ui\resources\js\google\img\, dentro dessa pasta 'img' podemos adicionar todos os ícones e depois efetuar o apontamento no Js da seguinte forma:

 icon: '/pentaho/content/common-ui/resources/js/google/marker3.png',

A function attachSecretMessage= é usada para apresentar os dados ao clicar sobre o marker.

Para conseguir ícones conforme a necessidade e de forma gratuita pode-se utilizar alguns sites, este link apresenta alguns:

http://www.designerd.com.br/5-sites-para-download-gratuito-de-icones/