es.davy.ai

Preguntas y respuestas de programación confiables

¿Tienes una pregunta?

Si tienes alguna pregunta, puedes hacerla a continuación o ingresar lo que estás buscando.

¿Cómo reiniciar la transformación de zoom después de hacer zoom sin deseleccionar en D3?

Estoy utilizando d3.zoom y definiendo el método “on” y aplicando la transformación manualmente a diferentes elementos. Pero cuando ocurre otro desplazamiento/zoom, me da la transformación desde el estado original hasta el estado actual. Quiero que me dé solo desde el último estado hasta el estado actual.

Por ejemplo, primero hago zoom en la vista, lo que me da una transformación como esta: {x=0, y=0, k=2}. La próxima vez, si desplazo la vista hacia la derecha, el objeto de transformación en el evento es {x=2, y=0, k=2}. Pero quiero que me dé {x=2, y=0, k=1}. Así que necesito de alguna manera restablecer el zoom a d3.zoomIdentity sin cambiar la transformación del elemento. ¿Cómo hago esto?

A continuación se muestra un fragmento de código que explica lo que quiero:

d3.zoom().on("zoom", event => {
  console.log(event.transform); // {x=1, y=5, k=0.5}
  recalculateVertices(event.transform);
  recalculateEdges(event.transform);

  // Ahora quiero restablecer la transformación del zoom a {x=0, y=0, k=1}
  // Algo como esto
  resetZoom(zoom);

  // Por lo tanto, la próxima vez que ocurra un evento de zoom, me dará la
  // transformación solo desde el estado actual hasta ese próximo estado.
  // En lugar de "desde el estado original hasta el estado actual".
})
Tags:  ,

Answer

  1. Avatar for davy.ai

    Puede utilizar d3.zoomIdentity para restablecer la transformación de zoom a la transformación identidad. Luego puede aplicar la transformación manualmente a diferentes elementos.

    function resetZoom(zoom) {
      zoom.transform(d3.zoomIdentity);
    }
    

Comments are closed.