AmMap addLabel 不工作

Question

我正在使用以下代码在没有可用数据时渲染地图。数据到来时地图工作正常。我尝试了多种方法来添加标签，但它不起作用。最后两行显示了我到目前为止添加标签的尝试

// build map
AmCharts.ready(function () {
    AmCharts.theme = AmCharts.themes.dark;
    window.map = new AmCharts.AmMap();

    window.map.areasSettings = {
        unlistedAreasColor: "#000000",
        unlistedAreasAlpha: 0.1
    };
    window.map.imagesSettings.balloonText = "<span style='font-size:14px;'><b>[[title]]</b>: [[value]]</span>";

    var dataProvider = {
        mapVar: AmCharts.maps.worldLow,
        images: []
    }

    // create circle for each country


    // it's better to use circle square to show difference between values, not a radius
    var maxSquare = maxBulletSize * maxBulletSize * 2 * Math.PI;
    var minSquare = minBulletSize * minBulletSize * 2 * Math.PI;

    // create circle for each country
    for (var i = 0; i < mapData.length; i++) {
        var dataItem = mapData[i];
        var value = dataItem.value;
        // calculate size of a bubble
        var square = (value - min) / (max - min) * (maxSquare - minSquare) + minSquare;
        if (square < minSquare) {
            square = minSquare;
        }
        var size = Math.sqrt(square / (Math.PI * 2));
        var id = dataItem.code;

        dataProvider.images.push({
            type: "circle",
            width: size,
            height: size,
            color: "#ff9a00",
            longitude: latlong[id].longitude,
            latitude: latlong[id].latitude,
            title: dataItem.name,
            value: value
        });
    }

    window.map.dataProvider = dataProvider;
    window.map.export = {
        enabled: true
    }
    window.map.projection = "winkel3";
    window.map.write("dash_chart_world");
});

// add label
AmCharts.AmMap.mapdiv.addLabel(0, '50%', 'You don\'t have any sales yet', 'center');

// set opacity of the chart div
AmCharts.AmMap.mapdiv.style.opacity = 0.5;

感谢任何帮助。谢谢

Answer 1

您错过的是，每当图表出现问题时都需要调用该函数。由于您的需求与数据相结合，我们可以为 dataUpdated 添加事件侦听器并检查图像数组是否为空：

map.addListener("dataUpdated", function() {
    if (map.dataProvider.images.length == 0) {
        // add label
        map.addLabel(0, '50%', 'You don\'t have any sales yet', 'center');

        // set opacity of the chart div
        map.mapContainer.node.style.opacity = 0.1;
  }
});

关于我所做的其他更改：

方法 addLabel 属于 AmChart 对象而不属于 AmCharts.AmMap.mapdiv。（那甚至不存在。）
更改包含整个地图的 div 的不透明度（可以使用 map.div [AmChart.div] 获得）也会更改添加标签的不透明度。如果您只想更改地图本身的不透明度，您可以在 map.mapContainer.node 元素上进行更改。（这是svg持有地图投影的部分。）

我准备了一个小的demo，您可以在其中看到它处理动态数据。

AmMap addLabel 不工作

AmMap addLabel not working

jquery

amcharts

ammap