apache / apache/echarts

[Bug] map 2d some regions can not display the color which I accutally assign the value in production enviroment.

Open
#16,777 5 comments 0 reactions 0 assignees View on GitHub
bug pending waiting-for: community
Dominant language
TypeScript
Stars
67.3k
Forks
19.8k
Avg merge
11d 14h
Merged PRs (30d)
8

Description

### Version

4.2.1

### Link to Minimal Reproduction

_No response_

### Steps to Reproduce

1. // 进行相关配置
```ts
this.chartOption = {
tooltip: {
// 鼠标移到图里面的浮动提示框
// formatter详细配置: https://echarts.baidu.com/option.html#tooltip.formatter
formatter(params, ticket, callback) {
// params.data 就是series配置项中的data数据遍历
let localValue = 0,
perf = 0,
downloadSpeep,
usability,
point;
if (params.data) {
localValue = params.data.count ? params.data.count : 0;
downloadSpeep = params.data.downloadSpeep;
usability = params.data.usability;
point = params.data.point;
}
let htmlStr = `

${params.name}


项目数量:${localValue}


`;
return htmlStr;
},
backgroundColor: "#ff7f50", //提示标签背景颜色
textStyle: { color: "#fff" }, //提示标签字体颜色
},
visualMap: {
show: false,
bottom: 60,
right: 200,
text: ["高", "低"],
// min:0,
// precision:0,
itemHeight: 200,
color: [
"#5475f5",
"#9feaa5",
"#85daef",
"#74e2ca",
"#e6ac53",
"#9fb5ea",
],
},
// geo配置详解: https://echarts.baidu.com/option.html#geo
geo: {
// 地理坐标系组件用于地图的绘制
map: "individualMap", // 表示中国地图 如果china会有南方诸岛
roam: true, // 是否开启鼠标缩放和平移漫游
zoom: 1.2, // 当前视角的缩放比例(地图的放大比例)
label: {
// show: true
},
itemStyle: {
// 地图区域的多边形 图形样式。
normal: {
//未选中的状态
borderColor: "tansparent",
areaColor: "#5dd5f0", //背景颜色
label: {
// show: true, //显示名称
},
},
emphasis: {
//选中的状态
// 高亮状态下的多边形和标签样式
shadowBlur: 20,
shadowColor: "rgba(0, 0, 0, 0.5)",
borderColor: "#fff",
areaColor: "#DA3A3A",
},
},
regions: [

{
name: "广东省",
itemStyle: {
areaColor: "red",
color: "red",
},
},
],
},
series: [
{
name: "地图", // 浮动框的标题(上面的formatter自定义了提示框数据,所以这里可不写)
type: "map",
geoIndex: 0,
label: {
show: true,
},
// 这是需要配置地图上的某个地区的数据,根据后台的返回的数据进行拼接
data: [...this.mapInfo[this.type].data],
},
],
};
```

### Current Behavior

1.it is normal in devlopment enviroment but it will be a problem in a production enviroment
2. the fitst picture shows the params and the second picture shows the map in production enviroment
4. the final picture shows normally in development enviroment

![image](https://user-images.githubusercontent.com/63937022/160956684-60640129-30f8-4489-8e41-0e12e96f16aa.png)
![image](https://user-images.githubusercontent.com/63937022/160957308-17a62246-9bfc-41f3-a069-201b1dbe53ec.png)
![image](https://user-images.githubusercontent.com/63937022/160957630-ec482665-866d-46a8-bdaa-438bae0911cc.png)

### Expected Behavior

1.I can normally distribute this in production enviroment

### Environment

```markdown
- OS:window
- Browser:chrome
- Framework:vue ^2.6.10
```

### Any additional comments?

_No response_

Contributor guide

Open the contributing guide

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.