D. 777KLM D. 777KLM - 27 days ago 5
Javascript Question

Google Maps Infowindow Display Specific Content

I am trying to display information of an airport in an Infowindow:

enter image description here

The information for the airport is retrieved from a .GEOjson file:



{ "type": "Feature", "properties": { "Name": "Epps Airpark", "Description": "description: id: 6525
<br>ident: 00AL
<br>type: small_airport
<br>latitude_deg: 34.86479949951172
<br>longitude_deg: -86.77030181884766
<br>elevation_ft: 820
<br>continent: NA
<br>iso_country: US
<br>iso_region: US-AL
<br>municipality: Harvest
<br>scheduled_service: no
<br>gps_code: 00AL
<br>iata_code:
<br>local_code: 00AL
<br>home_link:
<br>wikipedia_link:
<br>keywords:
<br>id: 6525.0
<br>ident: 00AL
<br>type: small_airport
<br>latitude_deg: 34.86479949951172
<br>longitude_deg: -86.77030181884766
<br>elevation_ft: 820.0
<br>continent: NA
<br>iso_country: US
<br>iso_region: US-AL
<br>municipality: Harvest
<br>scheduled_service: no
<br>gps_code: 00AL
<br>iata_code:
<br>local_code: 00AL
<br>home_link:
<br>wikipedia_link:
<br>keywords: " }, "geometry": { "type": "Point", "coordinates": [ -86.770302, 34.864799, 0.0 ] } }





I would like to remove some of the items such as wikipedia_link, local_code and id from the Infowindow.

The Infowindow code goes like this:



var infowindow = new google.maps.InfoWindow();

function gotoFeature(featureNum) {
var feature = map.data.getFeatureById(features[featureNum].getId());
if (!!feature) google.maps.event.trigger(feature, 'changeto', {
feature: feature
});
else alert('feature not found!');
}

map.data.addListener('click', function(event) {
var myHTML = event.feature.getProperty("Description");
infowindow.setContent("<div style='width:250px; text-align: center; '>" + myHTML + "</div>");
infowindow.setPosition(event.feature.getGeometry().get());
infowindow.setOptions({
pixelOffset: new google.maps.Size(0, -30)
});
infowindow.open(map);
});





How would you go about preventing some of the items (such as wikipedia_link, local_code and id) being displayed on the Infowindow?

Answer

One way to do it is by splitting the HTML description into an array and filtering out the items you don't want to show

var myHTML = event.feature.getProperty("Description");

var categories = ["wikipedia_link", "local_code", "id"]; // the categories to exclude

function excludeCat(d) {
  if (categories.indexOf(d.split(":")[0]) < 0) {
    return d
  };
};

myHTML = myHTML.split("<br>").filter(excludeCat).join("<br>");