Comments (4)
Yep, you need a square matrix! The chord layout is designed to show relationships between N items, so you need an N*N matrix.
from d3.
Okay - I think that makes sense. Like I said, I don't code much but in looking up a "square matrix" what I get is that columns must equal rows. So if I'm tracking sales for a team, if I have 10 sales people, I can only show 10 months? Is that right?
Does the number for d3.range also change to match this? If you could show me this with a code example I'd be very grateful. ;-)
Jeff
from d3.
Hmm, I should back up and explain what a chord diagram is—it shows you the relationships between N entities:
http://mkweb.bcgsc.ca/circos/presentations/articles/vis_tables1/#example1
The example on the website is a synthetic (rather than real-world) dataset. It shows simulated dating histories for males. For example, the black -> black value of 11,975 means that 11,975 males dumped a partner with black hair for a different partner with black hair. Whereas, 5,871 dumped a partner with black hair for a partner with blond hair, and 1,951 for vice versa.
(This is a pretty dumb dataset—I assumed it was real data. I should go find some real data to replace this example with something less chauvinistic.)
So, it doesn't make sense to have the rows as sales people and the columns as months—the rows and columns have to be the same type of thing. For example, if you wanted to show how much email sales people send to each other, you could use a chord diagram. The value in the matrix at cell <i,j> would be the number of emails from sales person i (say, Ivan) to sales person j (say, Jane).
If you want to show the amount of sales per sales person per month, I'd recommend using a streamgraph or stacked bar chart instead. There's an example of that in the repository:
https://github.com/mbostock/d3/blob/master/examples/stream/stream.html
from d3.
I've been playing with symmetrical and asymmetrical data sets with the chord layout that is, I've been successful visualizing pathways (ribbons) between two data sets with different categorical scales. The trick is in the padding with 0 values to construct the square matrix.
Even though I can format the data to correspond to the way the layout reads the cells in the matrix, I haven't figured out how to animate a time series from multiple matrices.
from d3.
Related Issues (20)
- rollup -c fails. es6 bundle
- Query on how to build Custom Scale
- Main license set as ISC, but BSD-3-clause listed in the license file
- .on("dblclick", function) event does not work
- `geoContains(object, point)` returns `true` for a `point` outside the `object` HOT 5
- ReDoS vulnerability on RegExp used in d3js HOT 3
- d3 scaleBand paddingInner combination with paddingOuter(0)
- svg拖动过程中出现白色异常
- NextJS 15.0.3: Unexpected end of JSON input HOT 2
- TrustedTypePolicy.createHTML() in d3.svg HOT 2
- Inconsistency using foreign object with D3 in Chromium
- adding random node to leaf, but after adding new node the zoom level returns to root node,
- How to Modify the Coordinate System with d3-zoom?
- Failed to read the 'value' property from 'SVGLength': Could not resolve relative length.
- LineString am I missing somthing
- Gap between chart bars when daylight savings ends
- Mapping Course Flows in College Degree Programs
- Support links on d3js.org are outdated
- d3 zoom mouse event consumtion question
- [Need feedback] Open source research: d3/d3 edition
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from d3.