Change crossfilter groups via a checkbox - dc.js

I'm trying to build a visualisation to graph what I've been reading this year.
Currently I have everything grouped via Quantity of novels. I'm wondering if it's possible to change the group in real time or if I'm stuck with a group once I've set it.
The code that I've got now to calculate the groups looks something like this:
function groupByType(dimension){
if($('#ValueType').is(':checked')) {
console.log("Pages")
return dimension.group()
.reduceSum(function(d) {
return d.Pages;
});
} else {
console.log("Volumes");
return dimension.group();
}
}
Whenever the checkbox (#ValueType) is clicked I'm calling a dc.redraw on the entire graph which I was hoping would change the way the group is being calculated but it's not doing so. Is there way to change the group dynamically or would I be better off just refreshing the page and passing a parameter when it loads?

It's a bit hard to tell, but it looks like every time you check or uncheck the checkbox, you create a new group. You do not want to do this as the groups stick around and continue getting updated. Things will just get slower and slower.
Just create the 2 groups upfront (and perhaps even 2 dc.js charts) and then let the checkbox control which group is assigned to the chart or which chart is displayed.

Related

AngularSlickGrid problems when change the columndefinition

I'm developing an app using the amazing angularslickgrid.
Till now, i haven't got any problem, buy I found out an strange behaviour on it.
In the ngOnInit I wrote the following code:
ngOnInit(){
this.defineGridHeaders();
this.defineGridOptions();
this.obtainData();
}
Till this moment everything works well and the grid load correctly the data including the RowSelection column.
The problem is when I try to change the columndefinition, and perfrom a reset() like this:
this.defineGridHeaders();
this.angularGrid.gridService.resetGrid();
The new colums have been loaded correctly but i lose the rowSelection column.. :(
I've tried to include the defineGridOptions() function in the middle of the defineGridHeaders() and resetGrid() but the result is the same.
In the this.defineGridHeaders() I just perfom the following:
this.columnDefinitions = [];
[...FIELDS CREATION...]
const col = {
id,
name,
field,
sortable,
filterable,
type,
editor,
formatter,
filter,
outputType,
params,
minWidth: minwidth,
width: width,
header: header,
excludeFromExport,
excludeFromGridMenu,
excludeFromQuery,
excludeFromHeaderMenu
};
this.columnDefinitions.push(col);
Could someone help me on this?
Many Thanks!
Please note that I'm the author of Angular-Slickgrid and you opened an issue with the same question on GitHub, I'll simply reply with the same answer here
a reset is a reset, so it won't keep that. But I added the Row Selection in the Grid State not that long ago, so you could get it from there (just check the Grid State/Presets - Wiki. Dynamically adding a new column can be seen in this Example 3, you should look at the code on how to make it show up correctly (you can't just add it, you need to manually trigger a dirty change call, look at the example code for that)
Also to add a bit more to this, SlickGrid Row Selection is by row index, it's not by row data. Meaning that if your data changes when you refresh or something and you keep the row selection it will not synched anymore... all that to say, just remember, it's a row index, so pay attention when you want to keep or want to reapply a row selection.
If it's just to row selection that you lose, just save it before adding a column and put back the selection after adding the column. It's simple, get the row selection (with getSelectedRows) before you change the column definitions, add your new column and then put back the selection (with setSelectedRows).

highcharts - onclick event handlers redraw/remove

Currently I have 4 charts. The selection (via column or legend) of a category from the main one triggers multiple events. It changes the selected item's color on two charts and it creates two more charts.
For the two created charts, I'm having problems with redrawing/removing (that is what I'm assuming I will have to do) when the column/legend is deselected.
I may be wrong but from what I've looked at, it seems that when you prevent show/hide it doesn't change the visibility property so I wasn't sure if there was a way to use that.
Any help would be appreciated!
Fiddle here: http://jsfiddle.net/jlm578/gy9og69r/4/
I also thought about whether I needed to add it into the logic of the function (possibly one below) or if the sibling aspect needed to be added to the others.
function drawSignifNonSignifEruptionsChart(series){
if (series.index == '0'){
var eruptVEI = ['VEI 0'];
var signifErupt = [10];
var nonSignifErupt = [600];
}

Toggle validation hide(+) when other in open(-) SSRS

I am developing a "Dashboard Report" in SSRS Visual Studio 2010. I Am trying to put 8 charts graphs at the same location. Each chart must open from each textbox I assigned a toggle. Each chart has the visibility as Hidden and display by textbox name.
Now I am trying to make a validation which determine that only one chart must show at the time. Because when I try to see an individual chart always I have to close which was open before.
I have created a parameter to assign an InitialToggleState Expression, but I haven't succeed.
I will appreciated any good suggestion step by step. Thanks
Have you considered using a Hidden parameter to control which chart is open? By defining one you can use the textboxes to control an identifier for which chart you wish to display.
Method
First define a Hidden Pameter by creating a new parameter and setting the visibility to ‘Hidden’. I have created one called OpenChart
Create your charts (you have probably already done this by the looks of things. Set each charts visibility to be equivalent to
=iif(Parameters!OpenChart.Value = 1, false, true)
Changing the value ‘1’ to a unique number for each chart
Create your control buttons, possibly using text boxes. Create as many buttons as there are charts to disaply (you’ve probably done this already too). For each button Set the action to be a reloading of this report, using the same existing parameters, but with the OpenCahrt Parameter set to the chart identifier set in 2. Above
The report now looks like this (for 3 buttons)
Result
When the report is run and the ‘One’ textbox is clicked the output looks like this
And for 'Two' like this
And so on...
You don’t have to put the charts side by side of course, they can be layered on top of each other. I only laid them out like this for clarity.
Hopefully this will help save you from trying to validate all the charts are closed before the next one is open, because only one can be open at a time.
Please let me know if you need further clarification

Filtering data for d3.js sankey diagrams

I'm trying to have a d3.js Sankey visualisation filter a data set according to categories.
I'm using d3.csv method to input the data as shown in this example - http://bl.ocks.org/timelyportfolio/5052095
I would however like to upload a data set with four columns -
source, target, value, category
My aim is to have a visualisation with the ability to switch between categories. So each Sankey visualisation will only represent one particular category. Then user can switch from the dropdown to another one.
Is this possible using the current d3.csv input method?
Would this work ?
d3.csv("file.csv", function(data) {
[...]
// Called each time there is an action on the dropdown menu
function updateGraph() {
// Select only data that are tagged with a certain category
var dataset = data.filter(function(d) { return d.category == selectedCategory; });
// Update graph visualization
}
}
This way you wouldn't have to reload your csv file each time.
This a very long method for the second part but, creating multiple html/php and csv files depending on your categories and then adding the following code in each of your html/php files. This method would be extra work if you have a lot of categories.
Category 1
category 2
If you figured out a solution the way you were trying it, then if possible please update your answer. it would be helpful.
Thanks.

How to filter out already selected items from dropdown control in LightSwitch?

What I am trying to achive is the following:
I have a drop down list with some values from a database. I have some Materials, that I associate to WorkingUnits. So I am able to assign as many Materials as I want to a WorkingUnit, as well as have one and the same material assigned to two different WorkingUnits (in case I want to do so). So far so good, but what I want to achive as extra, is to filter out the already selected materials per working unit so that the user cannot select them again.
Improvised tables relationship:
|Materials|1 --------- * |MaterialWorkingUnitMap| * ----------- 1 |WorkingUnit|
I might be asking for something trivial, but I cannot figure this out so far. Are the relationships wrong in your according to the described behaviour? According to me they make sense, but I am completely new to LightSwitch.
Another solution would be to also include some validation in case the user selects one and the same material. This is the less desired approach, but I guess it satisfies me as well.
I hope this helps.
Go to your Materials table and create a new query called "UnusedMaterialsByWorkingUnit"
In this query, add 1 parameter: Parameter WorkingUnitID of type Integer.
Go to the Write Code dropdown and select "UnusedMaterialsByWorkingUnit_PreprocessQuery"
Make your PreprocessQuery look like this:
partial void UnusedMaterialsByWorkingUnit_PreprocessQuery(int? WorkingUnitID, ref IQueryable<Material> query)
{
query = from material in query
where !material.MaterialWorkingUnitMaps.Any(c => c.WorkingUnit.Id == WorkingUnitID)
select material;
}
Go to your LIghtswitch screen where you have your dropdown.
Add Data Item... and select the UnusedMaterialsByWorkingUnit query.
On the left of the screen, click on the WorkingUnitID which is in the query and databind it to WorkingUnit.ID that is loaded on the screen.
Go to your dropdown and select the UnusedMaterialsByWorkingUnit collection as the source.
Let me know if this works!
In the command that adds a selected material item to the MaterialWorkingUnitMap, add some code that removes the selected record from the Material collection. With Lightswitch's databinding, that should immediately visibly remove the Material record from the view. However, when you call SaveChanges, this will cause a deletion of those material records from the database, which I don't imagine you want to do. So to prevent that, in the SaveChanges pipeline, you can call DiscardChanges on the deleted Material records.

Resources