visualMap labels misaligned

[jimivdw]

Version

4.8.0

Steps to reproduce

1. Go to https://echarts.apache.org/examples/en/editor.html?c=heatmap-large-piecewise
2. Set option.visualMap.textStyle to {fontWeight: "lighter"}
3. (optional, to emphasise the issue): set option.textGap to -10

What is expected?

Label is aligned in vertical middle of the item icon

What is actually happening?

Label is aligned higher (at top?)

vs.

---

The actual issue I'm having is not with using a different font weight, but rather with a different font family that happens to have a different default height. I did find out however that the issue also occurs with the "lighter" font weight of the default font, which was easier to reproduce.

Setting a different value for lineHeight has no effect (could be that that is in fact the problem).

I'd also be fine with having an option to explicitly set the padding of the text label (in the textStyle), like you can already do for the legend.

[echarts-bot[bot]]

Hi! We've received your issue and please be patient to get responded. 🎉 The average response time is expected to be within one day for weekdays.

In the meanwhile, please make sure that you have posted enough image to demo your request. You may also check out the API and chart option to get the answer.

If you don't get helped for a long time (over a week) or have an urgent question to ask, you may also send an email to [email protected]. Please attach the issue link if it's a technical questions.

If you are interested in the project, you may also subscribe our mail list.

Have a nice day! 🍵

[Ovilia]

This is probably caused by font baseline position of different font weight on different platforms. For example, I cannot reproduce it on Mac.

There's nothing really we can do about this. Perhaps you can try with another font.

[jimivdw]

Hi @Ovilia , thanks for your quick reply.

Strange that you cannot reproduce it, I'm also on Mac myself (Mojave 10.14.6).

Also, why is there nothing you can do about this? There should be some way to compensate for different baseline positions of different fonts. Maybe not automatically, but setting a different lineHeight or manually specifying some top padding should be able to do the trick imho.

[Ovilia]

@jimivdw Would it help if we could provide something like offsetX and offsetY to adjust text position?

[jimivdw]

Yes, that would help 😊

[Nurech]

@jimivdw Would it help if we could provide something like offsetX and offsetY to adjust text position?

Is there any news on this? Looking over the docs I guess piece label can not be customized? https://echarts.apache.org/en/option.html#visualMap-piecewise.pieces

[github-actions[bot]]

This issue has been automatically marked as stale because it did not have recent activity. It will be closed in 7 days if no further activity occurs. If you wish not to mark it as stale, please leave a comment in this issue.

[github-actions[bot]]

This issue has been automatically closed because it did not have recent activity. If this remains to be a problem with the latest version of Apache ECharts, please open a new issue and link this to it. Thanks!