有没有办法使用“填充”和“笔画”作为区域比例颜色的属性?

时间:2012-11-12 13:01:55

标签: javascript jvectormap

我正在使用jVectorMap v1.1并且我已经获得了相关的代码:

var america = "#d84148";
var europe = "#0060d0";
var africa = "#44984d";
var asia = "#e3a430";
var oceania = "#2ecdd0";

series: {
    regions: [{
        values: data['colours'],
        scale: {
            "America" : america,
            "Europe" : europe,
            "Africa" : africa,
            "Asia" : asia,
            "Oceania" : oceania
        },
        normalizeFunction: 'linear',
        attribute: 'fill'
    }]
}

我得到的矢量数据来自naturalearth.com的world_mill_en,它包含每个国家的1px分隔,作为该国家的边界​​。我正在构建的应用程序必须将整个大陆显示出来,因此不允许使用任何边框。

attribute上我只能将fillstroke设置为参数,并且我可以在使用fill时为边框设置纯色。

我想知道是否可以在属性的同时使用fillstroke。或者,如果有一种方法可以将区域的笔划设置为与其各自区域具有相同的颜色。即。

if (stroke == "none") 
{
    stroke = "that region's colour"
}

1 个答案:

答案 0 :(得分:2)

在搜索了各种示例后,我在此链接中遇到了我的解决方案:

https://github.com/bjornd/jvectormap/blob/master/tests/markers.html

我需要做的就是:

var america = "#d84148";
var europe = "#0060d0";
var africa = "#44984d";
var asia = "#e3a430";
var oceania = "#2ecdd0";

series: {
    regions: [{
        values: data['colours'],
        scale: {
            "America" : america,
            "Europe" : europe,
            "Africa" : africa,
            "Asia" : asia,
            "Oceania" : oceania
        },
        normalizeFunction: 'linear',
        attribute: 'fill'
    }, {
        values: data['colours'],
        scale: {
            "America" : america,
            "Europe" : europe,
            "Africa" : africa,
            "Asia" : asia,
            "Oceania" : oceania
        },
        normalizeFunction: 'linear',
        attribute: 'stroke'
    }]
}

就是这样,问题解决了。复制区域数组内的整个部分,包括大括号,将填充更改为笔划。

相关问题