d3を使用してJavascriptボタンのスタイルを設定するにはどうすればよいですか？

Question

JavaScript用のd3.jsライブラリを使用して、アプリケーション用のGUIの一部を作成しています。 私はボタンを作った、それはボタンとして機能しますが、私はトグルボタンにしたいです。具体的には、クリックしたときにスタイルを変更したい。

さまざまな理由から、スタイルシートやヘッドのCSSに触れることはできません.JavaScriptのみを使用できます。

これは、（ドキュメントのid =「メニュー」がdiv要素がある）私は、ボタンを作成しています方法です：

var menuDiv = d3.select("#menu"); 
var menuButton = menuDiv.append("button") 
    .text("Button") 
    .attr("id", "buttonCentre") 
    .classed("Button", true) 
    .on('click', function(){ 
     //Do stuff 
    }); 

どのようにすることができ、再スタイルボタン？私はd3.select("#buttonCentre").style("background", "#ccc");のようなものをon_click関数に入れてみましたが、d3はスタイリング用の標準CSS名を認識せず、別の名前を使用していました。リストや等価マッピングを見つけることができません。

Answer 1

backgroundの代わりにbackground-colorを使用してください。それはのbackgroundColorここ

var menuDiv = d3.select("body"); 
var menuButton = menuDiv.append("button") 
    .text("Button") 
    .attr("id", "buttonCentre") 
    .classed("button", true) 
    .on('click', function(){ 
     //here this is the button 
     d3.select(this).style("background-color", "#ccc") 
    }); 

が働いcode