dosubot[bot] commented on issue #29877:
URL: https://github.com/apache/superset/issues/29877#issuecomment-2272528980
<!-- Answer -->
If the `renderTrigger` property is already set to `true` and the Echarts
options are correctly configured, the issue might be related to how the state
is managed or how the Echarts options are applied. Here are a few additional
steps to troubleshoot and resolve the issue:
1. **Check Control Configurations**:
Ensure that the `xAxisLabelRotation` and `yAxisLabelRotation` controls
are correctly imported and configured. Verify that they are defined as follows
in `superset-frontend/plugins/plugin-chart-echarts/src/controls.tsx`:
```tsx
export const xAxisLabelRotation = {
name: 'xAxisLabelRotation',
config: {
type: 'SelectControl',
freeForm: true,
clearable: false,
label: t('Rotate x axis label'),
choices: [
[0, '0°'],
[45, '45°'],
[90, '90°'],
],
default: 0,
renderTrigger: true,
description: t('Input field supports custom rotation. e.g. 30 for
30°'),
},
};
```
2. **Verify `transformProps` Function**:
Double-check the implementation of the `transformProps` function in
`superset-frontend/plugins/plugin-chart-echarts/src/Timeseries/transformProps.ts`
to ensure that the x-axis and y-axis configurations are correctly applied.
Here is a relevant snippet:
```ts
const echartOptions: EChartsCoreOption = {
xAxis: {
type: 'category',
name: xAxisTitle,
nameGap: convertInteger(xAxisTitleMargin),
nameLocation: 'middle',
axisLabel: {
rotate: xAxisLabelRotation,
},
// Other xAxis configurations...
},
yAxis: {
type: 'value',
name: yAxisTitle,
nameGap: convertInteger(yAxisTitleMargin),
nameLocation: 'middle',
// Other yAxis configurations...
},
// Other Echarts options...
};
```
3. **Event Listeners and Lifecycle Methods**:
Ensure that there are no event listeners or lifecycle methods interfering
with the rendering of the x-axis and y-axis labels and their rotations. For
example, the `rotateLabels` function in `d3.parcoords.js` handles the rotation
of dimension titles based on mouse wheel events:
```js
function rotateLabels() {
var delta = d3.event.deltaY;
delta = delta < 0 ? -5 : delta;
delta = delta > 0 ? 5 : delta;
__.dimensionTitleRotation += delta;
pc.svg
.selectAll('text.label')
.attr(
'transform',
'translate(0,-5) rotate(' + __.dimensionTitleRotation + ')',
);
d3.event.preventDefault();
}
```
This function updates the `__.dimensionTitleRotation` property and
applies the rotation transformation to the text labels. Ensure that such event
listeners are not conflicting with your chart's configuration
<sup>[[1]](https://github.com/apache/superset/blob/master/superset-frontend/plugins/legacy-plugin-chart-parallel-coordinates/src/vendor/parcoords/d3.parcoords.js)</sup>.
4. **Debug State Management**:
If the above configurations are correct and the issue still exists, it
might be necessary to debug the specific implementation details or state
management in the Superset frontend. Ensure that the state updates are
correctly triggering re-renders and that the Echarts options are being applied
as expected.
By following these steps, you should be able to identify and resolve the
issue with the x-axis and y-axis labels and their rotations.
<!-- 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
