7

我使用jvectormap 插件，我正在尝试设置地图上每个区域的颜色。但是，应用下面的代码后，地图会显示，但没有应用颜色。它只是以白色显示地图。

我已经阅读了有关此问题的多个示例和问题，但我似乎无法让它为我工作。

在地图上设置随机颜色的示例 1。

文档

与我的类似问题，但它不能解决我的问题。

jQuery('#mapDiv').vectorMap({
    map: 'au_merc_en',
    backgroundColor: 'none',
    colors: {
        AU-SA: '#4E7387',
        AU-WA:'#333333',
        AU-VIC:'#89AFBF',
        AU-TAS:'#817F8E',
        AU-QLD:'#344B5E',
        AU-NSW:'#344B5E',
        AU-ACT:'#344B5E',
        AU-NT:'#344B5E'

    },
    series: {
      regions: 
      [{
        attribute: 'fill'
      }]
    }
});

任何人都可以看到问题吗？

4

2 回答 2

12

这是我认为您正在尝试做的工作示例。

http://jsfiddle.net/3xZ28/34/

(function() {
    var myCustomColors = {
        'AU-SA': '#4E7387',
        'AU-WA': '#333333',
        'AU-VIC': '#89AFBF',
        'AU-TAS': '#817F8E',
        'AU-QLD': '#344B5E',
        'AU-NSW': '#344B5E',
        'AU-ACT': '#344B5E',
        'AU-NT': '#344B5E'
    };

    map = new jvm.WorldMap({
        map: 'au_merc_en',
        container: $('#ausie'),
        backgroundColor: '#eff7ff',
        series: {
            regions: [{
                attribute: 'fill'
            }]
        }
    });

    map.series.regions[0].setValues(myCustomColors);
})();

此示例基于 jvectormap 站点上的两个示例：
1. http://jvectormap.com/maps/countries/australia/
2. http://jvectormap.com/examples/random-colors/

小提琴包括来自该站点的 jvectormap 1.1 文件。另请注意站点上的随机颜色示例使用 jvm。世界地图。

于 2012-10-13T00:57:48.707 回答
2

下面的代码已经过编辑，以修复您发布的代码中的语法错误。

jQuery('#mapDiv').vectorMap({
    map: 'au_merc_en',
    backgroundColor: 'none',
    colors:{
        "AU-SA": '#4E7387',
        "AU-WA":'#333333',
        "AU-VIC":'#89AFBF',
        "AU-TAS":'#817F8E',
        "AU-QLD":'#344B5E',
        "AU-NSW":'#344B5E',
        "AU-ACT":'#344B5E',
        "AU-NT":'#344B5E'

    },
    series: {
      regions: 
      [{
        attribute: 'fill'
      }]
    }
});

对象键中的未绑定（我可以召集的最接近的封装反义词）连字符会导致语法错误。错误本身是针对无效标签的。

于 2012-10-13T00:37:22.707 回答