html - 通过 css 为 map 区域设置颜色外边界

Question

有没有可能在 Map by css 上对区域进行不同的着色？我找不到相关帖子

我有这样的 map 部分:

如您所见，该区域包含五个子区域。每个子区域边界都是红色的。我只需要使外部边界(接触大海)是黑色

相关代码如下:

对于外部区域

            mapdata.parentId = "c0";

            mapdata.name = a;
            mapdata.title = "Arron";
            mapdata.cName = "_21";            **<--Class Name**  
            mapdata.zoom = 0;
            mapdata.backUrl = "?v=arron&d=" + d;

            //get all arrondisments
            using (var query = new SiteAdminQuery())
            {
                DrawSingleArrondissment(a, query, paths);

                if (showCity)
                {
                    DrawAllCitiesForSelectedArrondissment(d, a, query, paths, false, true);
                }
            }

                mapdata.paths = paths.OrderByDescending(x => x.BoundaryDisplayOrder).ToArray();
            }

对于内部区域:

  key = arrondissementSetUp.arrndsId.ToString(),
                    type = "a",
                    mType = string.Format("{0}: {1}", HEM.Resources.Globals.arrnds, arrondissementSetUp.name),
                    url = string.Format("?v={0}&d={1}&a={2}", "arron", arrondissementSetUp.deptId, arrondissementSetUp.arrndsId),

                   cName = "_New21",      **<--Class Name**

                    path = arrondissementSetUp.mainViewPathId.ToString(),
                    BoundaryDisplayOrder=3

这是区域的 css:

._21 {
    fill: #ffff7d;
     stroke: #000000;
    stroke-width: 1;
}

  .New_21{
    fill: #ffff7d;
     stroke: #d10909;
    stroke-width: 1;
}

我尝试使用 .class:After Property，但这不起作用。

我在这篇文章中找到了例子

CSS Outside Border

http://jsfiddle.net/A2tu9/191/ .

我用

这样的关键字搜索谷歌

“css:设置外边界/边框颜色”，“css:设置内边界/边框”，等等..但找不到任何好的帖子。这些区域是用 map 坐标创建的，所以我无法发布整个代码..

如果需要任何其他资源，请告诉我。我发一下

还请建议是否可以通过任何其他技术发生这种情况

Answer 1

因此看起来您的省份是由 SVG 绘制的。没有一个属性可以满足您的需求。您需要做的是在绘制出各个区域之后，您需要再次将整个岛屿作为单个 SVG 元素绘制出来(即一个实体形状是整个岛的形状，忽略各个区域)，并且设置填充:透明；描边:黑色；

因为您是在之后绘制它，所以它会位于现有岛屿的顶部，黑色边框将刚好覆盖外面的红色边框。