[Bug] VisualMap with string category not working
- Dominant language
- TypeScript
- Stars
- 67.3k
- Forks
- 19.8k
- Avg merge
- 11d 14h
- Merged PRs (30d)
- 8
Description
### Version
5.3.3
### Link to Minimal Reproduction
[repro link](https://echarts.apache.org/examples/en/editor.html?c=dataset-encode0&code=PYBwLglsB2AEC8sDeAoWsAmBDMWDOApmAFzJrqx7ACuATgMYGkDa5FszA5HvcLQZwA0sTlgC2NaGCEiQtYBmr1pAXUFsKzABwBOAHQBmYQFYtAJgCMZ4ZwCyOegAsssADI4wAtRvTNjAdj0LYX9zYwAWG1sIABsAa1gAFQIsTm92X39wvUjYcIsABgNrEQBhRwICQlhS4F5U9Iy_AqDhK39jYxtyyuqAIXkAd2gIL3UMjl09f2EzAotwrpF7MCcXWvq08aaANi1W2H8dBZ2bZIbt9mYLfVPYY61jEs4AeVosaABzAlgAKWoIIwtj4OIU9HdChZHs9XAQJHB_oCxiDmMVprN5lYbAB1LAxaDUMCwAbAYajNIaFTkAC-20-tAgGFISFgvCkWAg0HcACMCDFSGBaNQfrTyAAPACCYogeGZsGg4iYInEkmksFF6AAnlKZXKwJqQErOPQcARPnxNZx1dsAG4y6h4-wgZkafWG0gAIhAo0YgxlBA9l1ZpvNDKqLDssQS52B7BiBAAZiQRIwpARaEJXQQxcmuAAJCCfRywADKvH4Mk4rlJpfLyPYAHoG7AnbAwBVKHXWcAYtQxHAwMBuzE-BoMBAxARoHgoNBSNYNJyAEofb4uia8Ee0UicADEADF96UAKIGcKcDQaig0MAvBMrr5K1Abnt8He7nbGPqmCwX9jUmltkIMNZQ4DRnwyN0jW5LAMyDdAp14DAnxBdAmxbLAQDbDsPRVagpA9Yc-wHIcAA1YCwaU8D0VDYDFHc8KkTMJjQ5tW3bH4vXkRRlEIzdiLbIcAE0KKo2jNR3OQFCUaQQQA_9yCpakAG4gA)
### Steps to Reproduce
When using visualMap with categories set to strings I cannot get the bar charts to paint the `inRange` bars. This is the config I use:
```
option = {
dataset: {
source: [
['score', 'amount', 'product'],
[89.3, 58212, 'Matcha Latte'],
[57.1, 78254, 'Milk Tea'],
[74.4, 41032, 'Cheese Cocoa'],
[50.1, 12755, 'Cheese Brownie'],
[89.7, 20145, 'Matcha Cocoa'],
[68.1, 79146, 'Tea'],
[19.6, 91852, 'Orange Juice'],
[10.6, 101852, 'Lemon Juice'],
[32.7, 20112, 'Walnut Brownie']
]
},
grid: { containLabel: true },
xAxis: { name: 'amount' },
yAxis: { type: 'category' },
visualMap: {
type: "piecewise",
categories: ['Milk Tea'],
left: 'center',
text: ['High Score', 'Low Score'],
// Map the score column to color
dimension: 2,
inRange: {
color: '#FFCE34'
},
outOfRange: {
color: '#65B581'
}
},
series: [
{
type: 'bar',
encode: {
// Map the "amount" column to X axis.
x: 'amount',
// Map the "product" column to Y axis
y: 'product'
}
}
]
};
```
If instead I use a numeric value in categories (such as using `dimension: 0` and `categories: [89.3]`) it paints the bar correctly. You can view a demo of the problem in the current behavior section.
If I use another column as the category axis the value map works. ([reproduction link](https://echarts.apache.org/examples/en/editor.html?c=dataset-encode0&code=PYBwLglsB2AEC8sDeAoWsAmBDMWDOApmAFzJrqx7ACuATgMYGkDa5FszA5HvcLQZwA0sTlgC2NaGCEiQtYBmr1pAXUFsKzABwBOAHQBmYQFYtAJgCMZ4ZwCyOegAsssADI4wAtRvTNjAdj0LYX9zYwAWG1sIABsAa1gAFQIsTm92X39wvUjYcIsABgNrEQBhRwICQlhS4F5U9Iy_AqDhK39jYxtyyuqAIXkAd2gIL3UMjl09f2EzAotwrpF7MCcXWvq08aaANi1W2H8dBZ2bZIbt9mYLfVPYY61jEs4AeVosaABzAlgAKWoIIwtj4OIU9HdChZHs9XAQJHB_oCxiDmMVprN5lYbAB1LAxaDUMCwAbAYajNIaFTkAC-20-tAgGFISFgvCkWAg0HcACMCDFSGBaNQfrTyAAPACCYogeGZsGg4iYInEkmksFF6AAnlKZXKwJqQErOPQcARPnxNZx1dsAG4y6h4-wgZkafWG0gAIhAo0YgxlBA9l1ZpvNDKqLDssQS52B7BiBAAZiQRIwpARaEJXQQxcmuAAJCCfRywADKvH4Mk4rlJpfLyPYAHoG7AnbAwBVKHXWcAYtQxHAwMBuzE-BoMBAxARoHgoNBSNYNJyAEofb4uia8Ee0UicADEADF96UAKIGcKcDQaig0MAvBMrr5K1Abnt8He7nbGPqmCwX9jUmltkIMNZQ4DRnwyN0jW5LAMyDdAp14DAnxBdAmxbLAQDbDsPRVagpA9Yc-wHIcAA1YCwaU8D0VDYDFHc8KkTMJjQ5tW3bH4vXkRRlEIzdiLbIcAE0KKo2jNR3Hg-AEEEAP_cgqWpABuIA))
The strange thing is that if I duplicate the category column in data and use that to do the valueMap it works ([repro link](https://echarts.apache.org/examples/en/editor.html?c=dataset-encode0&code=PYBwLglsB2AEC8sDeAoWsAmBDMWDOApmAFzJrqx7ACuATgMYGkDa5FszA5HvcLQZwA0sTlgC2NaGCEiQtYBmr1pAXUFsKzABwBOAHQBmYQFYtAJgCMZ4ZwCyOegAsssADI4wAtRvTNjAdj0LYX9zYwAWG1sIABsAa1gAFQIsTm92X39wvUjYcIsABgNrEQBhRwICQlhS4F5U9Iy_AqDhK39jYxtyyuqAIXkAd2gIL3UMjl09f2EzAotwrpF7MCcXWvq08aaANi1W2H8dBZ2bZIbt9mYLfVPYY61jEs4AeVosaABzAlgAKWoIIwtj4OIU9HdChZHs9XAQJHB_oCxiDmMVprN5lYbAB1LAxaDUMCwAbAYajNIaFTkAC-20-tAgGFISFgvCkWAg0HcACMCDFSGBaNQfrTyAAPACCYogeGZsGg4iYInEkmksFF6AAnlKZXKwJqQErOPQcARPnxNZx1dsAG4y6h4-wgZkafWG0gAIhAo0YgxlBA9l1ZpvNDKqLDssQS52B7BiBAAZiQRIwpARaEJXQQxcmuAAJCCfRywADKvH4Mk4rlJpfLyPYAHoG7AnbAwBVKHXWcAYtQxHAwMBuzE-BoMBAxARoHgoNBSNYNJyAEofb4uia8Ee0UicADEADF96UAKIGcKcDQaig0MAvBMrr5K1Abnt8He7nbGPqmCwX9jUmltkIMNZQ4DRnwyN0jW5LAMyDdAp14DAnxBdAmxbLAQDbDsPRVagpA9Yc-wHIcAA1YCwaU8D0VDYDFHc8KkTMJjQ5tW3bH4vXkRRlEIzdiLbIcAE0KKo2jNR3OQFCUaQQQA_9yCpakAG4gA)). So it looks like it might be related to the fact that the data column is being used in the axis
The same can be reproduced with the scatter chart
### Current Behavior
[Using a number in categories reproduction](https://echarts.apache.org/examples/en/editor.html?c=dataset-encode0&code=PYBwLglsB2AEC8sDeAoWsAmBDMWDOApmAFzJrqx7ACuATgMYGkDa5FszA5HvcLQZwA0sTlgC2NaGCEiQtYBmr1pAXUFsKzABwBOAHQBmYQFYtAJgCMZ4ZwCyOegAsssADI4wAtRvTNjAdj0LYX9zYwAWG1sIABsAa1gAFQIsTm92X39wvUjYcIsABgNrEQBhRwICQlhS4F5U9Iy_AqDhK39jYxtyyuqAIXkAd2gIL3UMjl09f2EzAotwrpF7MCcXWvq08aaANi1W2H8dBZ2bZIbt9mYLfVPYY61jEs4AeVosaABzAlgAKWoIIwtj4OIU9HdChZHs9XAQJHB_oCxiDmMVprN5lYbAB1LAxaDUMCwAbAYajNIaFTkAC-20-tAgGFISFgvCkWAg0HcACMCDFSGBaNQfrTyAAPACCYogeGZsGg4iYInEkmksFF6AAnlKZXKwJqQErOPQcARPnxNZx1dsAG4y6h4-wgZkafWG0gAIhAo0YgxlBA9l1ZpvNDKqLCmBka6BiBAAZiQRIwpARaEJXQQxYmuAAJCCfRywADKvH4Mk4rlJxdLyPYAHo67AnbAwBVKDXWcAYtQxHAwMBOzE-BoMBAxARoHgoNBSAUg5yAEofb4uia8Ie0UicADEADFd6UAKIGcKcDQaig0MAvONLr5K1Brrt8LfbnbGPqmCxn9jUmnbQgw1lDgNEfDI3SNbksDTIN0AnXgMAfEF0AbJssBAFs2w9FVqCkD1Bx7PsBwADVgLBpTwPRkNgMUtxwqR0wmFDG2bVsfi9eRFGUfD10IlsBwATTIijqM1Lc5AUJRpBBP9f3IKlqQAbiAA)

[Using a string in categories reproduction](https://echarts.apache.org/examples/en/editor.html?c=dataset-encode0&code=PYBwLglsB2AEC8sDeAoWsAmBDMWDOApmAFzJrqx7ACuATgMYGkDa5FszA5HvcLQZwA0sTlgC2NaGCEiQtYBmr1pAXUFsKzABwBOAHQBmYQFYtAJgCMZ4ZwCyOegAsssADI4wAtRvTNjAdj0LYX9zYwAWG1sIABsAa1gAFQIsTm92X39wvUjYcIsABgNrEQBhRwICQlhS4F5U9Iy_AqDhK39jYxtyyuqAIXkAd2gIL3UMjl09f2EzAotwrpF7MCcXWvq08aaANi1W2H8dBZ2bZIbt9mYLfVPYY61jEs4AeVosaABzAlgAKWoIIwtj4OIU9HdChZHs9XAQJHB_oCxiDmMVprN5lYbAB1LAxaDUMCwAbAYajNIaFTkAC-20-tAgGFISFgvCkWAg0HcACMCDFSGBaNQfrTyAAPACCYogeGZsGg4iYInEkmksFF6AAnlKZXKwJqQErOPQcARPnxNZx1dsAG4y6h4-wgZkafWG0gAIhAo0YgxlBA9l1ZpvNDKqLDssQS52B7BiBAAZiQRIwpARaEJXQQxcmuAAJCCfRywADKvH4Mk4rlJpfLyPYAHoG7AnbAwBVKHXWcAYtQxHAwMBuzE-BoMBAxARoHgoNBSNYNJyAEofb4uia8Ee0UicADEADF96UAKIGcKcDQaig0MAvBMrr5K1Abnt8He7nbGPqmCwX9jUmltkIMNZQ4DRnwyN0jW5LAMyDdAp14DAnxBdAmxbLAQDbDsPRVagpA9Yc-wHIcAA1YCwaU8D0VDYDFHc8KkTMJjQ5tW3bH4vXkRRlEIzdiLbIcAE0KKo2jNR3OQFCUaQQQA_9yCpakAG4gA)

### Expected Behavior
The result should always be

The fact that the category is used in the axis or not shouldn't affect the value map
### Environment
```markdown
- OS: Windows 11
- Browser: Microsoft edge Version 102.0.1245.44 (Official build) (64-bit)
- Framework: None
```
### Any additional comments?
_No response_
Contributor guide
Assessment
This issue has not been assessed yet.