Design based on original by NadiehBremer at Visual Cinnamon
Coding philosophy inspired by Rob Moore
I figured out enter/exit/update for nested objects by studying Lee Mendelowitz's block and reviewing Mike's comments
- Separate layer for hover objects which need to remain on top of chart
- Separate layer for tooltip which needs to be uppermost layer
- Events are configurable as options such that external functions can be seamlessly integrated
- e.g. external tooltips can be configured for mouseover events
- chart.duration(transition-time) // duration of transitions
- chart.options(object) // many options don't have accessors
- chart.width(width)
- chart.height(height)
- chart.margins(object)
- chart.data(data) // set data
- chart.update() // update chart
- chart.maxValue(value) // maxValue of axis values
- chart.levels(value) // number of ring levels
- chart.opacity(value) // opacity of unselected areas
- chart.borderWidth(value) // width of border surrounding areas
- chart.rounded(true/false) // select rounded areas
- chart.events(object) -- chart.events({'legend': {'mouseover': null}})
- chart.color(d3.scale)
- chart.colors(object) -- chart.colors({'axis1': 'color1', 'axis2': 'color2'})
- chart.pop()
- chart.push(row) -or- chart.push([row, row])
- chart.shift()
- chart.unshift(row) -or- chart.unshift([row, row])
- chart.slice(begin, end)
- chart.invert(axis) -or- chart.invert([axis, axis]) // index or "axis label"
- chart.ranges({'axis': [min, max]})
- chart.filterAxes('axis') -or- chart.filterAxes(['axis', 'axis'])
- chart.filterAreas('key') -or- chart.filterAreas(['key1', 'key2'])
- chart.keys() // return a list of data keys
- chart.axes() // return labels of all axes
- chart.nodes() // return svg object
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent