Security News
The Unpaid Backbone of Open Source: Solo Maintainers Face Increasing Security Demands
Solo open source maintainers face burnout and security challenges, with 60% unpaid and 60% considering quitting.
@redsift/d3-rs-legends
Advanced tools
d3-rs-legends
generate a legend for charts.
View @redsift/d3-rs-legends on Codepen
![Default bottom orientation](https://bricks.redsift.io/reusable/d3-rs-legends.svg?_datum=['A', 'B', 'C'])
![Left orientation](https://bricks.redsift.io/reusable/d3-rs-legends.svg?_datum=['A', 'B', 'C']&orientation=left)
![Right orientation](https://bricks.redsift.io/reusable/d3-rs-legends.svg?_datum=['A Short', 'B', 'C Long']&orientation=right)
![Top orientation](https://bricks.redsift.io/reusable/d3-rs-legends.svg?_datum=['A', 'B', 'C']&orientation=top&radius=10&padding=40)
<script src="//static.redsift.io/reusable/d3-rs-legends/latest/d3-rs-legends.umd-es2015.min.js"></script>
<script>
var chart = d3_rs_legends.html();
d3.select('body').datum([ 'A', 'B' ]).call(chart);
</script>
import { chart } from "@redsift/d3-rs-legends";
let eml = chart.html();
...
var chart = require("@redsift/d3-rs-legends");
var eml = chart.html();
...
['A', 'B', 'C', ...]
Property | Description | Transition | Preview |
---|---|---|---|
classed | String SVG custom class | N | |
width , height , size , scale | Integer SVG container sizes. Typically, use size to scale the chart | Y | |
margin | Object, Number Margin affecting all chart elements | ||
inset | Object, Number Margin affecting the legend | ||
style | String Custom CSS to inject into chart | N | |
background | Color | ||
theme | *light | dark* | |
orientation | String Location of the legend, one of top , bottom , left , right | N | |
legendSize | Integer Size of the color sample | N | |
spacing | Integer Estimator of the amount of space to resere of each char in the text label | ||
padding | Integer Pixels between each legend element | ||
radius | Integer Radius of the legend rectangle. Rounds the element | ||
fill | Array, Function Colors to assign to legend in order | ||
toggleable | Boolean If true will add a new Checkbox on the left side of the color square to add capability to enable/disable legend items. | N | |
onEnabledLegendItemsChange | Function To be called whenever enabled legend items changed. It's called passing an array of the enabled legend indexes | N | |
tintColor | String Color to use for checkbox | N |
FAQs
Generates legends for charts using D3v4.
The npm package @redsift/d3-rs-legends receives a total of 244 weekly downloads. As such, @redsift/d3-rs-legends popularity was classified as not popular.
We found that @redsift/d3-rs-legends demonstrated a not healthy version release cadence and project activity because the last version was released a year ago. It has 23 open source maintainers collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
Solo open source maintainers face burnout and security challenges, with 60% unpaid and 60% considering quitting.
Security News
License exceptions modify the terms of open source licenses, impacting how software can be used, modified, and distributed. Developers should be aware of the legal implications of these exceptions.
Security News
A developer is accusing Tencent of violating the GPL by modifying a Python utility and changing its license to BSD, highlighting the importance of copyleft compliance.