kullanma d3.js

Question

Ben d3.js

Birinin leaflet.js here ile yaptım nerede bir örneği bulundu ve çalıştı ile bütünleştirerek Apache Zeppelin daha görselleştirme seçenekleri eklemek çalışıyorum

benzer bir şey yapmak - ne yazık ki angularJS (ön uç dilleri yorumlamak için Zeppelin ne kullanır) ile aşina değilim. Ayrıca veri akışı yapmıyorum. Aşağıda benim kod hatasız çalışmasını bitirdiğinde, tutuyor, bütün boş div olduğunu Zeppelin, Ancak

%angular 
<div> 
    <svg class="chart"></svg> 
</div> 
<script> 
function useD3() { 
    var data = [4, 8, 15, 16, 23, 42]; 

    var width = 420, 
     barHeight = 20; 

    var x = d3.scale.linear() 
     .domain([0, d3.max(data)]) 
     .range([0, width]); 

    var chart = d3.select(".chart") 
     .attr("width", width) 
     .attr("height", barHeight * data.length); 

    var bar = chart.selectAll("g") 
     .data(data) 
     .enter().append("g") 
     .attr("transform", function(d, i) { return "translate(0," + i * barHeight + ")"; }); 

    bar.append("rect") 
     .attr("width", x) 
     .attr("height", barHeight - 1); 
} 

if (window.d3) { 
    useD3(); 
} else { 
    var sc = document.createElement('script'); 
    sc.type = 'text/javascript'; 
    sc.src = 'https://cdnjs.cloudflare.com/ajax/libs/d3/3.5.16/d3.min.js'; 
    sc.onload = useD3; 
    sc.onerror = function(err) { alert(err); } 
    document.getElementsByTagName('head')[0].appendChild(sc); 
} 
</script> 

d3.js

sadece basit bir öğretici örneğini kullanarak vardır. Herhangi bir yardım takdir edilir.

Answer 1

Zeppelin sürüm 0.7.0 olduğunu. Örnek bu sürümde çalışır. html görüntü sistemini de kullanabilirsiniz. Sonuçlar resimlerde.