css - 更改 jvectormap 负值颜色

标签 css svg jvectormap

默认情况下,当我的 jvectormap 中有负值时,它将国家/地区着色为黑色(检查国家/地区元素时我看到以下“填充”值:#000NaN)。我想改变这种颜色。我该怎么做?

编辑:这很老套,但我通过循环国家和检查黑色来更新黑色的国家颜色。代码如下:

        try {
            map = elVectorMap.vectorMap('get', 'mapObject');
            map.series.regions[0].setValues(data);
        } catch (e) {
            var vectorMapOptions = {
                map: 'world_mill_en',
                backgroundColor: '#ffffff',
                regionStyle: {
                    initial: {
                        fill: '#aac5e1'
                    }
                },
                series: {
                    regions: [{
                        values: data,
                        scale: ['#aac5e1', '#0e569f'],
                        normalizeFunction: 'polynomial'
                    }]
                }
            };
            elVectorMap.vectorMap(vectorMapOptions);
        }

        // Change the color of negative value countries from black to red
        elVectorMap.find('.jvectormap-element[fill="#000NaN"]').each(function(){
            $(this).css('fill', '#ffcfcd');
        });

最佳答案

使用此归一化函数代替“多项式”或“线性”值

normalizeFunction: function(value) {
   if (value < 0)
      return - Math.pow(Math.abs(value), 0.2)
   return Math.pow(value, 0.2);
},

关于css - 更改 jvectormap 负值颜色,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/29495649/

相关文章:

jquery - 如何在 JVectorMap 中设置缩放级别

html - CSS 背景图像不起作用

jquery - 更改页面滚动上的事件菜单项

javascript - 如何使用 d3 在 svg 上的固定位置显示 div?

css - 在 SVG 中使用尽可能多的 &lt;style&gt; 元素/属性是否有好处?

javascript - 使用 SVG 和 JavaScript 创建波浪动画

css - 如何使用 CSS3 线性渐变?

css - IE8及以下版本如何处理媒体查询

javascript - 在jVectorMap中,如何仅在满足条件时选择区域?

javascript - jsVectorMap 渲染得太小并破坏了布局