Add a single y and x axis into the middle of the plot

Hi all,
me again,

I’ve been trying to add a single y and x axis at a predefined position (ultimately the mean x and y values but I am trying to start simple).
Styled Axes / D3 / Observable in this notebook I’ve been trying to set the y and x attributes directly but no luck.
What somehow works is using transform and translate and then calling .ticks(1) though I suspect this is the wrong way and will not work generally.

How would I do this with my xScale(point)?

Should I just append a dashed line component and make the length == width instead?

many thanks in advance!

Hi Oliver, do you have a notebook where you’ve tried this? You can move the axis either with a transform on it directly, or putting it inside a <g> element with a transform. Your scales would let you compute the offsets you need by translating from the data domain to screen coordinates.

Also, are you trying to move the entire axis, labels and all, or just move the axis line? I wonder if the axis would get in the way of your data (or be hidden behind marks).

1 Like

Hi, I just edited this one straight. Though that’s exactly what I did (just transform with scaled x,y) I thought its likely not the best way which was what led me here.
It also doesn’t seem to work so consistently.
Or at least translating not the way I want it to.
Just trying to add an additional axis line vertically and horizontally.
I.e. here is an example (though I don’t like the chart style itself I do like that we can see the mean as dashed lines)

Here is a fork of my failngs :sweat_smile:

Hi again,

so I’ve tried to add the above to this plot:

However it’s still the same question, even though it works in the original (see link to notebook above), here the relation is a little off.

I.e. I add it to 15, but it goes to about 7.5 (15/2) coincidence?
And also it isn’t dashed anymore if just a single tick, whereas if I do tick( >1) the axis is dashed again which is very confusing.

Any insight on why this is happening is greatly appreciated!

An additional note, appending directly a <g> element actually renders the same axis off the chart (below it). Shouldn’t that be the other way around (i.e. appending like I do now be relative to the appended element but like you suggested appending a general <g> element be the absolute position)?

I apologize for the thousand questions.