d3 avec le modèle de jade

Question

Je suis nouveau à la fois d3 et jade. J'ai modèle de jade comme ci-dessous,

div(id='viz') 
script(type="text/javascript") 
    d3.select("#viz") 
    .append("svg") 
     .attr('width', 600) 
     .attr('height', 300) 
     .append('circle') 
     .attr('cx', 300) 
     .attr('cy', 150) 
     .attr('r', 30) 
     .attr('fill', '#26963c') 

Je suis en train d'ajouter petit cercle dans div viz. Lorsque la page est chargée i ne vois pas tout cercle, code html par l'inspecteur est comme ci-dessous,

<div id="viz"></div> 
<script type="text/javascript"><d3 body class="select"><div svg class="append"><div width 600 class="attr"></div><div height 300 class="attr"></div><div circle class="append"><div cx 300 class="attr"></div><div cy 150 class="attr"></div><div r 30 class="attr"></div><div fill #26963c class="attr"></div></div></div></d3></script> 

Quelqu'un peut-il mettre un peu de lumière sur ce qui se passe mal ici.

Answer 1

Vous avez besoin d'un point . après script(type="text/javascript")

div(id='viz') 
script(type="text/javascript"). 
    d3.select("#viz") 
    .append("svg") 
     .attr('width', 600) 
     .attr('height', 300) 
     .append('circle') 
     .attr('cx', 300) 
     .attr('cy', 150) 
     .attr('r', 30) 
     .attr('fill', '#26963c') 

source