Support » Plugin: amCharts: Charts and Maps » Text permanently displayed in maps over each country

  • Hello,

    I’d like to have specific text showing on top of countries permanently. I have entered the information in as “customData” and just want that text to be displayed on top of the country without having to hover the mouse over the country. Is this possible to do?

    Thanks,

    ‘var map = AmCharts.makeChart( “$CHART$”, {
    “type”: “map”,
    “theme”: “light”,
    “export”: {
    “enabled”: true
    },
    “dataProvider”: {
    “map”: “worldHigh”,
    “zoomLevel”: 3.5,
    “zoomLongitude”: 10,
    “zoomLatitude”: 52,
    “areas”: [ {
    “title”: “Austria”,
    “id”: “AT”,
    “value”: “”,
    “customData”: “”,
    “color”: “#CCCCCC”
    }, {
    “title”: “Belgium”,
    “id”: “BE”,
    “value”: “”,
    “customData”: “”,
    “color”: “#CCCCCC”
    }, {
    “title”: “France”,
    “id”: “FR”,
    “value”: 116,
    “customData”: “81.1%”,
    “color”: “#16ba3f”
    }, {
    “title”: “Germany”,
    “id”: “DE”,
    “value”: 133,
    “customData”: “93%”,
    “color”: “#16ba3f”
    }, {
    “title”: “Ireland”,
    “id”: “IE”,
    “value”: “”,
    “customData”: “”,
    “color”: “#CCCCCC”
    }, {
    “title”: “Italy”,
    “id”: “IT”,
    “value”: 84,
    “customData”: “58.7%”,
    “color”: “#ffbb00”
    }, {
    “title”: “Luxembourg”,
    “id”: “LU”,
    “value”: “”,
    “customData”: “”,
    “color”: “#CCCCCC”
    }, {
    “title”: “Netherlands”,
    “id”: “NL”,
    “value”: “”,
    “customData”: “”,
    “color”: “#CCCCCC”
    }, {
    “title”: “Portugal”,
    “id”: “PT”,
    “value”: “”,
    “customData”: “”,
    “color”: “#CCCCCC”
    }, {
    “title”: “Spain”,
    “id”: “ES”,
    “value”: 75,
    “customData”: “52.4%”,
    “color”: “#ffbb00”
    }, {
    “title”: “Switzerland”,
    “id”: “CH”,
    “value”: “”,
    “customData”: “”,
    “color”: “#CCCCCC”
    }, {
    “title”: “UK”,
    “id”: “GB”,
    “value”: 68,
    “customData”: “47.6%”,
    “color”: “#ff0000”
    }
    ]
    },
    “areasSettings”: {
    “rollOverOutlineColor”: “#0055a5”,
    “alpha”: 0.8,
    “labelText”: “<b>customData</b>”,
    “unlistedAreasAlpha”: 0,
    “balloonText”: “<b>title</b><br />Number of OMPs reimbursed: <b>value</b><br /><b>customData%</b>”,
    “autoZoom”: false,
    “selectable”: false
    }
    } );’

Viewing 3 replies - 1 through 3 (of 3 total)
  • Plugin Author martynasma

    (@martynasma)

    Technically, there’s no built-in function to automatically display text with the area.

    However, you can use MapImage objects with labels to place any text anywhere. The problem is that you need to place it using specific latitude/longitude coordinates.

    I suggest you take a look at this example:

    https://www.amcharts.com/kbase/display-state-abbreviations-as-labels-over-us-map/

    It has the code which automatically places area ID in the middle of that area.

    It should be easy to modify it to display customData instead.

    Let me know if you need a hand with that.

    Thanks. I did try that before and the problem was that countries like Spain which have a few islands around shift the centre of the label, but its better than nothing.

    Can you help me modify it to display customData instead of the ID?

    Thanks in advance

    Plugin Author martynasma

    (@martynasma)

    Yes, you might need to modify label coordinates for some countries manually, since dead on center does not make sense for them, line for Spain.

    I you take a look at the code, you’ll see that you can override latitude or longitude for some area ID’s here: (for Spain that would be ES)

      // set up a longitude exceptions for certain areas
      var longitude = {
        "US-CA": -130,
        "US-FL": 120,
        "US-TX": 1,
        "US-LA": 40
      };
      
      var latitude = {
        "US-AK": -85
      };

    Using customData instead of id is easy. Just change this:

    image.label = area.id.split('-').pop();

    Into this:

    image.label = area.customData

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Text permanently displayed in maps over each country’ is closed to new replies.