dosubot[bot] commented on issue #29877:
URL: https://github.com/apache/superset/issues/29877#issuecomment-2272511789
<!-- Greeting -->
Hey there, @Candyman1406! 👋 I'm here to help you out with any bugs,
questions, or contributions you might have. Let's squash those bugs together!
<!-- Answer -->
To fix the issue where x-axis and y-axis labels get removed upon editing in
an Echarts bar chart, and the x-axis label rotation does not function properly,
ensure that the `renderTrigger` property is set to `true` for the relevant
controls. This property ensures that the chart re-renders when the control
value changes.
Here is the relevant part of the configuration for the x-axis and y-axis
labels and their rotations:
```tsx
const config: ControlPanelConfig = {
controlPanelSections: [
// Other sections...
{
label: t('X Axis'),
expanded: true,
controlSetRows: [
[
{
name: 'x_axis_label',
config: {
type: 'TextControl',
label: t('X Axis Title'),
renderTrigger: true, // Ensure this is set to true
default: '',
},
},
],
[
{
name: 'xAxisLabelRotation',
config: {
type: 'SelectControl',
freeForm: true,
clearable: false,
label: t('Rotate x axis label'),
choices: [
[0, '0°'],
[45, '45°'],
],
default: 0, // Default rotation value
renderTrigger: true, // Ensure this is set to true
description: t('Input field supports custom rotation. e.g. 30
for 30°'),
},
},
],
// Other controls...
],
},
{
label: t('Y Axis'),
expanded: true,
controlSetRows: [
[
{
name: 'y_axis_label',
config: {
type: 'TextControl',
label: t('Y Axis Title'),
renderTrigger: true, // Ensure this is set to true
default: '',
},
},
],
[
{
name: 'yAxisLabelRotation',
config: {
type: 'SelectControl',
freeForm: true,
clearable: false,
label: t('Rotate y axis label'),
choices: [
[0, '0°'],
[45, '45°'],
],
default: 0, // Default rotation value
renderTrigger: true, // Ensure this is set to true
description: t('Input field supports custom rotation. e.g. 30
for 30°'),
},
},
],
// Other controls...
],
},
],
};
```
Ensure that `renderTrigger: true` is set for both `x_axis_label`,
`xAxisLabelRotation`, `y_axis_label`, and `yAxisLabelRotation` controls. This
will make sure that the chart re-renders correctly when these values are
changed, thus fixing the issue with labels being removed and the x-axis label
rotation not functioning properly.
Additionally, ensure that the `xAxis` and `yAxis` configurations in the
Echarts options are correctly set to handle the label rotations and titles.
Here is an example of how to configure these options:
```ts
const echartOptions: EChartsOption = {
xAxis: {
type: 'category',
name: xAxisLabel,
nameGap: convertInteger(xAxisTitleMargin),
nameLocation: 'middle',
axisLabel: {
rotate: xAxisLabelRotation,
},
// Other xAxis configurations...
},
yAxis: {
type: 'value',
name: yAxisLabel,
nameGap: convertInteger(yAxisTitleMargin),
nameLocation: 'middle',
// Other yAxis configurations...
},
// Other Echarts options...
};
```
By ensuring that both the control panel configuration and the Echarts
options are correctly set, you can resolve the issues with label removal and
x-axis label rotation
<sup>[[1]](https://github.com/apache/superset/blob/master/superset-frontend/plugins/plugin-chart-echarts/src/Bubble/controlPanel.tsx)</sup><sup>[[2]](https://github.com/apache/superset/blob/master/superset-frontend/plugins/plugin-chart-echarts/src/MixedTimeseries/transformProps.ts)</sup><sup>[[3]](https://github.com/apache/superset/blob/master/superset-frontend/plugins/plugin-chart-echarts/src/Waterfall/transformProps.ts)</sup>.
<!-- Dosu Comment Footer -->
*To continue talking to [Dosu](https://dosu.dev), mention @dosu.*
--
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
To unsubscribe, e-mail: notifications-unsubscr...@superset.apache.org
For queries about this service, please contact Infrastructure at:
us...@infra.apache.org
---------------------------------------------------------------------
To unsubscribe, e-mail: notifications-unsubscr...@superset.apache.org
For additional commands, e-mail: notifications-h...@superset.apache.org
