2016-10-24 4 views
0

上で、私はD3プロジェクトに次のコードを持っていない:一見素子全体

function addSquare() { 

    //Create SVG element 
    var SQsvg = d3.select("#square") 
    .append("svg") 
    .attr({ 
     "width": 70, 
     "height": 20, 
     id: "squaresArea" 
    }) 
    .on("click", resetRefresh); 


    SQsvg.append("text") 
    .text("Refresh") 
    .attr({ 
     x: 15, //margin.left, 
     y: 15, 
     "font-family": "sans-serif", 
     "font-size": "14px", 
     "text-decoration": "underline", 
     fill: "blue" 
    }) 
    .on("click", resetRefresh); 

    function resetRefresh() { 
    console.log("hello") 
     //update bar chart when user selects a square 
    dsPieChart(initialMeasure, pieDataCSV); 
    TOPbarChartUpdate("N", initialMeasure, "lightgrey",false); 
    } 

} 

私はテキストに私のカーソルを移動するとリフレッシュの対話は、単語全体にまたがるようには見えません - なぜこれは?すべてのテキストがイベントをトリガーするように上記をどのように修正するのですか?

プロジェクト全体の実際の例はここにある:http://plnkr.co/edit/w9lBwZhoHqQbmNUjihQv?p=preview

答えて

1

私は円グラフがであるコンテナにその原因は、[更新]ボタンの岩下だと思います。私は、身体への更新ボタンを追加し、問題を解決するように見えたしている:

d3.select('body').append('svg').append("text") 
    .text("Refresh") 
    .attr({ 
     x: 15, //margin.left, 
     y: 15, 
     "font-family": "sans-serif", 
     "font-size": "14px", 
     "text-decoration": "underline", 
     fill: "blue" 
    }) 
    .on("click", resetRefresh); 

http://plnkr.co/edit/rc78OaAZbOVPjPznGKok?p=preview

+0

これは単に問題が何であったか動作するようにしました。私は、円グラフとリフレッシュボタンをSVGに追加する順序を変更します。 – thatOneGuy

+0

ok - 現在、リフレッシュボタンは別のdivにあります - おそらく、パイに使用されているdivの右上隅に移動する必要がありますか? – whytheq

+0

はSVGにするかどうかによって異なります。私は単純なHTMLボタンを使用することをお勧めします。それは最も簡単な方法です。 – thatOneGuy

関連する問題