-
-
Notifications
You must be signed in to change notification settings - Fork 544
Legend click event #1002
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Legend click event #1002
Conversation
@michaelbabyn the event doc should be linked in the sidebar: If you think it would be more discoverable to add a thumbnail link to https://plot.ly/javascript/#chart-events you're more than welcome :) I think that sounds like a good idea! |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
a few style suggestions then this is good to merge
💃
x = [1, 2, 3, 4, 5, 6], | ||
y = [1, 2, 3, 2, 3, 4], | ||
y2 = [1, 4, 7, 6, 1, 5], | ||
colors = [['#00000','#00000','#00000','#00000','#00000','#00000'], |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
this is a cool example I just have a few styling suggestions 💅
I think the example would look a bit more clear if the 2 traces had different coloring, perhaps colors[0] is black and colors[1] is gray.
colors = [['#00000','#00000','#00000','#00000','#00000','#00000'], | ||
['#00000','#00000','#00000','#00000','#00000','#00000']], | ||
data = [{x:x, y:y, type:'scatter', | ||
mode:'line', line:{ color:'red'},marker:{size:16, color:colors[0]}}, |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
the css default colors (like 'red') can be a little harsh, for the docs it's nice to use color pallets, I like https://colorhunt.co/
data = [{x:x, y:y, type:'scatter', | ||
mode:'line', line:{ color:'red'},marker:{size:16, color:colors[0]}}, | ||
{x:x, y:y2, type:'scatter', | ||
mode:'line',line:{ color:'black'}, marker:{size:16, color:colors[1]}}], |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I think it makes sense in this example to make the base line color match the base marker color.
I updated plot.ly/javascript/plotlyjs_events with a new section on legend click events to deal with this issue.
Unfortunately, the only way I can access this page is through the link or by searching at the moment.
@cldougl , Is this what we want or would it be better for a link to this page to appear here: