AmMap Export Fails
Based on https://www.amcharts.com/demos/map-with-curved-lines/
by Anton
HTML
<script src="https://www.amcharts.com/lib/3/ammap.js"></script>
<script src="https://www.amcharts.com/lib/3/maps/js/worldLow.js"></script>
<script src="https://www.amcharts.com/lib/3/themes/light.js"></script>
<script src="https://www.amcharts.com/lib/3/plugins/export/export.js">
</script>
<script src="https://www.amcharts.com/lib/3/plugins/export/libs/fabric.js/fabric.min.js">
</script>
<script src="https://www.amcharts.com/lib/3/plugins/export/libs/FileSaver.js/FileSaver.min.js">
</script>
<link href="https://www.amcharts.com/lib/3/plugins/export/export.css" type="text/css" rel="stylesheet" />
<div id="chartdiv"></div>
CSS
#chartdiv {
width : 100%;
height : 500px;
font-size : 11px;
}
JavaScript
var map = AmCharts.makeChart("chartdiv", {
type: "map",
"theme": "light",
export: {
enabled: true,
"libs": {
"autoLoad": false
}
},
dataProvider: {
map: "worldLow",
zoomLevel: 3.5,
zoomLongitude: -20.1341,
zoomLatitude: 49.1712,
lines: [{
latitudes: [51.5002, 50.4422],
longitudes: [-0.1262, 30.5367]
}],
images: [{
id: "london",
type: "circle",
title: "London",
latitude: 51.5002,
longitude: -0.1262,
scale: 1
}, {
type: "circle",
title: "Kiev",
latitude: 50.4422,
longitude: 30.5367,
scale: 0.5
}]
},
areasSettings: {
unlistedAreasColor: "#FFCC00",
unlistedAreasAlpha:0.9
},
linesSettings: {
arc: -0.7, // this makes lines curved. Use value from -1 to 1
arrow: "middle",
color: "#CC0000",
alpha: 0.4,
arrowAlpha: 1,
arrowSize: 4
},
zoomControl:{
gridHeight:100,
draggerAlpha:1,
gridAlpha:0.2
},
backgroundZoomsToTop: true,
linesAboveImages: true
});
jQuery('.chart-input').off().on('input change',function() {
var property = jQuery(this).data('property');
var target = map.linesSettings;
target[property] = this.value;
map.validateNow();
});