score:2
the reason they are not working the same way is because you have to pass x and y coordinates when you use "mappoint".
your "goblin" data:
{
"name": "adam",
"x": 1751,
"y": -9500
}
your "ghost" data (no "x" and "y"):
{
name: "liège",
code: "se",
z: 1
}
if you give the "ghost" data some "x" and "y" properties, it will work. please see this example.
the other thing that you can try if you want to insert images into the map without specifying any "x" and "y" is to do it via the datalabels. in this example here, i have created a map of the usa. each state that has the population density smaller than 7 people per square metre will display a ghost. if you want to go this way, there are two properties that you need to use this way:
usehtml: true
so you can have html<img>
tags as data labels- use
formatter
instead offormat
, but please note you have to pass a function toformatter
var ghostelem = '<img src="https://cdn1.iconfinder.com/data/icons/momentum_matteentireset/32/ghost.png"/>';
datalabels: {
enabled: true,
usehtml: true,
color: 'white',
formatter: function() { return (this.point.value <7)? ghostelem: null}
}
Source: stackoverflow.com
Related Query
- How do I show map points using country codes with Highmaps?
- How to make map with overlaid column charts using highmaps
- How to draw a bubble map with longitude and latitude using Highcharts in react
- How to insert overlay images in HighMaps (or HighCharts) which scale with the map
- How to show unique name of every points in highCharts using angular
- Coloring Country while showing mappoint for cities in world map using highmaps
- Custom map with Highmaps adding mappoint series in latitude and longitude using proj4js
- how to map serial and data points using json Array
- Highmaps country map not showing when using type: "mappoint"
- how to create a world map using highmaps and disable part of legend?
- How to show a column with the value Zero in Column chart in Highcharts?
- How to use Highmaps and Highcharts with Meteor?
- How to import Highmaps map collection in Angular 6
- How show all tooltips split in graph with many series
- How to grab correct highchart number in selectors using Selenium Webdriver with Python with several charts on the page?
- How to draw two lines in HighStocks using candlestick with intraday
- how to pass datalabels along with data to show it in tooltip in highchart
- How to show only weekday on xAxis with Highcharts?
- How to show multiple pie charts using highcharts
- How to read and insert correct highchart number in selectors using Selenium Webdriver with Python?
- How can I hide non-selected series and axes when using XY zoom with highcharts?
- How to make two charts using highchart show up in the same line side by side using div
- How can i add element with attributes to SVG using jquery
- how to show column and area charts with different y axis with same category and same x axis in highcharts
- How can I make milestone lines with a GANTT chart using the highcharts library?
- How to specify a range of data when using HighCharts with <table>?
- How to display percentage along with Count value in Pie chart Using Higcharts Plugin?
- How can I get a chart only with legends using highcharts
- how to show different colors for each grid line using highcharts?
- How to show/hide categories with checkbox using highcharts?
More Query from same tag
- render a dynamic number of highcharts charts is not working
- Custom axis labels on Stacked bar chart
- Pine (Tradingview) Showing different values in different timeframe
- highcharts disable motion - set fixed chart
- Content of highchart tooltip getting overflow
- Adding intraday option to highcharts
- Highchart, how to add commas to point data in tooltips
- highcharts mapbubble display 3 times
- Can color of data label be different inside and outside of the bar in Highchart
- Dual Axis in Highstock?
- Highcharts Pie charts get the selected pie id
- Add different colour in X-range bar based on percentage
- Highcharts graph should start entirely to the left and end entirely to the right
- Legend same colour as bullet
- How to use data in rChart Highcharts
- HighChat Heatmap: Tooltip
- How to configure date format in Highcharts?
- Click event in treemap in highcharts
- Highstock error: a.ownerDocument is undefined
- HighMaps: Change the size/width of ColorAxis
- HighCharts: pie slices need background images
- How to remove category label margins of highchart?
- Highcharts - Sankey chart - How to display some series dataLabels name into icon or some different name
- Gwt Highcharts Marker or Symbol Rotation
- PHP - getting real time data from the database
- Inconsistencies with the display of metric notations in Highcharts
- Highcharts spline chart points not showing unless zoomed in
- Highcharts - xAxis date
- Can highcharts stacked percentage column chart be less than 100%
- Export Highcharts DataTable to PDF - Angular