[PROPOSAL] More powerful formatters: pipes

[Ovilia]

What problem does this feature solve?

ECharts has many formatter options, which provides a flexible display method in both forms of string and function.

In some cases, function is not applicative, like formatters in theme or in Baidu Smart App.
So, I'd suggest we provide some frequently used pipes so that users can use it in string format.

What does the proposed API look like?

• {a | thousandSeparator} kg: if {a} is 1234567, the output is 1,234,567 kg.
• {b | decimalPlaces: 2}cm: if {b} is 12.3456, the output is 12.34cm.
• ...

[echarts-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 dev@echarts.apache.org. 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! 🍵

[100pah]

The grammar {a | method} conflicts with rich text ({styleName|real text}).
Probably it needs to consider another grammar.

// (A) ?
formatter: '{a : method1 : method2(123)}' 
formatter: 'xxxx {style1|{a : method1 : method2(123)}}' // in rich text
formatter: 'xxxx {style1|yyyy} {a : method1 : method2(123)}' // in rich text

// (B) ?
formatter: '{a => method1 => method2(123)}' 
formatter: 'xxxx {style1|{a => method1 => method2(123)}}' // in rich text
formatter: 'xxxx {style1|yyyy} {a => method1 => method2(123)}' // in rich text

// (C) ?
formatter: '{a # method1 # method2(123)}' 
formatter: 'xxxx {style1|{a # method1 # method2(123)}}' // in rich text
formatter: 'xxxx {style1|yyyy} {a # method1 # method2(123)}' // in rich text

// (D) ?
formatter: '{a $ method1 $ method2(123)}' 
formatter: 'xxxx {style1|{a $ method1 $ method2(123)}}' // in rich text
formatter: 'xxxx {style1|yyyy} {a $ method1 $ method2(123)}' // in rich text

We'd better avoid common calculation characters are used as delimiter.
And we may also need to consider some how it makes break change and how to escape functional characters like
{ } |

[Ovilia]

I don't think it's a good idea to use other separators rather than | because | is more commonly used and thus makes users understand it better.
As for the rich text conflict, I think maybe we can use special formatter name for built-in pipes like {a | $thousandSeparator} kg or {a | #thousandSeparator} kg.

[100pah]

But we can not tell which is rich text and and which is pipe.

formatter: 'xxxx {style1 | $money} {a | $thousandSeparator}' 

[Ovilia]

We can check if it's a pipe name. If not, it's rich.