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 2022/06/15 11:06:55 UTC

[GitHub] [echarts] googirle opened a new issue, #17222: [Feature] series label color supports function

googirle opened a new issue, #17222:
URL: https://github.com/apache/echarts/issues/17222

   ### What problem does this feature solve?
   
   Now we can't config the color of label according to the value, since the configuration of color only support constant
   `const option = {
   ...,
   series: [
   {
       label: {
   color: '#eee'
   }
   }
   ]`
   ![image](https://user-images.githubusercontent.com/23491393/173794218-f712d718-cfda-4e84-acc1-3be1c028a9c6.png)
   
   
   ### What does the proposed API look like?
   
   ![image](https://user-images.githubusercontent.com/23491393/173791308-a6b3962e-58b0-460c-81e6-db1c4c5167ef.png)
   such as :
   `option = {
   series: [
   {
   label: {
   color: function (value, index) {
           return value >= 0 ? 'green' : 'red';
       }
   }
   }]`


-- 
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: commits-unsubscribe@echarts.apache.org.apache.org

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] jiawulin001 commented on issue #17222: [Feature] series label color supports function

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

   Thank you, I got what you mean. You want the label color changes as the series data changes.


-- 
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: commits-unsubscribe@echarts.apache.org

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] googirle commented on issue #17222: [Feature] series label color supports function

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

   @jiawulin001  thanks for your suggestion,but I'm afraid I can't get value from series and determine the color with the size of the number


-- 
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: commits-unsubscribe@echarts.apache.org

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] jiawulin001 commented on issue #17222: [Feature] series label color supports function

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

   My proposal is based on the example you give. If that's not the case, can you give a more concrete or precise example so we can better understand your requirement?


-- 
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: commits-unsubscribe@echarts.apache.org

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] googirle commented on issue #17222: [Feature] series label color supports function

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

   @jiawulin001 
   For example a histogram, I want the label of  each column to be red when the number of it is greater than 10 and be blue  when less than 5, otherwise gray. Just like the second chart above. 
   I think the option should be like 
   ```js
   option = { 
   series: [{ 
     label: { 
       color: (value, index) => return value >= 10 ? 'red' : value <= 5 ? 'blue' : 'gray'
     }
   }]
   ```


-- 
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: commits-unsubscribe@echarts.apache.org

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] jiawulin001 commented on issue #17222: [Feature] series label color supports function

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

   You don't need a new feature to do this. Try using [**Template String**](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Template_literals) which allows you to use `${expression}` in string.
   You can refer to the demo below and try altering the value of `num`:
   <details>
   <summary>Code Sample</summary>
   
   ```
   const num = -5;
   option = {
     xAxis: {
       type: 'category',
       data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']
     },
     yAxis: {
       type: 'value'
     },
     series: [
       {
         data: [120, 200, 150, 80, 70, 110, 130],
         type: 'bar',
         showBackground: true,
         backgroundStyle: {
           color: 'rgba(180, 180, 180, 0.2)'
         },
         label:{
           show: true,
           color:`${num > 0 ? 'red' : 'blue'}`
         }
       }
     ]
   };
   ```
   </details>


-- 
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: commits-unsubscribe@echarts.apache.org

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] googirle commented on issue #17222: [Feature] series label color supports function

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

   @jiawulin001 Yes, my thoughts exactly.


-- 
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: commits-unsubscribe@echarts.apache.org

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