In my data for force layout I have
"nodes":[
{"id":"0", "name":"A",
"isListedIn":["USSDN","Canadian list"]
},
Normally, I would then bind it to D3 selection such as
d3.select(body).selectAll(".node").data(graph.nodes).enter()
.append("image")
.attr("name") function(d) return d.name)
.attr("isListedIn",function(d) return d.isListedIn)
Where I try to get it out
var listList=d3.select("#listList").append("ul")
.data(listList)
.enter()
.append("li")
.text(function(d){return d})
But d.isListedIn is not working. The thing I tried to do is when user click on 1 node--> I can get the value of isListedIn out as a array. How can I achieve this?
What exactly are you trying to achieve?
It doesn't really makes sense to add an attribute to store the isListedIn list on your nodes just to retrieve it later, as d3 already does that for you. If you want to get the data for a DOM element, you can use either d3.select('#el').data()[0]['isListedIn'] or d3.select('#el').each(function(d) { console.log(d.isListedIn); }); depending on what you want to do with it.
Related
I not sure how to solve this issue. I am sure someone will know this very quickly.
I have an array of objects and modifying a property. I have a firebase listener 'child_changed'. When firebase is updated need to update the array. Here is the code below.
dbRefList.on('child_changed', function(snap) {
var len = this.grocerylist.length;
for(var i=len; i--;) {
if(this.grocerylist[i].key === snap.key) {
this.set(['grocerylist', i, 'selected'], snap.val().selected);
}
}
this.notifyPath('grocerylist', this.grocerylist.slice());
}.bind(this));
When the array is modified I want the template repeat-dom to trigger. I know this.set will not trigger array mutation sub properties but again I am not sure how to solve this. I done research and tried so many solutions.
I can force a render on the template dom-repeat but I would prefer the data binding way.
So this code (just the this.set you have in there now) should cause the value of grocerylist.i.selected to update inside the dom-repeat (assuming it's bound in there so it's actually showing up).
What behavior are you seeing? Are you trying to filter or sort the list based on the selected value? In that case, you might need to add observe="selected" on the dom-repeat.
(Also—have you confirmed that the child-changed callback is being called with the this value you expect—the element—rather than window or something else?)
You should be able to force a refresh by doing this.grocerylist = this.grocerylist.slice() or this.set('grocerylist', this.grocerylist.slice()); ... notifyPath doesn't work here because notifyPath doesn't change the value, it notifies the element about a prior change (the second argument is effectively ignored).
I have two tabs in my dialog.First Tab is having a pathfield and second tab is having a multifield inside that only one widget of xtype selection(drop down) exist.I want to send the pathfield path as a query parameter to a servlet and want to populate json in the list.
I have done this by having a listener under drop-down widget.
i am using property render and its value:
function(){
var dialog = this.findParentByType('dialog');
var path=dialog.findById('path');
$.getJSON('/bin/demo?path=' + path.value,
function(jsonData){
this.setOptions(jsonData);
this.doLayout(false,false);
}
);
}
My JSON response is coming but setOptions is not a function error is coming.
Please Help!!!!
this value depends upon the context where you are making use of this.
I believe that is the problem here. this value would differ inside and outside the $.getJSON. You would need to bind the value of this object for the function.
The link has given the example also. Either you need to store reference of this to a variable or bind this reference using the bind method. Refer this for more details
I am facing problem with c3 directives to reload data and changing the chart display type. Please see my plunker at http://plnkr.co/edit/wWJx3zU3Sm1cN9ZCtvoh?p=preview.
For reloading the data, I am using $scope.refreshInData function and for changing the chart type I am using $scope.transform function. But somehow these are not working. From the given example on the Github, I tried to use transform function to change the chart type I am unable to make it work. Any help please ...
$scope.transform = function(filterSelected, preChartName) {
alert('inside change Chart ' + preChartName);
c3SimpleService['#' + preChartName].transform(filterSelected, filterSelected);
// preChartName.load({ data.type : filterSelected });
}
C3 transform() can take one parameter and in your case - it should.
In case of $scope.transform you should use it like this:
c3SimpleService['#' + preChartName].transform(filterSelected.value);
notice 2 things:
transform takes 1 parameter and it is string - name of chart type
what you are passing is object, so you have to access its value field
As for $scope.refreshInData() problem is slightly different. Here only thing you have to fix is to grab chart not with it's ID directly, but through c3SimpleService service. This will allow access through AngularJS layer:
c3SimpleService['#' + preChartName].load({ columns : cityData });
You can see it working in Plnkr
You need to set an scope variable like : isChart its value true/false. You can use this scope into your ng-if condition. on every request/change you need to change its false after request success make it true. and also you need to reset you graph data array on every change/request. it works perfectlly.
I have a plunker that is trying to sort a collection of objects for display. The map looks like...
{
test1:{
name:'Cccccc',
title:'Aaaaaa'
}
}
I would like to order this list by title using a filter, however, the following seems to fail...
this.drawers = $filter('orderBy')(this.drawers, 'title', false);
I found an answer to a similar question, however, this does not appear to apply to my scenario because it changes the structure of the object returned from the filter. Does anyone know how I would write a custom filter to handle this?
I'm trying to write a filter for a treestore using this example, and I'm wondering how you tweak/call the filter method so that you can display values that don't match your filter parameter.
I tried to tweak it so that it only called node.remove() when the the filter parameter was wrong. However this doesn't seem to update the store and panel.
Am I missing something?
To do that I would need to write a custom implementation of Filter.filterfn.
Filter({
filterfn: function(record){
//Insert Logic
}
})