D3.js is a small, open-source JavaScript visualization library for manipulating HTML and SVG documents based on data
2
votes
0answers
45 views
D3 Force-Directed Graph with Numerous Functionalities
I have a d3.js force directed graph that is driven by the code below. I am relatively new to d3, and much of the code is pieced together from various examples found online. If anyone has a moment or ...
1
vote
1answer
176 views
Converting UTC time to date in d3
I intend to convert strings that are UTC timestamps into a date format, say day + date number (e.g. 'Mon 27'). My current solution is:
Parse the UTC timestamp into a date object using ...
3
votes
0answers
42 views
2
votes
1answer
42 views
Appending various elements to SVG
This is the code I currently have for adding various elements inside the svg and then inside a circle. On the text element I added 3 attributes that are the same. But I haven't found a way to remove ...
3
votes
0answers
290 views
D3.js multi-line graph
Here is my JS code which uses the D3.js library (mostly snipped from other examples). I want to graph the acceleration of a point in 3D-space which changes with respect to time. The X-axis of the ...
0
votes
0answers
138 views
D3 map of the administrative sub-region of Europe
This is a pretty neat map I made of the administrative sub-region of Europe. The code is super slow and sloppy, so please suggest some ideas on how I might clean it up.
...
2
votes
0answers
206 views
Using d3.drag() to enable dragging on an SVG group
I'm using the following function to enable dragging on an SVG group.
...
1
vote
0answers
63 views
Extensible factory method for starting D3 charts
I'm working on refactoring some existing code to be a bit more extensible and am wanting to create a generic factory API for starting D3 charts.
Currently, my factory looks like this:
...
3
votes
0answers
31 views
Dynamically displaying different controllers
I have here a simple webapp for displaying different D3 demonstrations:
The idea is - the user can select one of many modules in the control bar at the top, and the corresponding controls for that ...
3
votes
0answers
50 views
Plotting discontinous function
I've made a simple web plot with D3 JS version 4. I've drawn a discontinuous function:
$$f(x)=\frac{1}{x(x-2)}$$
which has 2 vertical asymptotes and 1 horizontal asymptote. I add a legend with LateX:...
5
votes
1answer
165 views
Use of Module Design Pattern in simple D3 “overlay” program
I have been learning JS (mostly using D3) and I wanted to put the Module Design Pattern to use. I wrote a simple script that lets you build a bar chart with more ease / readable code.
The end user ...
8
votes
1answer
518 views
2D colliding disks in JavaScript (ideal billiard balls)
I am implementing a simulation of colliding disks (ideal 2D billiard balls) in JavaScript.
I follow an event-driven algorithm that avoids discretizing time; the algorithm goes as follows at each step:...
0
votes
0answers
789 views
D3 Map Visualization with tooltip and graph
I would love if someone had any feedback on how to optimize my code, suggest better color schemes, and improve my table. I created python scrapers to get the data from the CDC and menuism to get the ...
5
votes
1answer
219 views
Bode plot filters implemented in JavaScript
The following code is my attempt to create an interactive bodeplot. I used JavaScript using d3.js, jQuery Mobile and math.js. The bode plot shows a lead lag filter in continuous time and several ...
3
votes
0answers
154 views
JS component for displaying tree with weird behaviour
I developed a javascript component to display a tree, based on D3.js
I'm not sure how clean my code is, I'm not used to code a lot of javascript and I'm constrained to write everything in 1 file.
So ...
2
votes
0answers
235 views
Optimizing D3 Stream Graph Code
I have two javascript functions that generate a D3 Stream graph. I feel I may be excessively and unnecessarily iterating over my dataset to get it into the desired form.
How might I optimize or ...
6
votes
1answer
2k views
Simple grid using SVG
I developed this grid which displays number of records for X & Y, user can click each number to see a list. (I didn't add list markup to fiddle yet - so lets not worried about it for now.)
What I ...
4
votes
1answer
1k views
D3.js interpolating line on circumference of circle
For now, I've tried to make a line rotate on the path of a circle, but used setInterval multiple times and there might be other ways of achieving the same.
I would ...
0
votes
1answer
58 views
Transitions from one element to another
I am implementing an automated help function in my code. It is simply a few bubbles that pop up with some text in them. I use d3 to select one bubble, display it for a short time, and then select ...
4
votes
2answers
563 views
D3 Matrix table
I am able to develop this matrix but I think code can be improved. I am creating a map on which each rectangle may have zero through many list items with their titles (still need to add code for ...
3
votes
2answers
2k views
d3.js dougnut pie chart legend toggling
I'm developing a legend toggling d3.js pie chart application using this jsFiddle as my latest version.
I am aiming to get a streamlined working example where the legend can toggle the slices, trying ...
6
votes
1answer
608 views
Strategy Game in Javascript with Three.JS
I've been playing around with porting a simple strategy game over to Javascript, the idea being to run it in a browser for testing. I've done some simple Javascript code in the past, but this is my ...
3
votes
1answer
1k views
Approximating Date for a D3.js timeline
I've updated code from a couple weeks back so I've come back to get more feedback. The original post can be found over here:
Approximating/Sorting groups of dates into buckets
...
2
votes
1answer
2k views
Approximating/Sorting groups of dates into buckets
I'm working on a directed study project with a professor of mine helping him build out a Django based website. The website is a historical account of the people, events, projects, and organization in ...
3
votes
1answer
485 views
Basic Backbone application using d3
I've started my first application using backbone and have something basic up and running, backbone seems to give a lot of freedom to application design and I don't know what I'm doing right and wrong ...
3
votes
1answer
1k views
Displaying overlapping blocks using d3.js
The code takes in nodes with different start time as input and assigns the position such that they will not overlap. As I have coded with too many loops and conditions. Can anyone review the code and ...
2
votes
1answer
3k views
What is the more effective way to get array of data out of xml for d3 chart?
I am writing a small application that would interactively allow user for xml file manipulation with d3 interactive charts.
My xml file has the following hierarchy :
...
1
vote
1answer
2k views
4
votes
1answer
2k views
d3.js realtime streamgraph memory usage
This page (full source & demo) displays a 2-channel horizontal d3.js Streamgraph that takes realtime mouse coordinates as data inputs for the graph.
However, it tends to gradually use up an ...
8
votes
2answers
5k views
D3 visualization of a Facebook friend graph
I've been learning Python for about a year and now I'm trying to improve my JavaScript. I wrote this simple d3 visualization that shows your Facebook friends as a force-directed graph. Here's a live ...
5
votes
2answers
613 views
Optimizing mouse in/out
I have this code that places a marker and on mouse-over this marker is scaled out and then back to the 'original' scale:
...
