Is it possible to draw a solid black line around the grid?

[Nicryc]

Is it possible to draw a solid black line around the Cartesian Grid on a LineChart? For example by adding a secondary XAxis and YAxis don't linked to any data but displayed anyway on top and right end of the graph? The only thing I found is by tricking with the CSS of the chart. Does a proper way exist?

[ckifer]

I don't think there's a "proper" way, but yes you could add multiple axes to achieve what you want.

To be honest CSS is probably cheaper if it works.

Feel free to to post an example codesandbox here and I can try to help.

[Nicryc]

Ok my bad, I managed to do it in a better way than tricking with CSS. I just had to define a domain for my XAxis and YAxis (otherwise, they would not display).

<XAxis
    dataKey="date"
    allowDuplicatedCategory={false}
    type="category"
    tickLine={false}
    tickFormatter={dateFormatter}
    padding={{ left: 75, right: 75 }}
/>
<XAxis
    tick={false}
    height={1}
    xAxisId={1}
    orientation="top"
    domain={['auto', 'auto']} // that was the important line
/>
<YAxis
    dataKey="value"
    tick={false}
    domain={[upperDomain, lowerDomain]}
/>
<YAxis
    tick={false}
    domain={[upperDomain, lowerDomain]} // that was the important line
    yAxisId={1}
    orientation="right"
/>