标签: dc.js

我试图通过总和(查询时间)计算平均查询时间,然后将它们除以计数.我怎么能得到计数？

var querytimeByMonthGroup = moveMonths.group().reduceSum(function (d) {
    return d.querytime;
});

var querytimeByMonthGroup = moveMonths.group().reduceSum(function (d) {
    return d.querytime / d.count; ???
});

我正在使用React.js构建一个应用程序,其中包含相当多的svg图表.我正在使用d3函数来帮助创建图表,比如缩放,然后使用React生成svg元素.以下是关于该方法的精彩文章:http://10consulting.com/2014/02/19/d3-plus-reactjs-for-charting/

我走这条路的部分原因在于性能 - 该应用的第一个版本太慢了.它有很多元素和很多用户交互性,都是客户端的.我正在尝试基本上在React中重新创建dc.js库.

这是一种非常有趣的方法和直观(比单独使用d3的IMO更多).建筑轴虽然乏味,但d3做得很好.我希望d3能够输出一串表示轴(也可能是其他元素)的svg元素,并将它提供给React以包含在DOM中.

我确实看到了这个问题(如何使d3.js生成svg而不绘制它？)答案是将它附加到DOM中并删除它,或者创建一个DOM片段.这些方法违反了React方法,可能会否定React的性能优势.我也看到了jsdom和phantomjs解决方案,这在我的案例中是行不通的.

d3可以生成svg而无需将其附加到DOM吗？

我正在寻找修改dc.js的开箱即用工具提示,似乎有一个使用d3.js工具提示的解决方案,如此问题.但是,我对如何实现这一点感到困惑,以便为dc.js仪表板中的所有链接图修改工具提示.GitHub repo中的示例很适合单个图形,但我目前正在处理六个链接图形,需要修改所有图形上的工具提示.任何帮助,将不胜感激.

我正在构建一个仪表板来显示一些数据.我有几个图表和一个列出所有数据的表格.我正在尝试添加搜索功能来过滤图表.我有很多公司和一些关于每个公司的数据.因此,如果我搜索"Appl",只有以"Appl"开头的公司将列在数据表中,图表将反映这一点.

我对当前实现的唯一问题是当我更改此过滤器或清除它时.数据似乎很好,但图表渲染不正确.清除后它们不会返回原始位置,或者以某种方式添加额外数据.任何提示将不胜感激.

 $("#table-search").on('input',function(){
   text_filter(companyDimension,this.value);//companyDimension is the dimension for the data table

function text_filter(dim,q){
 dashTable.filterAll();
 var re = new RegExp(q,"i")
 if (q!='')
 {
    dim.filter(function(d){
        if (d.search(re)==0)
            return d;
    });
}
dc.redrawAll();
graphCustomizations();  }});

dc.js代码

var ndx = crossfilter(resource_data);
//Dimensions 
companyDimension = ndx.dimension(function(d){
    return d["Company Name"]
});
dashTable.width(800).height(800)
    .dimension(companyDimension)
    .group(function(d){
        return "List of all Selected Companies";
    })
    .size(1774)
    .columns([
            function(d){return d["Company Name"]; },
            function(d){return d["Revenue Source"];},
            function(d){return d["Commodity"];},
            function(d){return "$"+parseFloat(d["Revenue"]).formatMoney(0,'.',',');}
        ])
    .sortBy(function(d){return d["Company Name"]})
    .order(d3.ascending);

就是这样,图表只是在同一个crossfilter对象上过滤不同的维度.

我试着做几件事情给text_filter等功能,dim.filterAll(),dim.filter(null),dc.renderAll() …

在DC.js github上,Lon Riesberg的股票市场选择策略被列为使用dc.js库的示例.

Lon能够创建堆叠的行图并将其显示为单行.

我希望能够完成同样的事情.我只能弄清楚如何创建一个行图,如我的codepen和下面所示.

HTML

<script src="https://rawgit.com/mbostock/d3/master/d3.js" charset="utf-8"></script>
<script type="text/javascript" src="https://rawgithub.com/NickQiZhu/dc.js/master/web/js/crossfilter.js"></script>
<script type="text/javascript" src="https://rawgit.com/dc-js/dc.js/master/dc.js" ></script>


