Customize part of a LineSeries XYChart

[Oubaluna]

Hello Everyone,

I'm quite new to visx and I'm trying to render a lineseries but part of it should be dashed. I already google the question and try ask GPT but still nothing work. I also tried to render 2 lineseries 9in an XYChart component), one with the first part of the data and one with the second part of the data but still it doesnt work :/

EDIT : I close the discussion as there are already one in discussion

here is the not fonctionning code of my chart for some context :

<XYChart
        height={300}
        xScale={{ type: 'band' }}
        yScale={{ type: 'linear' }}
        theme={colorTheme}
      >
        <CustomChartBackground />
  
        <Axis
          orientation="bottom"
          label={String(chartName)}
      />
        <Axis 
            orientation="left" 
            numTicks={4}
            tickFormat={customTickFormat}
        />
        <AreaSeries 
          dataKey={dataKey} 
          data={data} {...accessor} 
          fillOpacity={0.4}
          renderLine={false}
        />
        <LineSeries
          dataKey={dataKey} 
          data={data} {...accessor}
          strokeDasharray={(d, index) =>
            index === data.length - 2 ? '2 2' : 'none'
          } // Trying to Create a dashed line for the last tick
        />
        <Tooltip
          snapTooltipToDatumX
          snapTooltipToDatumY
          showVerticalCrosshair
          showSeriesGlyphs
          renderTooltip={({ tooltipData, colorScale }) => (
            <div>
              <div style={{ color: colorScale(tooltipData.nearestDatum.key) }}>
                {tooltipData.nearestDatum.key}
              </div>
              {accessor.xAccessor(tooltipData.nearestDatum.datum)}
              {', '}
              {accessor.yAccessor(tooltipData.nearestDatum.datum)}
            </div>
          )}
        />
      </XYChart>

  May be I'm missing something silly or a properties I dont know ??