d3.js를 사용하여 글꼴 크기를 변경할 수 없습니다.

d3.js를 처음 사용하면서 배열의 단락에 대한 글꼴 크기를 계산하는 간단한 코드를 작성하려고합니다. 이것은 내 코드입니다.d3.js를 사용하여 글꼴 크기를 변경할 수 없습니다.

<html> 
<head> 
<script src="http://d3js.org/d3.v3.min.js" charset="utf-8"></script> 
<script> 
    d3.select('body') 
     .selectAll('p') 
     .data([5,10]) 
     .style("font-size", function(d) { return d + "px"; }); 
</script> 
</head> 
<body> 
<p>para 1</p> 
<p>para 2</p> 
</body> 
</html>

매우 간단한 것처럼 보이지만 작동하지 않습니다. 내가 어디로 잘못 가고 있는지에 대한 도움은 정말 도움이 될 것입니다.

출처

2014-07-21 arjun010

이 잘 wors, 코드에 추가'$ (문서) .ready (함수() {/ * 여기에 코드 * /}); MindaugasVečkys @' –

감사합니다. . 나는 내가 잘못 가고있는 것을 이해했다 :) – arjun010

스크립트가 실행될 때까지 <P> 요소가 생성되지 않았기 때문에 그 일이 발생합니다. 페이지 끝에 스크립트를 포함하면 정상적으로 작동합니다.

JSFiddle Link

코드는 다음과 같이 될 것입니다. 그것이 DOM이 생성 된 후에 만 실행됩니다 있도록

<html> 
<head> 
<script src="http://d3js.org/d3.v3.min.js" charset="utf-8"></script> 
</head> 
<body> 
<p>para 1</p> 
<p>para 2</p> 
</body> 

<script> 
    d3.select('body') 
     .selectAll('p') 
     .data([5,10]) 
     .style("font-size", function(d) { return d + "px"; }); 
</script> 
</html>

방법 2

또한 onLoad 이벤트에 스크립트를 작성할 수 있습니다.

순수 자바 스크립트에서는이

<script> 
window.onload=function(){ 

d3.select('body') 
     .selectAll('p') 
     .data([5,10]) 
     .style("font-size", function(d) { return d + "px"; }); 

} 
</script>

같이 수행 할 수 있습니다 (원하는 경우) 다른 방법으로 당신은 .Its 샘플 코드는 내가 생성하는 것을 선호이

<script> 
     $(document).on('laod',funciton(){ 
     d3.select('body') 
       .selectAll('p') 
       .data([5,10]) 
       .style("font-size", function(d) { return d + "px"; }); 
    });</script>

출처

2014-07-21 10:24:31 Shiva

Thanks Shiva. .sorry 나는 그런 기본적인 점에 밖으로 놓쳤다 :) – arjun010

-1

같은 것입니다 jQuery를 사용할 수 있습니다 this tutorial에서 설명한대로 HTML/SVG 요소를 데이터에서 직접 가져옵니다.

<html> 
    <head> 
    <script src="http://d3js.org/d3.v3.min.js" charset="utf-8"></script> 
    <script> 
     d3.select('body') 
      .data([5,10]) 
      .enter().append("p") 
      .style("font-size", function(d) { return d + "px"; }) 
      .text("para"); 
    </script> 
    </head> 
    <body> 
    </body> 
</html>

출처

2014-07-21 10:35:23 mb21

downvote를위한 어떤 이유 ..? – mb21

d3.js를 사용하여 글꼴 크기를 변경할 수 없습니다.

답변

관련 문제