gpt4 book ai didi

javascript - filterAll() 和 dc.redrawAll() 不适用于 dc.pieChart

转载 作者:行者123 更新时间:2023-11-30 15:27:43 27 4
gpt4 key购买 nike

我仍在尝试使用 dc 和 crossfilter 将图表链接在一起,这里我将表格和饼图链接在一起。链接在图表和表格之间起作用,因此当我单击饼图时,表格会相应更新。

然而,当我点击超链接时,这一行似乎没有任何作用。饼图仍然显示相同的突出显示的楔形,因此过滤器实际上并未被清除。使用dc.js 2.0.1版本,crossfilter 1.3.14版本,d3.js 3.5.17版本。

<a class="reset" style="display:none" href="javascript:pieChart.filterAll(); dc.redrawAll();">reset</a>

下面是剩余的代码:

<div class="row">
<div class="column-media">
<h2>Media</h2>
<table id="media-table"></table>
</div>
<div class="column-book" id="book-chart">
<h2>Books</h2>
<a class="reset" style="display:none" href="javascript:pieChart.filterAll(); dc.redrawAll();">reset</a>
</div>
</div>


<script type="text/javascript" src="lib/d3.js"></script>
<script type="text/javascript" src="lib/crossfilter.js"></script>
<script type="text/javascript" src="lib/dc.js"></script>

<script type="text/javascript">

d3.tsv("DH_Doigv2.tsv", function(error, data) {
data.forEach(function (d) {

d.id = +d.Item;
d.Item = d.id;

})


var facts = crossfilter(data);
//table
var itemDimension = facts.dimension(function(d) { return d.Item; });

//book chart
var bookDimension = facts.dimension(function(d) { return d.Title; })
var bookGroup = bookDimension.group();

var dataTable = dc.dataTable("#media-table")
.width(425)
.height(800)
.dimension(itemDimension)
//.showGroups(false)
.group(function (d) { return d; })
.columns([
function(d) { return '<a target="_blank" href="https://arc.lib.montana.edu/ivan-doig/item.php?id=' + d.Item+ '"><img src="https://arc.lib.montana.edu/ivan-doig/' + d.Thumb + '" /></a><div class="byline">' + d.Title + '</div><div class="quote">' + d.Quote + '</div><div class="sound">' + '<audio controls title="Audio courtesy of the Acoustic Atlas at MSU Library:" ' + d.Sound + ' "><source src=" '+ "http://acousticatlas.org/objects/aa0002377.mp3" + '" type="audio/mpeg">Your browser does not support the audio element.</audio>' + '</div>'; },
]);


var pieChart = dc.pieChart("#book-chart")
.height(550)
.width(500)
.dimension(bookDimension)
.group(bookGroup);

dc.renderAll();
})

最佳答案

pieChart 是闭包的局部对象,不是全局对象。代替 var pieChart = ...,使用 window.pieChart = ... 将图表分配给全局窗口对象。

这是一本基本的 Javascript 书籍中涵盖的内容。我建议选择一个。开始学习 dc.js 和 Crossfilter 等 Javascript 库时,首先要了解的是语言本身。

关于javascript - filterAll() 和 dc.redrawAll() 不适用于 dc.pieChart,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/42729366/

27 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com