🌎 Planetas rocosos

Los cuatro planetas más próximos al Sol son Mercurio, Venus, la Tierra y Marte. Nuestro planeta es el más grande de ellos, seguido muy de cerca por Venus.

Mercurio, el menor de los planetas interiores, es el más próximo al Sol y tiene poca atmósfera que lo proteja de la radiación que emite nuestra estrella. Venus, aunque se vea hermoso por sus colores, está cubierto de nubes de ácido sulfúrico. Además, es el planeta que alcanza la mayor temperatura en su superficie de todo el Sistema Solar. Por otro lado, Marte es el planeta más frío de sus vecinos rocosos. Pudo ser cálido en el pasado, con ríos en su superficie, pero hoy es un planeta árido y baldío, similar al desierto de Atacama en el norte de Chile.

Observa, crea y comparte

Los cráteres de la superficie oscura de Mercurio, son huellas de un constante bombardeo de material cósmico. ¡Búscalos!
En Marte se encuentra el Monte Olimpo, el volcán más grande del sistema solar. Tiene aproximadamente 27 kilómetros de altura y un cráter de 81 kilómetros de ancho. ¿Lo viste?
Habla con tu familia, amigos y amigas sobre otras observaciones que te llamen la atención.

<model-viewer src="/packages/modelviewer.dev/assets/ShopifyModels/Mercurio.glb" poster="/packages/modelviewer.dev/assets/ShopifyModels/Mercurio.png" shadow-intensity="1" ar ="fixed" camera-controls alt="A 3D model carousel">
  
  <button slot="ar-button" id="ar-button">
    Ver en Realidad Aumentada
  </button>

  <div id="ar-prompt">
    <img src="/packages/modelviewer.dev/assets/hand.png">
  </div>

  <div class="slider">
    <div class="slides">
      <button class="slide selected" onclick="switchSrc(this, 'Mercurio')" style="background-image: url('/packages/modelviewer.dev/assets/ShopifyModels/Mercurio.png');">
      </button><button class="slide" onclick="switchSrc(this, 'Marte')" style="background-image: url('/packages/modelviewer.dev/assets/ShopifyModels/Marte.png');">

      </button><button class="slide" onclick="switchSrc(this, 'Venus')" style="background-image: url('/packages/modelviewer.dev/assets/ShopifyModels/Venus.png');">
      
      </button><button class="slide" onclick="switchSrc(this, 'Tierra')" style="background-image: url('/packages/modelviewer.dev/assets/ShopifyModels/Tierra.png');">
      
      </button><button class="slide" onclick="switchSrc(this, 'Rocosos')" style="background-image: url('/packages/modelviewer.dev/assets/ShopifyModels/Rocosos.png');">    
    </button></div>
  </div>
</model-viewer>

<script type="module">
  const modelViewer = document.querySelector("model-viewer");

  window.switchSrc = (element, name) => {
    const base = "/packages/modelviewer.dev/assets/ShopifyModels/" + name;
    modelViewer.src = base + '.glb';
    modelViewer.poster = base + '.png';
    const slides = document.querySelectorAll(".slide");
    slides.forEach((element) => {element.classList.remove("selected");});
    element.classList.add("selected");
  };

  document.querySelector(".slider").addEventListener('beforexrselect', (ev) => {
    // Keep slider interactions from affecting the XR scene.
    ev.preventDefault();
  });
</script>

<style>
  /* This keeps child nodes hidden while the element loads */
  :not(:defined) > * {
    display: none;
  }

  model-viewer {
    background-color: #eee;
    overflow-x: hidden;
    --poster-color: #eee;
  }

  #ar-button {
    background-image: url(/packages/modelviewer.dev/assets/ic_view_in_ar_new_googblue_48dp.png);
    background-repeat: no-repeat;
    background-size: 20px 20px;
    background-position: 12px 50%;
    background-color: #fff;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    white-space: nowrap;
    bottom: 132px;
    padding: 0px 16px 0px 40px;
    font-family: Roboto Regular, Helvetica Neue, sans-serif;
    font-size: 14px;
    color:#4285f4;
    height: 36px;
    line-height: 36px;
    border-radius: 18px;
    border: 1px solid #DADCE0;
  }

  #ar-button:active {
    background-color: #E8EAED;
  }

  #ar-button:focus {
    outline: none;
  }

  #ar-button:focus-visible {
    outline: 1px solid #4285f4;
  }

  @keyframes circle {
    from { transform: translateX(-50%) rotate(0deg) translateX(50px) rotate(0deg); }
    to   { transform: translateX(-50%) rotate(360deg) translateX(50px) rotate(-360deg); }
  }

  @keyframes elongate {
    from { transform: translateX(100px); }
    to   { transform: translateX(-100px); }
  }

  model-viewer > #ar-prompt {
    position: absolute;
    left: 50%;
    bottom: 175px;
    animation: elongate 2s infinite ease-in-out alternate;
    display: none;
  }

  model-viewer[ar-status="session-started"] > #ar-prompt {
    display: block;
  }

  model-viewer > #ar-prompt > img {
    animation: circle 4s linear infinite;
  }

  .slider {
    width: 100%;
    text-align: center;
    overflow: hidden;
    position: absolute;
    bottom: 16px;
  }

  .slides {
    display: flex;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scroll-behavior: smooth;
    -webkit-overflow-scrolling: touch;
  }

  .slide {
    scroll-snap-align: start;
    flex-shrink: 0;
    width: 100px;
    height: 100px;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    background-color: #fff;
    margin-right: 10px;
    border-radius: 10px;
    border: none;
    display: flex;
  }

  .slide.selected {
    border: 2px solid #4285f4;
  }

  .slide:focus {
    outline: none;
  }

  .slide:focus-visible {
    outline: 1px solid #4285f4;
  }

</style>

¿Sabías que?

A diferenia de nuestro planeta Tierra, Mercurio y Venus no tienen satélites naturales (Lunas).
En el planeta Venus gira sobre su eje muy lentamente y en sentido contrario al de los otros planetas. Esto provoca que en su horizonte el Sol "salga" por el oeste y se "ponga" por el este, al revés de lo que ocurre en La Tierra.
El planeta Marte tiene dos satélites (Lunas) llamadas Fobos y Deimos. Son pequeños, y se trasladan en distintas órbitas, pero cerca del planeta.