Comments (6)
As it says on the documentation, if you're using v3 of d3 you should be using v1 of d3-legend, here it is on cdn: https://cdnjs.com/libraries/d3-legend/1.13.0
Here are the docs for that version: http://d3-legend-v3.susielu.com/
Let me know if you have any problems.
from d3-legend.
Ah I understand your confusion, the cdn links aren't going to v1 I'll update that now.
from d3-legend.
@susielu
Yep. That was the problem. And I did not find the hint where it says that its v1
!
However, including the file you pointed out gives me this error
a.getBBox is not a function at https://cdnjs.cloudflare.com/ajax/libs/d3-legend/1.13.0/d3-legend.min.js:1:1001 at Array.map (native) at Array.a (https://cdnjs.cloudflare.com/ajax/libs/d3-legend/1.13.0/d3-legend.min.js:1:976) at Array.Co.call (https://d3js.org/d3.v3.min.js:3:15178) at drawWeltweit (http://127.0.0.1:7555/js/gui_eingrenzung/selfwritten/ausfaelle_weltweit.js:409:10) at http://127.0.0.1:7555/js/gui_eingrenzung/selfwritten/ausfaelle_weltweit.js:134:21 at Object.<anonymous> (https://d3js.org/d3.v3.min.js:1:11277) at Object.t (https://d3js.org/d3.v3.min.js:1:1565) at XMLHttpRequest.i (https://d3js.org/d3.v3.min.js:1:10137)
while having this code
var lc= d3.select("#legend")
var colorLegend = d3.legend.color()
.labelFormat(d3.format(".0f"))
.scale(colorScale)
.shapePadding(5)
.shapeWidth(50)
.shapeHeight(20)
.labelOffset(12);
lc.append("g")
.attr("transform", "translate(352, 60)")
.call(colorLegend);
from d3-legend.
Hmm I just put together a working example, does this help at all?
https://jsfiddle.net/erg3npjt/1/
from d3-legend.
It seems like something is going wrong with the selection you're passing to the function.
from d3-legend.
@susielu
Ah, it needs to be a svg
, not a div
:)
from d3-legend.
Related Issues (20)
- label color remains black in dark mode
- Last threshold's "more than x" label should be "x or more" HOT 2
- Library is not included in webpack bundle HOT 9
- ENH: labelFormat to support numeraljs format HOT 1
- NS_ERROR_FAILURE errors HOT 15
- help wanted: irregular patch legend HOT 5
- Custom Color and Shape? HOT 2
- legend size defaults to 5 when data has length of 1 HOT 2
- Feature Request: Vertical legend text alignment options HOT 6
- cellclick and "#tag"+d.key.replace(/\s+/g, '') HOT 4
- Support for d3.scaleTime() HOT 2
- legend with clamp values HOT 1
- Scrollable Legend HOT 1
- import problems d3 version 5 HOT 5
- Property 'labelWrap' does not exist on type 'LegendColor' HOT 1
- Legend not showing up properly if hidden using jQuery
- Interface LegendColor, issues with cellFilter method, argument type is missing
- labelWrap only wraps white space
- .on functions don't work with d3 v6 HOT 2
- please upgrade to d3 v6 HOT 1
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-legend.