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; 

Любая помощь приветствуется. Thanks

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 где вы можете увидеть его работу с динамическими данными.