Question

我正在使用JVectormap，我正在尝试通过AJAX动态加载数据。我的AJAX调用一个返回结果字符串的PHP脚本。示例回复：{“US”：“29.84”，“BE”：“24.52”，“FR”：“21.42”，“GB”：“15.66”}

当我使用console.log（数据集）时，我在控制台中看到了完全正确的字符串作为上面的示例，但数据未加载到地理图表上，我收到错误“未捕获的TypeError：无法读取属性'element'未定义“

当我从控制台复制粘贴值并在我的代码中添加一行时说明 var dataset = {“US”：“29.84”，“BE”：“24.52”，“FR”：“21.42”，“GB”：“15.66”}; 然后图表完全加载。

因此，当我对该值进行硬编码时，一切正常，但是当我使用动态返回的数据集时，它不起作用，尽管它们是彼此的精确副本。

我的Javascript代码没有硬编码值（这导致空地图和控制台中上面提到的错误）

信息：此函数RenderChart（数据集）是从另一个部分调用的，它在“数据集”中加载AJAX数据。因此，数据集包含带有国家/地区代码和值的字符串，您也可以通过控制台查看.LOG（数据集）;

function RenderChart(dataset)
{
    console.log(dataset);
        $('#world-map').vectorMap({
            map: 'world_mill',
            backgroundColor: "#3C454D",
            series: {
                regions: [{
                    values: dataset,
                    scale: ['#25823b', '#fce853', '#e01402'],
                    normalizeFunction: 'polynomial'
                }]
            },
            onRegionTipShow: function(e, el, code){
                el.html(el.html()+' (Threat - '+dataset[code]+'%)');
            }
        });
}

我的代码带有硬编码值（这会产生一个好的图表）

function RenderChart(dataset)
{
    console.log(dataset);
    dataset = {"US":"29.84","BE":"24.52","FR":"21.42","GB":"15.66","DE":"2.81"};
        $('#world-map').vectorMap({
            map: 'world_mill',
            backgroundColor: "#3C454D",
            series: {
                regions: [{
                    values: dataset,
                    scale: ['#25823b', '#fce853', '#e01402'],
                    normalizeFunction: 'polynomial'
                }]
            },
            onRegionTipShow: function(e, el, code){
                el.html(el.html()+' (Threat - '+dataset[code]+'%)');
            }
        });
}

Answer 1

我自己已经解决了，但我想我会在这里为其他人添加解决方案，或许有同样的问题。

尽管PHP代码返回了json_encode（）值，但它不起作用。您必须在AJAX请求中明确定义 dataType：“json”。

在JVectormap中动态加载JSON数据与硬编码 - 未捕获TypeError：无法读取未定义

1 个答案: