Multiple series of map is not displayed all together

Version: 3.4.0

I have two series where each of them is showing different country (with different color). The issue is that I don’t seem to be able to show both series together. The second series is visible only if the first is switched off:

Here is the code:

option = {
    "color": [
        "#2196f3",
        "#e91e63"
    ],
    "legend": {
        "data": [
            "Category 1",
            "Category 2"
        ]
    },
    "geo": {
        "map": "world",
        "scaleLimit": {
            "min": 10
        },
        "center": [
            "5",
            "50"
        ]
    },
    "series": [
        {
            "map": "world",
            "name": "Category 1",
            "type": "map",
            "scaleLimit": {
                "min": 10
            },

            "center": [
                "5",
                "50"
            ],
            "data": [
                {
                    "name": "United Kingdom",
                    "category": "Category 1",
                    "itemStyle": {
                        "normal": {
                            "areaColor": "#2196f3"
                        },
                        "emphasis": {
                            "areaColor": "rgb(81, 173, 246)"
                        }
                    },
                    "value": "100"
                }
            ]
        },
        {
            "map": "world",
            "name": "Category 2",
            "type": "map",
            "scaleLimit": {
                "min": 10
            },
            "center": [
                "5",
                "50"
            ],
            "data": [
                {
                    "name": "Czech Republic",
                    "category": "Category 2",
                    "itemStyle": {
                        "normal": {
                            "areaColor": "#e91e63"
                        },
                        "emphasis": {
                            "areaColor": "rgb(238, 76, 131)"
                        }
                    },
                    "value": "5"
                }
            ]
        }
    ]
}

Seems previous series are overlaying following series? Although I’ve tried to set non active area color to transparent with no success. I’ve also tried to set zLevel, played with visualMap (which actually shows the country but doesn’t apply custom color… )

Any ideas? Or is this a bug?

[100pah]

@jarben Yes I can implement it using visualMap like this: (although the emphasis setting seems to be a little ugly)

option = {
    "color": [
        "#2196f3",
        "#e91e63"
    ],
    visualMap: {
        type: 'piecewise',
        dimension: 1,
        top: 0,
        left: 'center',
        orient: 'horizontal',
        categories: ['Category 1', 'Category 2'],
        hoverLink: false,
        inRange: {
            color: {
                "Category 1": "#2196f3",
                "Category 2": "#e91e63"
            }
        }
    },
    "series": [
        {
            "map": "world",
            "name": "Category 1",
            "type": "map",
            "scaleLimit": {
                "min": 10
            },
            "center": [
                "5",
                "50"
            ],
            "data": [
                {
                    "name": "United Kingdom",
                    "value": [6, "Category 1"],
                    "itemStyle": {
                        "emphasis": {
                            "areaColor": "rgb(81, 173, 246)"
                        }
                    },                    
                },
                {
                    "name": "Czech Republic",
                    "value": [5, "Category 2"],
                    "itemStyle": {
                        "emphasis": {
                            "areaColor": "rgb(238, 76, 131)"
                        }
                    }                    
                }                
            ]
        }
    ]
}

[AnrichVS]

Thanks for these workarounds, I’m having the same issue. It would be awesome if the following was possible:

• 2 or more series of type map (showing on the same map)
• Each series with its own visualMap, so that each series can be mapped to different colors, and controlled independently
• All of the series visible at the same time (if they overlap, for example US appears in more than one series, I don’t even expect colors to mix, the one added latest can take precedence. As long as all those that don’t overlap show at the same time).

I doubt I’ll have time to do this myself, but if I manage to I’ll make a pull request and comment it here.