<div id="rowChart"></div>

使用Javascript

items = [
            {Id: "01", Name: "Red", Price: "1.00", Quantity: "1",TimeStamp:111},
            {Id: "02", Name: "White", Price: "10.00", Quantity: "1",TimeStamp:222},
            {Id: "04", Name: "Blue", Price: "9.50", Quantity: "10",TimeStamp:434},
            {Id: "03", Name: "Red", Price: "9.00", Quantity: "2",TimeStamp:545},
            {Id: "06", Name: "Red", Price: "100.00", Quantity: "2",TimeStamp:676},
            {Id: "05",Name: "Blue", Price: "1.20", Quantity: "2",TimeStamp:777}
        ];


var ndx = crossfilter(items); …

从支付示例crossfilter(https://github.com/square/crossfilter/wiki/API-Reference)开始,我们如何为每种支付类型(标签,签证,现金)创建一个带有一个折线图的复合图表？

我正在使用DC.js(在D3之上的lib)并且有一个单个系列条形图的一个很好的例子:

 var xf = crossfilter(data);
 var dim = xf.dimension(function (d) { return d["EmployeeName"]; });
 var group = dim.group().reduceSum(function (d) { return d["AverageSale"]; });

 var chart = dc.barChart(elm);
 chart.barPadding(0.1)
 chart.outerPadding(0.05)
 chart.brushOn(false)
 chart.x(d3.scale.ordinal());
 chart.xUnits(dc.units.ordinal);
 chart.elasticY(true);

 chart.dimension(dim).group(group);
 chart.render();

但我想知道是否有可能使用这个库创建一个多维条形图.例如:按商店名称分组,然后按员工分组,然后y轴显示平均销售价值(已由我的后端计算).

数据看起来像:

 [{
    "EmployeeName": "Heather",
    "StoreName" : "Plaza",
    "AverageSaleValue": 200
 }{
    "EmployeeName": "Mellisa",
    "StoreName" : "Plaza",
    "AverageSaleValue": 240
 }, {
    "EmployeeName": "Sarah",
    "StoreName" : "Oak Park",
    "AverageSaleValue": 300
 } ... ]

嗨,我是JS和Crossfilter的新手.我正在使用crossfilter和我的数据(.csv文件),并在列中检索不同的值

var scoreDim = ppr.dimension(function (d) {
    return d.score;
});

我也可以使用每个值得到计数

var scoreDimGroup = scoreDim.group().reduceCount();

我可以dc.js用来绘制图表,结果看起来正确.但是我如何检索值scoreDim,scoreDimGroup以便我可以在代码中使用它进行进一步处理.当我使用调试器查看对象时,我可以看到一堆函数,但无法看到对象中包含的实际值.

我正在使用dc.js行图.与本页示例中的星期图完全相同的东西

有人可以建议我如何将标签颜色从白色更改为黑色.

我正在尝试创建2个图表,一个酒吧和一个系列,酒吧将显示每个商店的总收入,系列将显示每年的多行收入.

这是jsfiddle https://jsfiddle.net/xc4bwgLj/

因此,当我点击条形图商店1时,我想在系列图表中看到这个商店在2017年和2016年的新收入.目前,系列图表显示了每个商店的总收入,如条形图.

我知道如何更改系列图表以显示2016年和2017年每家商店的收益？

JsFiddle代码:

// generate data
var data = [];
var n = 1000.;

for (var i = 0; i < n; i++) {
console.log(Math.floor(Math.random() * (1 - 0 + 1)) + 0);
  data.push({
    id: (Math.floor(Math.random() * (1 - 0 + 1)) + 0),
    "i": i,
    x: Math.random(),
    "store_name": "Store"+(Math.floor(Math.random() * (1 - 0 + 1)) + 0),
    "2017_earnings": Math.random()*110,
    "2016_earnings": Math.random()*80
  });
}

// do some crossfilter stuff
var cf = crossfilter(data),
  series = cf.dimension(function(d) { …