Question

我想使用输入字段中的分数来更改饼图中的数据分布。

例如，scoreThreshold 0.5的分布“71％高/ 28％低”将使用scoreThreshold 0.7更改为“42％High / 57％Low”。

我做了这个例子here，但结果并不令人满意：在输入字段中输入0.5并单击“check！”时，饼图分布不会改变。

这决定了分发：

//##  pie chart
var coreCount = ndx.dimension(function (d) {
    var maxNumber=80;
    if (typeof scoreThreshold!='number') {scoreThreshold=0.5}
    //console.log(scoreThreshold)
    if (d.scores >maxNumber*scoreThreshold)
        {return 'High';}
    else {return 'Low';}
    });

我想更新coreCount函数，使用输入分数阈值重新分配分配。但它不起作用：

$('#scoreThresholdBt').click(function () { 
            scoreThreshold=document.getElementById('scoreThreshold').value
            scoreThreshold=parseFloat(scoreThreshold);
            console.log(scoreThreshold,typeof scoreThreshold);
            function redo_coreCount () {
                var coreCount = ndx.dimension(function (d) {
                    var maxNumber=80;
                    console.log(scoreThreshold);
                    if (d.count >maxNumber*scoreThreshold)
                        {return 'High';}
                    else {return 'Low';}
                    });
            }; redo_coreCount();
            coreCount.group();/**/
            dc.renderAll();
            dc.redrawAll();
        });

我怎样才能实现这个功能？我真的很感激任何帮助。

Answer 1

您实际上是将新维度放在一个临时变量中，该变量会立即被丢弃。 click函数中的coreCount与全局级别具有相同名称的变量无关。

同样，coreCount.group()不是一个动作;它构建了一个群组对象，如果你不使用它也会丢失。

您需要将新维度和组分配给图表，因为它不会跟踪全局或本地coreCount的值。

因此，让我们根据从输入中读取得分阈值来更改函数以返回新维度：

function coreCount_from_threshold() {
  var scoreThreshold=document.getElementById('scoreThreshold').value;
  scoreThreshold=parseFloat(scoreThreshold);
  console.log(scoreThreshold,typeof scoreThreshold);
  if (isNaN(scoreThreshold)) {scoreThreshold=0.5}
  return ndx.dimension(function (d) {
    var maxNumber=80;
    if (d.scores >maxNumber*scoreThreshold)
        {return 'High';}
    else {return 'Low';}
    });
}

请注意，我们需要在此使用isNaN，因为typeof NaN === 'number'

我们可以在初始化时使用它：

var coreCount = coreCount_from_threshold();

并点击：

$('#scoreThresholdBt').click(function () { 
    coreCount.dispose();
    coreCount = coreCount_from_threshold();
    coreCountGroup = coreCount.group();
    coreYesNoPieChart
      .dimension(coreCount)
      .group(coreCountGroup);
    dc.redrawAll();
});

请注意，我们正在分配相同的全局变量coreCount和coreCountGroup（因为我们不在此处使用var）。我们首先处理旧维度，否则它将继续过滤并占用资源。然后我们将新维度和组分配给图表（因为否则它不会知道它们）。

我们只需要在这里进行重绘（不是渲染），因为dc.js图表可以在获取新数据时更新。

这是一个有效的fork of your fiddle。

dc.js：如何使用不同的输入阈值更改饼图中的数据分布？

1 个答案: