Google Maps Javascript API: Ocultar círculo al cargar y desplazar hacia afuera y mostrar al hacer clic.

Estoy intentando hacer que la API de Google Maps funcione correctamente. Quiero mostrar una vista ampliada de una ubicación cuando se marque una casilla de verificación, y cuando se desmarque la casilla, quiero hacer zoom y mostrar un círculo que mostrará el área de servicio.

He logrado mostrar el círculo al hacer clic, pero no puedo averiguar cómo controlar el zoom.

Aquí está mi código hasta ahora

JS

// variables globales
var map;
var ntucCircle;
var markers = [];

$("#layer1_checkbox").change(function() {
  ntucCircle.setMap(ntucCircle.getMap() ? null : map);
});

$("#layer1_checkbox").change(function() {
  if (this.checked) {
    ntucCircle.setMap(map);
  } else {
    ntucCircle.setMap(null);
  }
});

function initMap() {
  map = new google.maps.Map(document.getElementById("map"), {
    zoom: 12,
    center: {
      lat: 1.3420894594991328,
      lng: 103.83490918886719,
    },
  });

  var ntuc = {
    lat: 1.32805676,
    lng: 103.9216584,
  };

  // inicializar la variable global
  ntucCircle = new google.maps.Circle({
    strokeColor: "#FF0000",
    strokeOpacity: 0.8,
    strokeWeight: 2,
    fillColor: "#FF0000",
    fillOpacity: 0.35,
    center: ntuc,
    radius: 5000, // en metros
    visible: null,
  });
}

google.maps.event.addDomListener(window, "load", initMap);

HTML

Layer 1