demo.js 3.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122
  1. !function ($) {
  2. $(function(){
  3. $('#world_map').vectorMap({
  4. map: 'world_mill_en',
  5. normalizeFunction: 'polynomial',
  6. backgroundColor: '#fff',
  7. regionStyle: {
  8. initial: {
  9. fill: '#36424f'
  10. },
  11. hover: {
  12. fill: '#1ccc88'
  13. },
  14. },
  15. markerStyle: {
  16. initial: {
  17. fill: '#1ccc88',
  18. stroke: '#fff'
  19. }
  20. },
  21. markers: [
  22. {latLng: [41.90, 12.45], name: 'Vatican City'},
  23. {latLng: [43.73, 7.41], name: 'Monaco'},
  24. {latLng: [-0.52, 166.93], name: 'Nauru'},
  25. {latLng: [-8.51, 179.21], name: 'Tuvalu'},
  26. {latLng: [43.93, 12.46], name: 'San Marino'},
  27. {latLng: [47.14, 9.52], name: 'Liechtenstein'},
  28. {latLng: [7.11, 171.06], name: 'Marshall Islands'},
  29. {latLng: [17.3, -62.73], name: 'Saint Kitts and Nevis'},
  30. {latLng: [3.2, 73.22], name: 'Maldives'},
  31. {latLng: [35.88, 14.5], name: 'Malta'},
  32. {latLng: [12.05, -61.75], name: 'Grenada'},
  33. {latLng: [13.16, -61.23], name: 'Saint Vincent and the Grenadines'},
  34. {latLng: [13.16, -59.55], name: 'Barbados'},
  35. {latLng: [17.11, -61.85], name: 'Antigua and Barbuda'},
  36. {latLng: [-4.61, 55.45], name: 'Seychelles'},
  37. {latLng: [7.35, 134.46], name: 'Palau'},
  38. {latLng: [42.5, 1.51], name: 'Andorra'},
  39. {latLng: [14.01, -60.98], name: 'Saint Lucia'},
  40. {latLng: [6.91, 158.18], name: 'Federated States of Micronesia'},
  41. {latLng: [1.3, 103.8], name: 'Singapore'},
  42. {latLng: [1.46, 173.03], name: 'Kiribati'},
  43. {latLng: [-21.13, -175.2], name: 'Tonga'},
  44. {latLng: [15.3, -61.38], name: 'Dominica'},
  45. {latLng: [-20.2, 57.5], name: 'Mauritius'},
  46. {latLng: [26.02, 50.55], name: 'Bahrain'},
  47. {latLng: [0.33, 6.73], name: 'São Tomé and Príncipe'}
  48. ]
  49. });
  50. var map,
  51. markers = [
  52. {latLng: [40.71, -74.00], name: 'New York'},
  53. {latLng: [34.05, -118.24], name: 'Los Angeles'},
  54. {latLng: [41.87, -87.62], name: 'Chicago'},
  55. {latLng: [29.76, -95.36], name: 'Houston'},
  56. {latLng: [39.95, -75.16], name: 'Philadelphia'},
  57. {latLng: [38.90, -77.03], name: 'Washington'},
  58. {latLng: [37.36, -122.03], name: 'Silicon Valley'}
  59. ],
  60. cityAreaData = [
  61. 187.70,
  62. 255.16,
  63. 310.69,
  64. 605.17,
  65. 248.31,
  66. 107.35,
  67. 217.22
  68. ];
  69. map = new jvm.WorldMap({
  70. container: $('#usa_map'),
  71. map: 'us_aea_en',
  72. backgroundColor: '#fff',
  73. regionsSelectable: true,
  74. markersSelectable: true,
  75. markers: markers,
  76. markerStyle: {
  77. initial: {
  78. fill: '#fcc633'
  79. },
  80. selected: {
  81. fill: '#ffffff'
  82. }
  83. },
  84. regionStyle: {
  85. initial: {
  86. fill: '#177bbb'
  87. },
  88. selected: {
  89. fill: '#1ccacc'
  90. }
  91. },
  92. series: {
  93. markers: [{
  94. attribute: 'r',
  95. scale: [5, 15],
  96. values: cityAreaData
  97. }]
  98. },
  99. onRegionSelected: function(){
  100. if (window.localStorage) {
  101. window.localStorage.setItem(
  102. 'jvectormap-selected-regions',
  103. JSON.stringify(map.getSelectedRegions())
  104. );
  105. }
  106. },
  107. onMarkerSelected: function(){
  108. if (window.localStorage) {
  109. window.localStorage.setItem(
  110. 'jvectormap-selected-markers',
  111. JSON.stringify(map.getSelectedMarkers())
  112. );
  113. }
  114. }
  115. });
  116. });
  117. }(window.jQuery);