Utilisation de ViewBox pour redimensionner svg en fonction de la taille de la fenêtre

Je suis d'essayer d'utiliser ViewBox & preserveAspectRatio pour ajuster automatiquement mon d3.svg.l'arc lorsque la taille de la fenêtre a changé ...

var svg = d3.select("#chart").append("svg") 
  .append("g")
  .attr("viewBox", "0 0 700 500")
  .attr("preserveAspectRatio", "xMinYMin meet")
  .attr("transform", "translate(" + r + "," + r +") rotate(180) scale(-1, -1)");

Je suis un peu confus, pourquoi ça ne marche pas à tous - j'ai aussi essayé de mettre la préserver "none" & supprimer toutes les marges que j'ai eu. mais toujours pas de chance - de l'aide ou des conseils seraient appréciés.

Voici un exemple: http://jsfiddle.net/xwZjN/53/

source d'informationauteur Jose

  1. 23

    Vous postulez viewBox et preserveAspectRatio à la g élément, ils doivent être appliqués à la svg élément: 

    var svg = d3.select("#chart").append("svg") 
  .attr("viewBox", "0 0 700 500")
  .attr("preserveAspectRatio", "xMinYMin meet")
     .append("g")
     .attr("transform", "translate(" + r + "," + r +") rotate(180) scale(-1, -1)");
  2. -1

    vous pouvez obtenir la taille de la fenêtre et de définir le ratio d'aspect pour svg. J'ai répondu à une question similaire.
    Ma réponse