如何在 dc.js 图表中使过滤器透明

How to make filter transparent in dc.js charts

我正在尝试使用 dc.js 制作条形图。用户可以通过单击并拖动过滤器来 select 部分数据。然而,困难在于,当这种情况发生时,在我的网站上,过滤器完全变黑并且数据 selected 被遮挡:

应该发生的是,过滤器应该是部分透明的,如 this example from the home page of dc.js,这样 selected 数据仍然可以看到。

这是我用来生成页面的示例代码。我正在使用 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>

我用完整的等效文件(dc.css、dc.js、dc.js.map) 从 Github 下载,现在过滤器正常显示。