amcharts5 use series.getDataItemById() find child return undefined - amcharts

document.querySelector('button').addEventListener('click',_ => {
let itm1 = series.getDataItemById('Root');// return DataItem
let itm2 = series.getDataItemById('A0');// undefined
series.set("selectedDataItem",itm2); // and not work
});
CodePen
Ive tried multiple variations of this, but none of them seem to work. Any ideas?
Thanks in advance.

After looking at the source code, can use get ('children ') to obtain child nodes
let item = series.getDataItemById('Root');
series.set("selectedDataItem",item.get('children')[0]);

Related

How can I remove a group from a Three.js scene on click?

I have a group of objects (actually 3D text on an arc) that I want to remove from the scene on a specific click. Does .remove not work on groups? Here's basically what I have:
$(".inscript").on("mousedown", function(event){
var x = scene.getObjectByName("inscriptArc");
scene.remove(x);
});
This answer seems to suggest you can (remove a group from a scene using .remove), but it isn't working for me.
THREE.Scene.getObjectByName returns the first instance of a child with that name. If you have multiples you won't catch them by calling it once.
To remove all instances I would use the THREE.Object.traverse(fn(child){}) function ie:
var children_to_remove = [];
scene.traverse(function(child){
if(child.name == "inscriptArc"){
children_to_remove.push(child);
}
});
children_to_remove.forEach(function(child){
scene.remove(child);
});
you might be able to just do
scene.traverse(function(child){
if(child.name == "inscriptArc"){
scene.remove(child);
}
});
but I think there are some cases where this could cause an error if you are loading/removing anything from the scene asyncronously - because removing a child might throw an error when that child's children get traversed. Not sure, so I would try the simple one and swap with the more complicated one if it causes issues.
Yes, you definitely can remove a group of objects. You might have named children of the object instead of the actual group. Function getObjectByName did not always work as promised in older three.js releases so maybe try this.
scene.children.forEach(child => child.name == "inscriptArc" ? scene.remove(child) : null)

Applying change event on j-Query Data-Table Search Box?

I have j-Query data-table with many records and I have builtin search-box. What I am trying is to sum all values in all the tds which have class="amount". It's happening succesfully. Now, the problem is search box. I want to sum the values of tds with class name amount which are only visible. I tried many ways but nothing worked Following is my code:
var salaryTable = $('#tblSalary').DataTable();
salaryTable.on('search', function () {
var sum = 0;
$(".amount").each(function() {
var value = $(this).text();
if(!isNaN(value) && value.length != 0) {
sum += parseFloat(value);
}
});
alert(sum);
});
This logic is not working as expected. How can I solve this or What am I doing wrong? Is there any better approach?
Update: The problem is when I search something it gives me total of visible and invisible records. When I clear the search box with backspace, it gives me total of all records where were visible before.
If you only want visible elements with class amount you could use the jQuery :visible selector
$(".amount:visible").each(...)
jQuery docs https://api.jquery.com/visible-selector/

How get the count of addedfiles in addedfile event?

How I can get the total number of addedfiles in addedfile event?
uploader.on("addedfile", function(file){
here - how I can get the total number of addedfiles?
});
Thanks a lot for the help.
this.files always holds the list of all files that have been dropped.
If you only want to get the files that have been accepted, you can use this.getAcceptedFiles();
So to answer your question, use either of those:
var totalFileCount = this.files.length;
// or
var totalFileCount = this.getAcceptedFiles().length;

How the elements of scene.children in threeJS can be accessed?

I added some objects to ThreeJS scene (using scene.add(object)). I know the name of object and just want to fetch index of it from scene.children.
I tried to use scene.children.indexOf("objectName") but it returns -1 index. Can anybody suggest what can I do?
Thanks
var object = scene.getObjectByName( "objectName" );
or to recursively search the scene graph
var object = scene.getObjectByName( "objectName", true );
Alternatively, you can search by ID.
var id = scene.getObjectById( 4, true );
three.js r.60
I believe that something that can actually can answer your question is the following code that I use to clean the scene:
while (scene.children.length > 0) {
scene.remove(scene.children[scene.children.length - 1]);
}
this way I don't need to access an element by its name or id. The object are simply fetched from the array with an index, so it's like scene.children[i].
You got an alert text as undefined because you're getting back an object not a value/text. You would need to alert something like scene.getObjectByName( "objectName" ).name or scene.getObjectByName( "objectName" ).id i believe.
The relevant docs: getObjectById, getObjectByName. An important note from getObjectByName:
Note that for most objects the name is an empty string by default. You will have to set it manually to make use of this method.
This could be why you were getting undefined. Also, if you are getting undefined, trying to access .name or .id is going to throw an error. If you were getting an object back you would see something like "[object Object]" in the alert.
Another important note I learned the hard way is that the value you need to pass to getObjectById is object.id, and not object.uuid. Also, object.id is essentially just the index of the object in the children array.
Putting it all together:
// var object = new THREE.Mesh(...) or similar
object.name = 'objectName';
scene.add(object);
var retrievedObject = scene.getObjectById(object.id);
// or
var retrievedObject = scene.getObjectByName('objectName');
alert(retrievedObject.name);

jsplumb library getconnection function is not returning values

Hi all I am working in JS plumb library for making connections.I am stuck at one point and need help from experts.
Here is my scenario.
I have many connections and what I want is that when I click on one connection a certain label appears on it to show that it is selected.When I click one some other connection previously clicked connection disappears and new connection get selected.
What I have done so far is that
jsPlumbInst.bind('click', function(c) {
c.showOverlay('selected');
var previously_active = jsPlumbInst.getConnections({scope:"active"});//this function not returning me values
if(previously_active.length != 0) {
/*So never go in this statement*/
previously_active[0].hideOverlay('selected');
previously_active.scope("jsPlumb_DefaultScope");
}
c.scope = "active";
});
Here the problem is that my connection scope is set to "active"
jsPlumbInst.getConnections({scope:"active"})
is not returning anything.
So can any one kindly guide me that whether I am doing right?
Or is there any other way to achieve this?
var sourcecon = jsPlumb.getConnections({source: e}) ;
for(i=0; i<sourcecon.length; i++)
{
var target = getName(sourcecon[i].targetId) ;
var source = getName(sourcecon[i].sourceId) ;
removefrommatrix(source, target,sourcecon[i].sourceId,sourcecon[i].targetId) ;
}
This is code snippet which I am using. It works fine. Your code looks fine except just one difference that you have used jsPlumbInst rather than jsPlumb. I guess that could be the problem. For me its like static class in Java.Not sure about that. But try and see if it could help you.Seems like I am almost a year late in replying. All the best :-)

Resources