Gonzalosd
-
Posts
4 -
Joined
-
Last visited
Gonzalosd's Achievements
Level 1 (1/20)
0
Reputation
-
Yes, I hid it on mobile but I still want it to display on other platforms.
-
kataricorp.com Currently I just added a crude ass white square to block the lower portion of the section. It is not good but its what I have.
-
I should add, this is something I tried but it leads to the map becoming invisible: <style> html, body { height: 100%; margin: 0; padding: 0; } #map { height: 100%; width: 100%; overflow: hidden; } </style>
-
Hello! I know very very little of coding or such but I managed to get a map in my site. However, after many attempts I can't get the map to fit the section as I want it to. Ideally I would like to look as it does in the right side of the attached picture. I've tested a few approaches but usually they lead to the map becoming invisible! Anyway here's my code. <!DOCTYPE html> <html> <head> <title>Multiple Markers on Google Maps</title> <style> #map { height: 400px; width: 100%; } </style> </head> <body> <div id="map"></div> <script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyCI8DBbT0Cw23BHTb2p0sdZKlpwvDQFG8Q&callback=initMap" async defer></script> <script> function initMap() { const map = new google.maps.Map(document.getElementById("map"), { zoom: 4, center: { lat: -7.116647, lng: -75.548848 }, styles: [ { "featureType": "all", "elementType": "labels.text", "stylers": [ { "color": "#878787" } ] }, { "featureType": "all", "elementType": "labels.text.stroke", "stylers": [ { "visibility": "off" } ] }, { "featureType": "administrative", "elementType": "geometry", "stylers": [ { "visibility": "on" } ] }, { "featureType": "administrative", "elementType": "labels", "stylers": [ { "visibility": "off" } ] }, { "featureType": "administrative", "elementType": "labels.text.stroke", "stylers": [ { "visibility": "off" } ] }, { "featureType": "administrative.country", "elementType": "labels", "stylers": [ { "visibility": "off" } ] }, { "featureType": "administrative.country", "elementType": "labels.text", "stylers": [ { "visibility": "on" } ] }, { "featureType": "administrative.country", "elementType": "labels.text.stroke", "stylers": [ { "visibility": "off" } ] }, { "featureType": "administrative.province", "elementType": "geometry", "stylers": [ { "visibility": "off" } ] }, { "featureType": "administrative.province", "elementType": "labels", "stylers": [ { "visibility": "off" } ] }, { "featureType": "administrative.locality", "elementType": "geometry", "stylers": [ { "visibility": "off" } ] }, { "featureType": "administrative.locality", "elementType": "labels", "stylers": [ { "visibility": "off" } ] }, { "featureType": "administrative.neighborhood", "elementType": "geometry", "stylers": [ { "visibility": "off" } ] }, { "featureType": "administrative.neighborhood", "elementType": "labels", "stylers": [ { "visibility": "off" } ] }, { "featureType": "administrative.land_parcel", "elementType": "geometry", "stylers": [ { "visibility": "off" } ] }, { "featureType": "administrative.land_parcel", "elementType": "labels", "stylers": [ { "visibility": "off" } ] }, { "featureType": "landscape", "elementType": "all", "stylers": [ { "color": "#f9f5ed" } ] }, { "featureType": "landscape", "elementType": "labels", "stylers": [ { "visibility": "off" } ] }, { "featureType": "landscape.man_made", "elementType": "labels", "stylers": [ { "visibility": "off" } ] }, { "featureType": "poi", "elementType": "labels", "stylers": [ { "visibility": "off" } ] }, { "featureType": "road", "elementType": "geometry.fill", "stylers": [ { "color": "#cecece" } ] }, { "featureType": "road", "elementType": "geometry.stroke", "stylers": [ { "visibility": "off" } ] }, { "featureType": "road.highway", "elementType": "all", "stylers": [ { "color": "#f5f5f5" } ] }, { "featureType": "road.highway", "elementType": "geometry.stroke", "stylers": [ { "color": "#c9c9c9" } ] }, { "featureType": "water", "elementType": "all", "stylers": [ { "color": "#2e2eda" } ] } ], disableDefaultUI: true, }); const locations = [ ["Hochschild Unidad minera inmaculada", -14.958623, -73.242344], ["Hochschild Unidad minera ares", -15.035507, -72.169304], ["Hochschild Unidad minera arcata", -15.040750, -72.275059], ["Hochschild Unidad minera pallancata", -14.746340, -73.180474], ["Kallpa Planta Cerro del águila", -12.290699, -74.682924], ["Kallpa Planta Cañon del pato", -8.813180, -77.852688], ["Kallpa Planta puerto bravo", -17.040437, -71.976836], ["Kallpa, Planta aguaytia", -8.415343, -74.550786], ["Planta carhuaquero", -6.611310, -79.239425], ["Dialogo social chiu chiu", -22.342247, -68.655542], ["Dialogo social tawa", -22.894380, -68.197299], ["Dialogo social Caritaya", -19.015545, -69.337964], ["CNR La Loma, Cesar", 9.619433, -73.594437], ["CNR Hatillo, Cesar", 9.648722, -73.559468], ["CNR Cienaga, Santa Marta", 10.86579, -74.38343], ["Pronaca Planta Bucay", -2.215224, -79.138591], ["Pronaca Planta Santo Domingo", -0.249751, -79.168396], ["Pronaca Planta en Sierra", -0.183923, -78.453141], ["Pronaca Planta en Guayaquil", -2.061362, -79.944046], ["PRONACA, Granja AVECOPA, Pujili, Ecuador", -0.941356, -78.676346], ["Pedregal Fundo los brujos, ica", -14.155222, -75.746296], ["Pedregal Fundo piura pedregal", -5.086227, -80.595136], ["Apropisco Pisco", -13.791702, -76.239512], ["Tasa Planta pisco", -13.797954, -76.240434], ["Tasa Planta malabrigo", -7.696595, -79.434573], ["Tasa Planta callao", -11.956764, -77.133471], ["Tasa Planta chimbote", -9.114055, -78.559832], ["Tasa Planta atico", -16.228975, -73.695005], ["Tasa Planta matarani", -17.005456, -72.100206], ["Tasa Planta Pucusana", -12.487560, -76.746628], ["Tasa Planta Samanco", -9.257892, -78.495838], ["Minera Bateas Mina bateas, Arequipa", -15.204195, -71.862462], ]; locations.forEach((location) => { const marker = new google.maps.Marker({ position: { lat: location[1], lng: location[2] }, title: location[0], map: map, }); }); } </script> </body> </html> Help would be greatly appreciated. Please be patient.
