dagrejs / dagre-d3

A D3-based renderer for Dagre
MIT License
2.83k stars 589 forks source link

Added custom css class on edge labels #398

Open kaelhem opened 4 years ago

kaelhem commented 4 years ago

Hi, I've just made a small update on edge label to be able to specify custom css classes.


This PR allow to add a labelClass parameter on the setEdge function.

// sample :
g.setEdge(link.source, link.target, {
  labelClass: 'cutomClass1 customClass2'
})

The original label class is untouched.

It should fix https://github.com/dagrejs/dagre-d3/issues/195

tik-stbuehler commented 4 years ago

For consistency (with labelStyle and labelType) you probably should name the label class property labelClass instead of className.

(And I have no idea why you had to redo the way the class is applied - didn't classed work with the calculated class list?)

kaelhem commented 4 years ago

Hello. I changed the property name for labelClass as you asked. I replaced the "classed" stuff that allow to add/remove a specific class name to be able to specify several classes in the className parameter (like this : customClass1 customClass2).

If you think there is a better way to do it, tell me I will update the PR.

tik-stbuehler commented 4 years ago

I'm not a maintainer, just a user (and I'm interested in the feature too) :)

According to the API doc classed should work with multiple classes (like "label customClass1 customClass2" - i.e. just pass labelClass instead of "label") - but I'm no d3 expert, so perhaps I'm missing something here.

kaelhem commented 4 years ago

ok :) I will have look, not a d3 expert too :)

edit: @tik-stbuehler You were right, I've update the PR.

tbo47 commented 2 years ago

I ported the project to es6 and I accept contributions! https://github.com/tbo47/dagre-es