[charts] log scale with negative and positive domain gives `NaN` entries

[smarandaparincu]

Steps to reproduce

Try the following code:

import * as React from 'react';
import Box from '@mui/material/Box';
import { LineChart } from '@mui/x-charts/LineChart';

const sample = [-5, 10, 30, 50, 70, 90, 100];

export default function ScaleExample() {
  return (
    <Box sx={{ width: '100%', maxWidth: 500 }}>
      <LineChart
        xAxis={[{ data: sample }]}
        yAxis={[
          { id: 'linearAxis', scaleType: 'linear' },
          { id: 'logAxis', scaleType: 'log' },
        ]}
        series={[
          { yAxisKey: 'linearAxis', data: sample, label: 'linear' },
          { yAxisKey: 'logAxis', data: sample, label: 'log' },
        ]}
        leftAxis="linearAxis"
        rightAxis="logAxis"
        height={400}
      />
    </Box>
  );
}

Current behavior

From debugging the logs, it seems like the reflective function is applied on the positive value of the domain instead of the negative one. This results in the Math.log returning NaN values

Expected behavior

Reflective function should have been applied on the negative part of the domain

Context

No response

Your environment

npx @mui/envinfo

``` Don't forget to mention which browser you used. Output from `npx @mui/envinfo` goes here. ```

Search keywords: mui-x/charts log scale axis

[alexfauquette]

As log(0) = -∞, a log scale domain must be strictly-positive or strictly-negative; the domain must not include or cross zero. A log scale with a positive domain has a well-defined behavior for positive values, and a log scale with a negative domain has a well-defined behavior for negative values. (For a negative domain, input and output values are implicitly multiplied by -1.) The behavior of the scale is undefined if you pass a negative value to a log scale with a positive domain or vice versa.

https://d3js.org/d3-scale/log

You migth be looking to https://d3js.org/d3-scale/symlog that we do not support for now.

I'm quite surprised that you need a log scale with positive and negative values. Except in physics I never saw such graphs. COuld you share what's you're usecase?

[github-actions[bot]]

The issue has been inactive for 7 days and has been automatically closed.