v7: 折线连线+搜索显示完整路径
This commit is contained in:
+57
-18
@@ -138,7 +138,8 @@ var baseOption = {
|
||||
label:{ position:'bottom', fontSize:11, color:'#333', formatter:'{b}', distance:4 },
|
||||
leaves:{ label:{ position:'bottom', fontSize:11, color:'#333' } },
|
||||
emphasis:{ focus:'descendant' },
|
||||
lineStyle:{ color:'#999', width:1.2, curveness:0.15 },
|
||||
edgeShape:'polyline',
|
||||
lineStyle:{ color:'#999', width:1.2, curveness:0 },
|
||||
itemStyle:{ color:function(p){ return (p.data.children&&p.data.children.length)?'#1e6fd9':'#aab'; } }
|
||||
}]
|
||||
};
|
||||
@@ -198,31 +199,69 @@ function expandPath(path) {
|
||||
var names = path.slice(0, -1).map(function(n){ return n.name; });
|
||||
if (names.length) chart.dispatchAction({ type:'treeExpandAndCollapse', seriesIndex:0, name: names });
|
||||
}
|
||||
// 剪枝:只保留命中公司的完整路径(祖先链 + 该公司子树)
|
||||
function prunePath(targetName) {
|
||||
function build(n) {
|
||||
var node = { name: n.name };
|
||||
if (n.org2) node.org2 = n.org2;
|
||||
if (n.name === targetName) {
|
||||
// 命中:保留其直属子公司(供展开查看)
|
||||
if (n.children && n.children.length) {
|
||||
node.children = n.children.map(function(c){ return { name: c.name, org2: c.org2 || '' }; });
|
||||
}
|
||||
node.matched = true;
|
||||
return node;
|
||||
}
|
||||
if (n.children && n.children.length) {
|
||||
for (var i=0;i<n.children.length;i++) {
|
||||
var sub = build(n.children[i]);
|
||||
if (sub) {
|
||||
node.children = [sub];
|
||||
return node;
|
||||
}
|
||||
}
|
||||
}
|
||||
return null;
|
||||
}
|
||||
var pruned = build(rootNode);
|
||||
return pruned ? [pruned] : null;
|
||||
}
|
||||
|
||||
searchInput.addEventListener('input', function() {
|
||||
var q = searchInput.value.trim().toLowerCase();
|
||||
clearBtn.style.display = q ? 'block' : 'none';
|
||||
if (!q) { chart.setOption({ series:[{ data: [rootNode], label:{formatter:'{b}', rich:{}} }] }); return; }
|
||||
if (!q) {
|
||||
chart.setOption({ series:[{ data: [rootNode], label:{formatter:'{b}', rich:{}} }] });
|
||||
return;
|
||||
}
|
||||
var matches = allNames.filter(function(n){ return n.toLowerCase().indexOf(q) !== -1; });
|
||||
if (matches.length === 0) { showTip('未找到包含「'+q+'」的公司'); return; }
|
||||
if (matches.length > 50) { showTip('找到 '+matches.length+' 家,仅展示前 50,请更精确'); matches = matches.slice(0,50); }
|
||||
var first = matches[0];
|
||||
var path = findPath(first, rootNode, []);
|
||||
if (path) expandPath(path);
|
||||
showTip('找到 ' + matches.length + ' 家:' + matches.slice(0,5).join('、') + (matches.length>5?'…':''));
|
||||
chart.setOption({
|
||||
series: [{
|
||||
data: [rootNode],
|
||||
label: {
|
||||
formatter: function(p){
|
||||
if (p.data && p.data.name.toLowerCase().indexOf(q) !== -1) return '{matched|'+p.data.name+'}';
|
||||
return p.data ? p.data.name : '';
|
||||
},
|
||||
rich: { matched:{ color:'#e6a700', fontWeight:'bold' } }
|
||||
}
|
||||
}]
|
||||
});
|
||||
var pruned = prunePath(first);
|
||||
if (pruned) {
|
||||
chart.setOption({
|
||||
series: [{
|
||||
data: pruned,
|
||||
initialTreeDepth: 99,
|
||||
label: {
|
||||
formatter: function(p){
|
||||
if (p.data && p.data.name.toLowerCase().indexOf(q) !== -1) return '{matched|'+p.data.name+'}';
|
||||
return p.data ? p.data.name : '';
|
||||
},
|
||||
rich: { matched:{ color:'#e6a700', fontWeight:'bold', fontSize:13 } }
|
||||
}
|
||||
}]
|
||||
});
|
||||
showTip('定位到「'+first+'」 共 ' + matches.length + ' 家匹配,显示完整路径');
|
||||
} else {
|
||||
showTip('找到 ' + matches.length + ' 家:' + matches.slice(0,5).join('、') + (matches.length>5?'…':''));
|
||||
}
|
||||
});
|
||||
clearBtn.onclick = function(){ searchInput.value=''; clearBtn.style.display='none'; chart.setOption({ series:[{ data: [rootNode], label:{formatter:'{b}', rich:{}} }] }); };
|
||||
clearBtn.onclick = function(){
|
||||
searchInput.value=''; clearBtn.style.display='none';
|
||||
chart.setOption({ series:[{ data: [rootNode], initialTreeDepth:1, label:{formatter:'{b}', rich:{}} }] });
|
||||
};
|
||||
|
||||
chart.on('click', function(p){
|
||||
if (p.data && p.data.children && p.data.children.length) {
|
||||
|
||||
Reference in New Issue
Block a user