vlandham / js_data Goto Github PK
View Code? Open in Web Editor NEWData manipulation and processing in JavaScript
Home Page: http://learnjsdata.com/
Data manipulation and processing in JavaScript
Home Page: http://learnjsdata.com/
Would there be interest in this? If so, I could spend some time working on this. Same for removing loadash
This one confused me a bit so in case this also confuses other people. In d3 v5 if you copy the d3.csv
code here http://learnjsdata.com/read_data.html it won't work because the callback doesn't get passed all the csv data, but a line of csv data. This is because of the changes here https://github.com/d3/d3/blob/master/CHANGES.md in short to get the same result you have to use promises e.g. d3.csv('file.csv').then(cbFunction)
I used this guide as an intro to d3 so I wasn't aware about the varying versions, so maybe it would be helpful to newcomers to note this difference down?
For example, 'data munging' is not a commonly used term. This term should be removed, changed, or augmented with a definition.
Consider adding a section on output - either as a new task, or a smaller section as part of one of the first tasks. Suggeted by @ndarville & @steventroysimpson
could be in the 'getting started' task - perhaps just some links about who made this.
In the Stripping Whitespace section, both d3 and lodash are used to do the string trimming. It might be a bit cleaner to just use lodash and avoid the temporary variable as a bonus.
d3.csv("data/cities_spaced.csv", function(data) {
var clean = data.map(function(d) {
return _.reduce(d, function(acc, v, k) {
return acc[_.trim(k)] = _.trim(v), acc;
}, {});
});
console.log(clean);
});
Alternatively, you might consider breaking this up for further clarity.
function trimObject(o) {
return _.reduce(o, function(acc, v, k) {
return acc[_.trim(k)] = _.trim(v), acc;
}, {});
}
d3.csv("data/cities_spaced.csv", function(data) {
var clean = data.map(trimObject);
console.log(clean);
});
It would probably be helpful to mention that lodash _.reduce
is similar to the Javascript built-in reduce
, except it works both on arrays and objects. When we use it on an object our function is given a value and key with each iteration rather than an array's value and index.
Hi, I was excited by this d3 for data wrangling idea, because I'm wanting to combine R's dplyr
with data viz. But feel like hand coding the data feels a bit silly when there's reams of it.
I know that this is probably not what your help is for, but I'm trying to follow your tutorial on loading data with d3.csv and I can get the console log to print to the html page. ANd I 'm not sure if it supposed to or not. I'm getting the feeling that this tutorial is not meant for me, but since I'm an avid user of dplyr your page makes it sounds like this is something I should be able to do or want to do. It would be so helpful if your github account actually contained the d3 code in the finish html file.
Other d3 tutorials have examples that just display to the web out of the box, so I'm assuming the console.log is supposed to log to the html, not the console itself. thanks
HI @vlandham and Bocoup team,
I hope all is well.
We're considering to use your JS Data guide as a reading material for our undergraduate Data Visualization class at UW next quarter. (We love it!)
Meanwhile, we plan to use D3 v4 as the primary visualization toolkit in our class.
Thus, we wonder if you have any plan for updating this guide to use D3 v4?
(It would make it way easier for our students if all reading materials
use a consistent version of D3.)
If you'd like, we are happy to help update this to D3 v4 too.
That said, I wonder if you still want to make the guide backward compatible for users who use D3 v3 and older. If so, do you have any preferred method to maintain this backward compatibility?
One simple way would be just to add note that some methods had a different name prior to v4.
Please let us know
Thanks!
–Ham
cc: @jheer, @jhoffswell
(I'll keep adding relevant TODO list here as I read through the whole guide.)
d3.time.format
is now d3.timeFormat
d3.csv.format
=> d3.csvFormat
custom.css
is pretty much a garbled mess of button mashing.
Could use a clean up.
Also, fonts could do with some sprucing up. Larger fonts. Better fonts.
boaz wants ads on footer. perhaps just on web version and not mobile version.
@iros suggests - and i agree. just use language codes.
tools can encompass future directions for the up-and-coming JS data analyzer.
random thoughts on what it could include:
Hi,
I found http://arasatasaygin.github.io/is.js very useful for the kind of validations that you state on the "Checking Data Assumptions" task.
What do you think?
A declarative, efficient, and flexible JavaScript library for building user interfaces.
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google ❤️ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.