Hi Ovilia,
many thanks for your mail.
I am not a javascript specialist ... (I juste "copy" and "paste" :-])
But suppose that you have the code as is in echarts manual. (see below).
It exist many "orange" entries.
How can I have a search zone like this :
<div id="footer">
<label for="search">search: </label>
<input type="text" id="search" onkeyup="update(this.value)">
</div>
and a function like this :
/** Updates the visualization and count when a new query is entered. */
function update(query) {
if (query != re) {
re = new RegExp(query, "i");
count();
vis.render();
}
and when I write "orange" in search zone
the fonction update search (with RegEx or other solution) the chain "orange"
for all nodes and
show more or less brilliant the nodes that contain "orange" as name.
Best regards
Pier Luigi
option = {
series: {
type: "treemap",
data: [{
name: "Food",
children: [{
value: 3,
name: "Fruit",
children: [{
value: 1,
name: "Apple"
}, {
value: 2,
name: "Orange",
children: [{
name: "Seville Orange",
value: 1
}, {
name: "Blood Orange",
value: 1
}]
}]
}, {
value: 9,
name: "Meat",
children: [{
value: 6,
name: "Beaf",
children: [{
name: "Sirloin",
value: 1
}, {
name: "Rib",
value: 1
}, {
name: "Chuck",
value: 1
}, {
name: "Shank",
value: 1
}]
}, {
value: 2,
name: "Chicken",
children: [{
name: "Wings",
value: 1
}]
}, {
name: "Breast",
value: 1
}]
}],
visibleMin: 0
}, {
value: 6,
name: "Drinks",
children: [{
value: 3,
name: "Wine",
children: [{
name: "USA",
value: 2
}, {
name: "Europe",
children: [{
name: "Germany",
value: 1
}]
}]
}, {
name: "Soft Drink",
children: [{
value: 3,
name: "Juice",
children: [{
name: "Apple Juice",
value: 1
}, {
name: "Orange Juice",
value: 2
}]
}]
}]
}, {
value: 6,
name: "Fashion",
children: [{
name: "Clothing",
children: [{
name: "Shirts",
value: 1
}, {
name: "Jackets",
value: 3,
children: [{
name: "Men",
value: 1
}, {
name: "Woman",
value: 1
}]
}, {
value: 2,
name: "Coats",
children: [{
name: "Men",
value: 1
}, {
name: "Woman",
value: 1
}]
}]
}]
}, {
name: "Computers",
children: [{
name: "Components",
value: 4,
children: [{
name: "Barebones",
value: 1
}, {
value: 2,
name: "External",
children: [{
name: "Hard Drives",
value: 2
}]
}, {
name: "Monitors",
value: 1
}]
}, {
value: 3,
name: "Other",
children: [{
name: "USB",
value: 1
}, {
name: "Cases"
}, {
name: "Sound Cards",
value: 1
}]
}]
}],
levels: [{
childrenVisibleMin: 1.5
}]
}
}
De: "Ovilia" <[email protected]>
À: "pier luigi rossi" <[email protected]>
Cc: "dev" <[email protected]>
Envoyé: Vendredi 10 Décembre 2021 10:07:35
Objet: Re: Select nodes and childrens by search javascript function (RegExp) in
a treemap graph
Hi Pier,
You can set the color of each block with [1] and on search text change, you
should
call `setOption` with the calculated color to update the chart.
Thanks
Ovilia
[1] [ https://echarts.apache.org/zh/option.html#series-treemap.data.itemStyle |
https://echarts.apache.org/zh/option.html#series-treemap.data.itemStyle ]
