I added buttons to my SVG in D3, attached the link from where I take the code: https://d3-graph-gallery.com/graph/barplot_button_data_simple.html

the Default of this code is to locate the buttons in the left top corner of the svg. How can I change the buttons location on my svg? Bonus question - How can I change the color or style of my buttons?

Thank you very much!

CodePudding user response：

In the example you shared, the buttons are not part of the SVG. they appear about it and not part to the tag.

There are 2 options IMO:

1. You can still put the buttons outside of the svg and give them CSS position: absolute and change top & right properties to change their location.
2. You can move the buttons inside the svg element using <forigenObject> tag, and give him CSS property transform: translate(X px,Y px).

CodePudding user response：

If I want to use the first option that you suggest, how do I write it? Can I use only top/bottom/left/right or can I move it in pixels or something so it will be for example in the top middle?