r2d3 interactivity

[zmeers]

It would be nice to include d3-parliament in the package so users can create interactive parliament plots with minimal work on their end.

[oguzhanogreden]

I've just started working on a fork of d3-parliament! I'm willing to contribute to this end as well. If you both (new maintainers, I think? 🎉) think this is a good idea, I can make a PR using the original repo with a list of what's needed etc.

[zmeers]

Do you mean this repo or the d3-parliament repo? If this one, I'd wait until we merge Rob's changes with this repo as this one is out of date. I'll let you know when we do that. It should be sometime this week.

[RobWHickman]

cool- changes have been merged now so looking forward to seeing how this pans out!

[oguzhanogreden]

I meant the d3-parliament repo. I expect some incompatibilities/limitations while using r2d3 with the current state of the repo. For instance, the use CSS for colors could be cumbersome for r2d3. I'll sketch up an r2d3 example, so that such things are visible and you can also play around and add to the to-do list.

In terms of the "social aspect" of working on the d3 repo... I made my suggestions available but I'm not sure if the author is willing to work further or agrees with my suggestions. Once we have a clearer idea what is needed here, I can get his attention via email as well.

[oguzhanogreden]

Here's an example. I demonstrated four issues I can think of at the moment. (Until release, please bare with the fact that /js folder contains an .R file :))

[zmeers]

Sorry for the delayed response.. I'm just catching up now. I wonder if it would be possible to define the domain and range of the circle colors in the user options of the r2d3 call. Something like...

r2d3(data = dat,
     script = system.file('js/d3plot.js', package = 'ggparliament'),
     dependencies = system.file('js/d3-parliament.js', package = 'ggparliament'),
d3_version = '4', viewer = 'browser', 
options = list(colorrange = c("red","blue","green"), colordomain = c("R","D","I"))

The domain field matches the party variable in the R data frame. In the d3-parliament.js file, we define colors by writing...

colorValue = function(d) {
           return d.party; }, //or whatever the party variable is called
       color = d3.scale.ordinal()
           .domain([options.colordomain])
           .range([options.colorrange]);

And then when we plot the circles, we define the style like this:

.style("fill",function(d) { 
           return color(colorValue(d)); 
});

Do you think this is possible? Keep in mind that the code above is d3v3 so it'll need to be adjusted to reflect v4 changes. I'll play around with it... If this works, it gives the user complete control over the type of colors mapped to the parties.

[oguzhanogreden]

Yes this is possible and in fact is already done in my fork, in a way that allows d3.legend to be used: see d3.parliament.scale() here. I think this is a reasonable way to do this, so you may not need to work further on this.

I'll email the original author to ask whether/how he'd like to involve, since I don't want to 'hijack' his work.

[zmeers]

Great! Let me know when you've figured it out.

[oguzhanogreden]

d3-parliament now uses the colour information in the column. See example here. These changes will soon be in the main d3-parliament repo.

This enables things like use of d3-legends by Susie Liu. Also, you can combine d3.js scales with some CSS and government PMs, women PMs etc. can be marked, an example is here.

On the other hand, the plots in the README file look quite different than how it was before, so now d3-parliament and ggparliament are creating very different looking plots.

[zmeers]

Oh awesome, it looks great! I don't think it matters that the static plots have changed so long as we have one interactive plot... What do you think @RobWHickman ? @oguzhanogreden Was this written in R markdown?

[oguzhanogreden]

The tag didn't notify me for some reason, sorry!

Nope, I'm not sure if this would be easily possible with RMarkdown. I used https://github.com/jgthms/bulma for the layout and JS for the communication between figures. I wrote the text directly in HTML.

[zmeers]

I've pulled it across into the interactive plots branch. I'll play around with it today/tomorrow.

[zmeers]

Returning back to this... We can use the x-y points generated by parliament_data() and map them to an svg object quite easily. I have a few scripts up on blockbuilder (see https://bl.ocks.org/zmeers/4d3450c295f1342f63b6bef88230e855 for an example of the Australian house of reps). I'm wondering if we can create a html widget with this information... Not necessarily a priority ATM, but I am interested in figuring this out eventually.