using D3js power, with less js coding, some thought experiments to discuss

33 views
Skip to first unread message

Ruud Steltenpool

unread,
Dec 8, 2016, 2:35:02 AM12/8/16
to d3-js
When you're not fluent in JS, but are pretty good at handling data, math, drawing (with these helper lines showing sizes as in building drawings), SVG even
Then I could imagine in quite a lot of cases it's conceptually possible to have tools to create custom dataviz with a lot less JS coding.
What do you d3js smart people think?

For example: why not just drag an axis element on screen and manipulate it right there?

I'd love to help develop things, but you guessed: it I'm no JS expert

Vlado Z

unread,
Dec 8, 2016, 3:30:02 AM12/8/16
to d3-js
You mean software like Inkscape/Adobe Illustrator in browser?

There are some attempts, here you can find Chrome extension for drawing svg in Chrome https://boxy-svg.com/
Node JS module for SVG drawing in browser https://github.com/SVG-Edit/svgedit
Haven't tried it but you could possibly try it, if you know how to install NodeJS and NPM modules :D

Of course a JS software that manipulates SVG in browser can be created, but we the common users of D3js do not have either the time or the assets to develop such tool, sadly. :)

You can install Inkscape, it creates SVG file which you can then use freely in browser. All major browsers support SVG format.

Ruud Steltenpool

unread,
Dec 8, 2016, 4:10:55 AM12/8/16
to d3-js
-From the left you drag SVG basic elements, SVG code/file and d3 elements (e.g. an axis) onto a drawing area
-In an overlay all parameter names of these visual elements will show and you can fill in the value with a function/variable/constant
-On the right all available data, parameters and temporary/helper variable names are listed and available to drag into the places where you calculate the parameter values

Hope that makes more sense and you have examples for something like that too.
If such a thing does not exist, but people here think it's feasible, I might give it a try myself on Github

Vlado Z

unread,
Dec 8, 2016, 4:20:14 AM12/8/16
to d3-js
You can use JS Bin and JSFiddle

Peter Cook

unread,
Dec 8, 2016, 10:11:09 AM12/8/16
to d3-js
Have you looked at Lyra (and other tools created by IDL)? - is that the sort of thing you're thinking?



Ian Johnson

unread,
Dec 8, 2016, 1:00:07 PM12/8/16
to d3...@googlegroups.com
I think some of these ideas from Bret Victor would be helpful in thinking about such a thing

closing the gap between drawing tools and data manipulation might be another way to make progress. A program like Sketch can take SVG as input and allows you to manipulate visually. If you generate the basic elements from data in the browser you can export the svg. If it was easier to go back and forth (better sketch plugin? browser extension? app?) you might be able to get "best of both worlds" without developing an entirely new authoring system. 

On Thu, Dec 8, 2016 at 7:11 AM, Peter Cook <peter....@gmail.com> wrote:
Have you looked at Lyra (and other tools created by IDL)? - is that the sort of thing you're thinking?



--
You received this message because you are subscribed to the Google Groups "d3-js" group.
To unsubscribe from this group and stop receiving emails from it, send an email to d3-js+unsubscribe@googlegroups.com.
For more options, visit https://groups.google.com/d/optout.



--
Ian Johnson - 周彦
Reply all
Reply to author
Forward
0 new messages