Javascript 通过鼠标悬停突出显示具有重复名称的圆
我有一个搜索框,当所有的圆圈都有相同的名字时,它会高亮显示,并淡出不匹配的圆圈。一切正常Javascript 通过鼠标悬停突出显示具有重复名称的圆,javascript,d3.js,Javascript,D3.js,我有一个搜索框,当所有的圆圈都有相同的名字时,它会高亮显示,并淡出不匹配的圆圈。一切正常 <input class="highlight" name="searchbox" id="searchbox" type="text" list="initname-datalist" placeholder="Search Project/Initiative.." onInput="initiativeSearch(this.value)"> <datalist id="initna
<input class="highlight" name="searchbox" id="searchbox" type="text" list="initname-datalist" placeholder="Search Project/Initiative.." onInput="initiativeSearch(this.value)">
<datalist id="initname-datalist"></datalist>
function initiativeSearch(initSelection) {
circles.transition()
.delay(0)
.duration(500)
.style("opacity", function(d) {
return d.data.initiative_name !== initSelection ? 0.5 : 1;
})
.style("stroke", function(d) {
return d.data.initiative_name === initSelection ? "black" : "grey";
});
}
你知道我如何使用
鼠标盖
突出显示具有相同倡议名称的所有圆圈吗?如果不使用数据进行实际测试,很难编写解决方案,但这是可能的:
.on("mouseover", function(d) {
circles.style("opacity", function(e) {
return d.data.initiative_name !== e.data.initiative_name ? 0.5 : 1;
});
//etc...
像这样在鼠标上调用initiativeSearch()
.on("mouseover", function(d) {
initiativeSearch(d.data.initiative_name);
}
谢谢你,杰拉尔多,这很好用。您知道是否可以为具有相同名称的所有项目显示工具提示吗?我可以在单个圆圈上获得工具提示,但不确定我是否一次只能获得一个工具提示。我建议您将此作为一个新问题发布,并提供所有相关详细信息,这一次提供运行代码。这样人们就更容易帮助你了。
.on("mouseover", function(d) {
initiativeSearch(d.data.initiative_name);
}