line chart x-axis order field that number and string concat has problem

[psongyoo]

Bug description

I need field number and string concat to x-axis but I have problem to order it
example: 1a ,2b, 10c line chart order x-axis that order by 1a, 10c, 2b

Screenshots/recordings

No response

Superset version

master / latest-dev

Python version

3.9

Node version

16

Browser

Chrome

Additional context

No response

Checklist

• I have searched Superset docs and Slack and didn't find a solution to my problem.
• I have searched the GitHub issue tracker and didn't find a similar bug report.
• I have checked Superset's logs for errors and if I found a relevant Python stacktrace, I included it here as text in the "additional context" section.

[dosubot]

To correctly order a line chart's x-axis when concatenating numbers and strings, such as "1a", "2b", and "10c", in Superset version master/latest-dev, you should use the forceCategorical control. This control allows you to make the x-axis categorical, which is suitable for non-numeric, mixed-type data like "1a", "2b", and "10c".

Here's the relevant configuration:

export const forceCategorical: ControlSetItem = {
  name: 'forceCategorical',
  config: {
    type: 'CheckboxControl',
    label: t('Force categorical'),
    default: false,
    renderTrigger: true,
    description: t('Make the x-axis categorical'),
  },
};

By enabling the forceCategorical option, the x-axis will treat the values as categorical data, ensuring they are ordered correctly based on their string values rather than numerically ^[1].

To continue talking to Dosu, mention @dosu.

---

^{Help Dosu learn! Give it feedback: Great Response | Irrelevant Answer | Incorrect Sources | Too Verbose | Hallucination | Other}

[psongyoo]

Now , I use 4.1.1 version that have forceCategorical and if not How can i upate it I use docker?

[dosubot]

Yes, Superset version 4.1.1 includes the forceCategorical option. The forceCategorical control is defined as a CheckboxControl in the controls.tsx file, allowing you to make the x-axis categorical ^[1].

If you need to update Superset using Docker, follow these steps:

1. Shut down the running containers in Docker Compose:

   docker compose down

2. Update the folder that mirrors the superset repo through git:

   git pull origin master

3. Restart the containers, and any changed Docker images will be automatically pulled down:

   docker compose up

However, since the forceCategorical option is already present in version 4.1.1, no update is necessary for this feature ^[2].

To continue talking to Dosu, mention @dosu.

---

^{Help Dosu learn! Give it feedback: Great Response | Irrelevant Answer | Incorrect Sources | Too Verbose | Hallucination | Other}

[psongyoo]

Sorry , I'm newbie apache superset. I can not find checkbox UI for enable it. Cloud you please step by step for set it?

[dosubot]

To enable the forceCategorical option in the Superset UI, follow these steps:

1. Open Superset and Log In: Start by logging into your Superset instance.

2. Navigate to Charts: Go to the "Charts" section from the main menu.

3. Create or Edit a Chart: Either create a new chart or edit an existing one. If you're creating a new chart, select the dataset you want to use and choose the "Line Chart" visualization type.

4. Access Chart Controls: Once you're in the chart creation or editing interface, look for the "Customize" or "Chart Options" panel. This is where you can configure various settings for your chart.

5. Find the forceCategorical Option: In the chart controls, look for a checkbox labeled "Force categorical" or something similar. This option is typically found under the x-axis settings or general chart settings.

6. Enable the Checkbox: Check the "Force categorical" checkbox to enable it. This will treat the x-axis values as categorical, ensuring they are ordered based on their string values.

7. Save and Refresh: After enabling the option, save your changes and refresh the chart to see the updated order on the x-axis.

If you don't see the "Force categorical" option, ensure that your Superset version is up-to-date and that the chart type you're using supports this feature.

To continue talking to Dosu, mention @dosu.

---

^{Help Dosu learn! Give it feedback: Great Response | Irrelevant Answer | Incorrect Sources | Too Verbose | Hallucination | Other}

[psongyoo]

Sorry I can not found Force categorical" checkbox in Superset UI in version 4.1.1 in Line Chart. How can i check it? or custom it?

[dosubot]

To find or customize the "Force categorical" checkbox in the Superset UI for a Line Chart in version 4.1.1, you can refer to the following code snippet from the customControls.tsx file:

export const xAxisForceCategoricalControl = {
  name: 'xAxisForceCategorical',
  config: {
    type: 'CheckboxControl',
    label: () => t('Force categorical'),
    default: false,
    description: t('Treat values as categorical.'),
    initialValue: (control: ControlState, state: ControlPanelState | null) =>
      state?.form_data?.x_axis_sort !== undefined || control.value,
    renderTrigger: true,
    visibility: ({ controls }: { controls: ControlStateMapping }) =>
      checkColumnType(
        getColumnLabel(controls?.x_axis?.value as QueryFormColumn),
        controls?.datasource?.datasource,
        [GenericDataType.Numeric],
      ),
    shouldMapStateToProps: () => true,
  },
};

This code defines the "Force categorical" checkbox control. You can customize its properties such as default, label, and description to suit your needs. Additionally, the visibility and initialValue properties determine when the checkbox is visible and its initial state based on the current form data ^[1].

If you cannot find this option in the UI, ensure that your Superset instance is correctly configured to display this control, and check if any customizations or restrictions might be hiding it.

To continue talking to Dosu, mention @dosu.

---

^{Help Dosu learn! Give it feedback: Great Response | Irrelevant Answer | Incorrect Sources | Too Verbose | Hallucination | Other}