Amcharts3 ,how to show ballon text of selected country by default without hover or selection

14 Views Asked by At

I am using amcharts 3 to show list of visited countries .The countries are being shown with correct colors ,however i am unable to display country name or balloon text by default ,only when i hover over the country do i get the balloon .i searched the documentation and found that these two properties need to be enabled .However i do not get desired result until i hover over selected countries

balloon: {
    showAlways:true,      
    fixedAnchor: true

}

Below is my entire js file

var map = AmCharts.makeChart("mapdiv", {
type: "map",
theme: "dark", 
projection: "mercator",
panEventsEnabled: true,
backgroundColor: "#808080",
backgroundAlpha: 1,
zoomControl: {
    zoomControlEnabled: true
},
dataProvider: {
    map: "worldIndiaLow",
    getAreasFromMap: true,
    areas: [
        {
            "id": "US",
            "color": "#B94199", 
            "selectedColor": "#B94199",
            "title": "United States",
            "balloonText": "United States",
            "labelShowAlways": true,
            "showAlways": true,
            "showAsSelected": true
        },
        {
            "id": "BT",
            "color": "#31CF26", 
            "selectedColor": "#31CF26",
            "title": "Bhutan",
            "showBalloon": true,
            "balloonText": "Bhutan",
            "showAsSelected": true
        },
        {
            "id": "IN",
            "color": "#3C66C8", 
            "selectedColor": "#3C66C8",
            "title": "India",
            "balloonText": "India",
            "showAsSelected": true
        },
        {
            "id": "OM",
            "color": "#D43E0C", 
            "selectedColor": "#D43E0C",
            "title": "Oman",
            "balloonText": "Oman",
            "showAsSelected": true
        },
        {
            "id": "TH",
            "color": "#8B17D9", 
            "selectedColor": "#8B17D9",
            "title": "Thailand",
            "balloonText": "Thailand",
            "showAsSelected": true
        },
        {
            "id": "AE",
            "color": "E5F505", 
            "selectedColor": "#E5F505",
            "title": "UAE",
            "balloonText": "UAE",
            "showAsSelected": true
        }
    ]
},
areasSettings: {
    autoZoom: true,                     
    outlineColor: "#666666",
    rollOverColor: "#9EC2F7",
    rollOverOutlineColor: "#000000",
    labelText: "[[title]]",
    labelColor: "#000000",
    labelRollOverColor: "#ffffff",
    labelShowAlways: true,
    balloon: {
        showAlways:true,      
        fixedAnchor: true
       
    }
}

});

0

There are 0 best solutions below