You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@echarts.apache.org by GitBox <gi...@apache.org> on 2021/01/26 05:39:31 UTC

[GitHub] [echarts] gregdeane opened a new issue #14121: Legend symbol/label are misaligned in some cases

gregdeane opened a new issue #14121:
URL: https://github.com/apache/echarts/issues/14121


   ### Version
   5.0.1
   
   ### Steps to reproduce
   1. Create any chart with a legend
   2. Use the option values below
   3. The use of "Hind" for `fontFamily` is important here
   
   ```javascript
   {
     ...
     icon: 'circle',
     itemWidth: 8,
     itemHeight: 8,
     textStyle: {
       fontFamily: 'Hind',
       fontSize: 12
     }
     ...
   }
   ```
   
   ### What is expected?
   It is expected that the symbol (circle) and the label are vertically-aligned with each other.
   
   ### What is actually happening?
   When using "Hind" as the font family, the symbol and label are not vertically-aligned with one another. Other fonts (including custom fonts) do not have this issue. I tried modifying nearly all related options, including trying to "hack" together something that forced the label and symbol to align but nothing worked.
   
   v4 of eCharts worked fine for the "Hind" font so it's something to do with v5.
   
   ---
   After upgrading to v5, the legend symbol/labels were no longer aligned. We had been using v4 for 2-3 years with no problem.
   
   ## Screenshots
   ### Notice how the symbol (circle) and the label are not vertically-aligned with one another ("Hind" font)
   ![Screenshot 2021-01-26 at 06 21 43](https://user-images.githubusercontent.com/4949000/105804602-7ce94300-5fa0-11eb-93f6-3cc1b4887d5d.png)
   
   ### Notice when using other fonts (Montserrat and default font, respectively), the symbol and labels are perfectly aligned
   ![Screenshot 2021-01-26 at 06 23 35](https://user-images.githubusercontent.com/4949000/105804635-95f1f400-5fa0-11eb-9299-77012d62b632.png)
   
   ![Screenshot 2021-01-26 at 06 24 54](https://user-images.githubusercontent.com/4949000/105804641-9a1e1180-5fa0-11eb-96c0-9b1a0a999e7b.png)
   
   
   <!-- This issue is generated by echarts-issue-helper. DO NOT REMOVE -->
   <!-- This issue is in English. DO NOT REMOVE -->


----------------------------------------------------------------
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.

For queries about this service, please contact Infrastructure at:
users@infra.apache.org



---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org

[GitHub] [echarts] Ovilia commented on issue #14121: Legend symbol/label are misaligned in some cases

Posted by GitBox <gi...@apache.org>.
Ovilia commented on issue #14121:
URL: https://github.com/apache/echarts/issues/14121#issuecomment-770523359


   Legend text uses `'middle'` for vertical text align. So this is probably because the middle line of "Hind" is higher than the others. I tested both 4.x and 5.x and they both have similar result, so this should not be an issue of ECharts.
   
   ![4.x](https://user-images.githubusercontent.com/779050/106408235-fe494580-6478-11eb-8e7d-17d993e40873.png)
   ![5.x](https://user-images.githubusercontent.com/779050/106408246-04d7bd00-6479-11eb-8c15-d26c2cc15106.png)
   
   A simple way to adjust the position would be using [padding](https://echarts.apache.org/en/option.html#legend.padding).
   


----------------------------------------------------------------
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.

For queries about this service, please contact Infrastructure at:
users@infra.apache.org



---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org

[GitHub] [echarts] gregdeane edited a comment on issue #14121: Legend symbol/label are misaligned in some cases

Posted by GitBox <gi...@apache.org>.
gregdeane edited a comment on issue #14121:
URL: https://github.com/apache/echarts/issues/14121#issuecomment-773088516


   Thank you for the suggestion @Ovilia. Unfortunately, `padding` doesn't fix the issue. I tried padding on the legend itself and padding on `textStyle`. Neither of them affect the text in any helpful way.
   
   In the screenshot below, the red border indicates legend padding and the blue border indicates textStyle padding. Instead of pushing the text up or down, padding is simply added above or below.
   
   Perhaps a `margin` setting for `textStyle` could be helpful? Or any other setting that allows direct control of the placement of the text.
   
   Any thoughts or suggestions are appreciated.
   
   ![Screenshot 2021-02-04 at 08 10 35](https://user-images.githubusercontent.com/4949000/106857763-e5cb6c00-66c0-11eb-8812-290f8321e082.png)
   


----------------------------------------------------------------
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.

For queries about this service, please contact Infrastructure at:
users@infra.apache.org



---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org

[GitHub] [echarts] gregdeane commented on issue #14121: Legend symbol/label are misaligned in some cases

Posted by GitBox <gi...@apache.org>.
gregdeane commented on issue #14121:
URL: https://github.com/apache/echarts/issues/14121#issuecomment-802615441


   Hello, just following up on this. It's labeled as "not-a-bug" but @Ovilia's suggestion does not work. If there is no solution to the issue, then I believe this _is_ a bug.
   
   Can someone please reply with a way to address the issue in the initial comment?


-- 
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.

For queries about this service, please contact Infrastructure at:
users@infra.apache.org



---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org

[GitHub] [echarts] gregdeane edited a comment on issue #14121: Legend symbol/label are misaligned in some cases

Posted by GitBox <gi...@apache.org>.
gregdeane edited a comment on issue #14121:
URL: https://github.com/apache/echarts/issues/14121#issuecomment-773088516


   Thank you for the suggestion @Ovilia. Unfortunately, `padding` doesn't fix the issue. I tried padding on the legend itself and padding on `textStyle`. Neither of them affect the text in any helpful way.
   
   In the screenshot below, the red border indicates legend padding and the blue border indicates textStyle padding. Instead of pushing the text up or down, padding is simply added above or below.
   
   Perhaps a `margin` setting for `textStyle` could be helpful? Or any other setting that allows direct control of the placement of the text.
   
   Any thoughts or suggestions are appreciated.
   
   ![Screenshot 2021-02-04 at 08 10 35](https://user-images.githubusercontent.com/4949000/106857763-e5cb6c00-66c0-11eb-8812-290f8321e082.png)
   


----------------------------------------------------------------
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.

For queries about this service, please contact Infrastructure at:
users@infra.apache.org



---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org

[GitHub] [echarts] echarts-bot[bot] commented on issue #14121: Legend symbol/label are misaligned in some cases

Posted by GitBox <gi...@apache.org>.
echarts-bot[bot] commented on issue #14121:
URL: https://github.com/apache/echarts/issues/14121#issuecomment-767309242


   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](http://echarts.apache.org/api.html) and [chart option](http://echarts.apache.org/option.html) 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 dev@echarts.apache.org. Please attach the issue link if it's a technical question.
   
   If you are interested in the project, you may also subscribe our [mailing list](https://echarts.apache.org/en/maillist.html).
   
   Have a nice day! 🍵


----------------------------------------------------------------
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.

For queries about this service, please contact Infrastructure at:
users@infra.apache.org



---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org

[GitHub] [echarts] gregdeane commented on issue #14121: Legend symbol/label are misaligned in some cases

Posted by GitBox <gi...@apache.org>.
gregdeane commented on issue #14121:
URL: https://github.com/apache/echarts/issues/14121#issuecomment-784765498


   @Ovilia Any thoughts or suggestions on my [comment above](https://github.com/apache/echarts/issues/14121#issuecomment-773088516)?


----------------------------------------------------------------
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.

For queries about this service, please contact Infrastructure at:
users@infra.apache.org



---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org

[GitHub] [echarts] gregdeane commented on issue #14121: Legend symbol/label are misaligned in some cases

Posted by GitBox <gi...@apache.org>.
gregdeane commented on issue #14121:
URL: https://github.com/apache/echarts/issues/14121#issuecomment-773088516


   Thank you for the suggestion @Ovilia. Unfortunately, `padding` doesn't fix the issue. I tried both padding on the legend itself and padding on `textStyle`. Neither of them affect the text in any helpful way.
   
   In the screenshot below, the red border indicates legend padding and the blue border indicates textStyle padding. Instead of pushing the text up or down, padding is simply added above or below.
   
   Perhaps a `margin` setting for `textStyle` could be helpful? Or any other setting that allows direct control of the placement of the text.
   
   Any thoughts or suggestions are appreciated.
   
   ![Screenshot 2021-02-04 at 08 10 35](https://user-images.githubusercontent.com/4949000/106857763-e5cb6c00-66c0-11eb-8812-290f8321e082.png)
   


----------------------------------------------------------------
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.

For queries about this service, please contact Infrastructure at:
users@infra.apache.org



---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org

[GitHub] [echarts] gregdeane commented on issue #14121: Legend symbol/label are misaligned in some cases

Posted by GitBox <gi...@apache.org>.
gregdeane commented on issue #14121:
URL: https://github.com/apache/echarts/issues/14121#issuecomment-773088516


   Thank you for the suggestion @Ovilia. Unfortunately, `padding` doesn't fix the issue. I tried both padding on the legend itself and padding on `textStyle`. Neither of them affect the text in any helpful way.
   
   In the screenshot below, the red border indicates legend padding and the blue border indicates textStyle padding. Instead of pushing the text up or down, padding is simply added above or below.
   
   Perhaps a `margin` setting for `textStyle` could be helpful? Or any other setting that allows direct control of the placement of the text.
   
   Any thoughts or suggestions are appreciated.
   
   ![Screenshot 2021-02-04 at 08 10 35](https://user-images.githubusercontent.com/4949000/106857763-e5cb6c00-66c0-11eb-8812-290f8321e082.png)
   


----------------------------------------------------------------
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.

For queries about this service, please contact Infrastructure at:
users@infra.apache.org



---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org