Home > OS >  Appending svg solved the issue
Appending svg solved the issue

Time:04-04

In my d3 plot, this is the code and the rendered plot.

enter image description here

enter image description here

As you can see the lines go into the y axis. I was looking for a solution and by chance I appended an svg making the code look like this:

enter image description here

enter image description here

Now the lines are not overlapping the y axis. Why is that exactly?

Note: I changed the width of the appended svg but still the box fits perfectly.

CodePudding user response:

Your paths start at an x position of -25.334... rather than 0, so if translate them horizontally by 30, they will start at 4.666..., which overlaps with your axis. If you put them inside that inner svg element, they will get clipped at the bounds of the svg element and will start at 30 (after translation).

You can disable the clipping by setting an overflow attribute: <svg width="1096" height="160" overflow="visible">.

  • Related