Embed

---
<!DOCTYPE html>
<html>
<head>
<style>
#map {
height: 500px;
width: 100%;
}
</style>
<script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyBAdJLPUj6peHJr90LZ4YqDgbVqxdVP5NU&callback=initMap" async defer></script>
<script>
// Array of property locations with URLs and bold links
const properties = [
{
lat: 41.41966227,
lng: -120.6934301,
info: 'CALPINES UNIT 1A <a href="https://apex-land.com/ruiz" target="_blank"><strong>0.85 ACRES </strong></a>'
},
{
lat: 41.41141,
lng: -120.67953,
info: 'CALPINES UNIT 1B <a href="https://apex-land.com/watkins" target="_blank"><strong>1.71 ACRES</strong></a>'
},
{
lat: 41.29233,
lng: -120.80122,
info: 'CALPINES UNIT 3 <a href="https://apex-land.com/wharton" target="_blank"><strong>2.33 Acres</strong></a>'
}
];

// Initialize and add the map
function initMap() {
// The map, centered at a general location
const mapCenter = { lat: 41.41141, lng: -120.71555 };

const map = new google.maps.Map(document.getElementById("map"), {
zoom: 10,
center: mapCenter
});

// Add markers for each property
properties.forEach((property) => {
const marker = new google.maps.Marker({
position: { lat: property.lat, lng: property.lng },
map: map
});

// Add info window for each marker with bold external links
const infoWindow = new google.maps.InfoWindow({
content: property.info
});

marker.addListener("click", () => {
infoWindow.open(map, marker);
});
});
}
</script>
</head>
<body>
<div id="map"></div>
</body>
</html>
---
