2017-12-12 1 views
1

dc.jsを使用して棒グラフを作成しようとしています。ユーザーは、フィルタをクリックしてドラッグすることで、データの一部を選択することができます。しかし、難易度はこの問題が発生したとき、私のウェブサイト上で、フィルタが完全に黒で、選択したデータが隠されていることである。 Black filterdc.jsグラフでフィルターを透明にする方法

home page of dc.jsからthis exampleのように、フィルタは、部分的に透明でなければならないされて起こるべき選択されたデータが依然として見えるようにする。

私のページを生成するために使用しているサンプルコードを次に示します。私は、Crossfilterバージョン1.3.14、d3.jsバージョン3.5.17、およびdc.js 2.1.9を使用しています。

<head> 
    <meta charset="UTF-8"> 
    <link rel="stylesheet" type="text/css" href="static/dc.css.min"/> 
</head> 
<body> 
    <div id="graph"></div> 
    <script type="text/javascript" src="static/d3.js"></script> 
    <script type="text/javascript" src="static/crossfilter.js"></script> 
    <script type="text/javascript" src="static/dc.min.js"></script> 
    <script type="text/javascript"> 
    var data = "data/page.csv"; 
    d3.csv(data, function(error, records) { 
     var ndx = crossfilter(records); 
     var keyDimension = ndx.dimension(function(d) {return d.key;}); 
     var valueGroup = keyDimension.group().reduceCount(); 

     var graph = dc.barChart("#graph"); 
     graph.width(500) 
      .height(300) 
      .x(d3.scale.linear().domain([0,15])) 
      .xUnits(function(){return 50;}) 
      .dimension(keyDimension) 
      .group(valueGroup); 
     graph.render(); 
    }); 
    </script> 
</body> 

答えて

1

私は彼らの完全な同等物(dc.css、dc.js、dc.jsに縮小さ直流ファイル(dc.min.css、dc.min.js、dc.min.js.map)を置き換えます.map)がGithubからダウンロードされ、通常のようにフィルタが表示されます。

+0

はい、CSSが間違っているか、まったくCSSがないようです。フォローアップありがとう! – Gordon

+0

ああ、今私はそれを見る - 自分のHTMLにdc.min.cssの代わりにdc.css.minを書いていた。 – correcthrsbatterystpl

関連する問題