jquery-jvectormap-2.0.2.min.js 102 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096109710981099110011011102110311041105110611071108110911101111111211131114111511161117111811191120112111221123112411251126112711281129113011311132113311341135113611371138113911401141114211431144114511461147114811491150115111521153115411551156115711581159116011611162116311641165116611671168116911701171117211731174117511761177117811791180118111821183118411851186118711881189119011911192119311941195119611971198119912001201120212031204120512061207120812091210121112121213121412151216121712181219122012211222122312241225122612271228122912301231123212331234123512361237123812391240124112421243124412451246124712481249125012511252125312541255125612571258125912601261126212631264126512661267126812691270127112721273127412751276127712781279128012811282128312841285128612871288128912901291129212931294129512961297129812991300130113021303130413051306130713081309131013111312131313141315131613171318131913201321132213231324132513261327132813291330133113321333133413351336133713381339134013411342134313441345134613471348134913501351135213531354135513561357135813591360136113621363136413651366136713681369137013711372137313741375137613771378137913801381138213831384138513861387138813891390139113921393139413951396139713981399140014011402140314041405140614071408140914101411141214131414141514161417141814191420142114221423142414251426142714281429143014311432143314341435143614371438143914401441144214431444144514461447144814491450145114521453145414551456145714581459146014611462146314641465146614671468146914701471147214731474147514761477147814791480148114821483148414851486148714881489149014911492149314941495149614971498149915001501150215031504150515061507150815091510151115121513151415151516151715181519152015211522152315241525152615271528152915301531153215331534153515361537153815391540154115421543154415451546154715481549155015511552155315541555155615571558155915601561156215631564156515661567156815691570157115721573157415751576157715781579158015811582158315841585158615871588158915901591159215931594159515961597159815991600160116021603160416051606160716081609161016111612161316141615161616171618161916201621162216231624162516261627162816291630163116321633163416351636163716381639164016411642164316441645164616471648164916501651165216531654165516561657165816591660166116621663166416651666166716681669167016711672167316741675167616771678167916801681168216831684168516861687168816891690169116921693169416951696169716981699170017011702170317041705170617071708170917101711171217131714171517161717171817191720172117221723172417251726172717281729173017311732173317341735173617371738173917401741174217431744174517461747174817491750175117521753175417551756175717581759176017611762176317641765176617671768176917701771177217731774177517761777177817791780178117821783178417851786178717881789179017911792179317941795179617971798179918001801180218031804180518061807180818091810181118121813181418151816181718181819182018211822182318241825182618271828182918301831183218331834183518361837183818391840184118421843184418451846184718481849185018511852185318541855185618571858185918601861186218631864186518661867186818691870187118721873187418751876187718781879188018811882188318841885188618871888188918901891189218931894189518961897189818991900190119021903190419051906190719081909191019111912191319141915191619171918191919201921192219231924192519261927192819291930193119321933193419351936193719381939194019411942194319441945194619471948194919501951195219531954195519561957195819591960196119621963196419651966196719681969197019711972197319741975197619771978197919801981198219831984198519861987198819891990199119921993199419951996199719981999200020012002200320042005200620072008200920102011201220132014201520162017201820192020202120222023202420252026202720282029203020312032203320342035203620372038203920402041204220432044204520462047204820492050205120522053205420552056205720582059206020612062206320642065206620672068206920702071207220732074207520762077207820792080208120822083208420852086208720882089209020912092209320942095209620972098209921002101210221032104210521062107210821092110211121122113211421152116211721182119212021212122212321242125212621272128212921302131213221332134213521362137213821392140214121422143214421452146214721482149215021512152215321542155215621572158215921602161216221632164216521662167216821692170217121722173217421752176217721782179218021812182218321842185218621872188218921902191219221932194219521962197219821992200220122022203220422052206220722082209221022112212221322142215221622172218221922202221222222232224222522262227222822292230223122322233223422352236223722382239224022412242224322442245224622472248224922502251225222532254225522562257225822592260226122622263226422652266226722682269227022712272227322742275227622772278227922802281228222832284228522862287228822892290229122922293229422952296229722982299230023012302230323042305230623072308230923102311231223132314231523162317231823192320232123222323232423252326232723282329233023312332233323342335233623372338233923402341234223432344234523462347234823492350235123522353235423552356235723582359236023612362236323642365236623672368236923702371237223732374237523762377237823792380238123822383238423852386238723882389239023912392239323942395239623972398239924002401240224032404240524062407240824092410241124122413241424152416241724182419242024212422242324242425242624272428242924302431243224332434243524362437243824392440244124422443244424452446244724482449245024512452245324542455245624572458245924602461246224632464246524662467246824692470247124722473247424752476247724782479248024812482248324842485248624872488248924902491249224932494249524962497249824992500250125022503250425052506250725082509251025112512251325142515251625172518251925202521252225232524252525262527252825292530253125322533253425352536253725382539254025412542254325442545254625472548254925502551255225532554255525562557255825592560256125622563256425652566256725682569257025712572257325742575257625772578257925802581258225832584258525862587258825892590259125922593259425952596259725982599260026012602260326042605260626072608260926102611261226132614261526162617261826192620262126222623262426252626262726282629263026312632263326342635263626372638263926402641264226432644264526462647264826492650265126522653265426552656265726582659266026612662266326642665266626672668266926702671267226732674267526762677267826792680268126822683268426852686268726882689269026912692269326942695269626972698269927002701270227032704270527062707270827092710271127122713271427152716271727182719272027212722272327242725272627272728272927302731273227332734273527362737273827392740274127422743274427452746274727482749275027512752275327542755275627572758275927602761276227632764276527662767276827692770277127722773277427752776277727782779278027812782278327842785278627872788278927902791279227932794279527962797279827992800280128022803280428052806280728082809281028112812281328142815281628172818281928202821282228232824282528262827282828292830283128322833283428352836283728382839284028412842284328442845284628472848284928502851285228532854285528562857285828592860286128622863286428652866286728682869287028712872287328742875287628772878287928802881288228832884288528862887288828892890289128922893289428952896289728982899290029012902290329042905290629072908290929102911291229132914291529162917291829192920292129222923292429252926292729282929293029312932293329342935293629372938293929402941294229432944294529462947294829492950295129522953295429552956295729582959296029612962296329642965296629672968296929702971297229732974297529762977297829792980298129822983298429852986298729882989299029912992299329942995299629972998299930003001300230033004300530063007300830093010301130123013301430153016301730183019302030213022302330243025302630273028302930303031303230333034303530363037303830393040304130423043304430453046304730483049305030513052305330543055305630573058305930603061306230633064306530663067306830693070307130723073307430753076307730783079308030813082308330843085308630873088308930903091309230933094309530963097309830993100310131023103310431053106310731083109311031113112311331143115311631173118311931203121312231233124312531263127312831293130313131323133313431353136313731383139314031413142314331443145314631473148314931503151315231533154315531563157315831593160316131623163316431653166316731683169317031713172317331743175317631773178317931803181318231833184318531863187318831893190319131923193319431953196319731983199320032013202320332043205320632073208320932103211321232133214321532163217321832193220322132223223322432253226322732283229323032313232323332343235323632373238323932403241324232433244324532463247324832493250325132523253325432553256325732583259326032613262326332643265326632673268326932703271327232733274327532763277327832793280328132823283328432853286328732883289329032913292329332943295329632973298329933003301330233033304330533063307330833093310331133123313331433153316331733183319332033213322332333243325332633273328
  1. /**
  2. * jVectorMap version 2.0.2
  3. *
  4. * Copyright 2011-2014, Kirill Lebedev
  5. *
  6. */
  7. (function( $ ){
  8. var apiParams = {
  9. set: {
  10. colors: 1,
  11. values: 1,
  12. backgroundColor: 1,
  13. scaleColors: 1,
  14. normalizeFunction: 1,
  15. focus: 1
  16. },
  17. get: {
  18. selectedRegions: 1,
  19. selectedMarkers: 1,
  20. mapObject: 1,
  21. regionName: 1
  22. }
  23. };
  24. $.fn.vectorMap = function(options) {
  25. var map,
  26. methodName,
  27. map = this.children('.jvectormap-container').data('mapObject');
  28. if (options === 'addMap') {
  29. jvm.Map.maps[arguments[1]] = arguments[2];
  30. } else if ((options === 'set' || options === 'get') && apiParams[options][arguments[1]]) {
  31. methodName = arguments[1].charAt(0).toUpperCase()+arguments[1].substr(1);
  32. return map[options+methodName].apply(map, Array.prototype.slice.call(arguments, 2));
  33. } else {
  34. options = options || {};
  35. options.container = this;
  36. map = new jvm.Map(options);
  37. }
  38. return this;
  39. };
  40. })( jQuery );
  41. /*! Copyright (c) 2013 Brandon Aaron (http://brandon.aaron.sh)
  42. * Licensed under the MIT License (LICENSE.txt).
  43. *
  44. * Version: 3.1.9
  45. *
  46. * Requires: jQuery 1.2.2+
  47. */
  48. (function (factory) {
  49. if ( typeof define === 'function' && define.amd ) {
  50. // AMD. Register as an anonymous module.
  51. define(['jquery'], factory);
  52. } else if (typeof exports === 'object') {
  53. // Node/CommonJS style for Browserify
  54. module.exports = factory;
  55. } else {
  56. // Browser globals
  57. factory(jQuery);
  58. }
  59. }(function ($) {
  60. var toFix = ['wheel', 'mousewheel', 'DOMMouseScroll', 'MozMousePixelScroll'],
  61. toBind = ( 'onwheel' in document || document.documentMode >= 9 ) ?
  62. ['wheel'] : ['mousewheel', 'DomMouseScroll', 'MozMousePixelScroll'],
  63. slice = Array.prototype.slice,
  64. nullLowestDeltaTimeout, lowestDelta;
  65. if ( $.event.fixHooks ) {
  66. for ( var i = toFix.length; i; ) {
  67. $.event.fixHooks[ toFix[--i] ] = $.event.mouseHooks;
  68. }
  69. }
  70. var special = $.event.special.mousewheel = {
  71. version: '3.1.9',
  72. setup: function() {
  73. if ( this.addEventListener ) {
  74. for ( var i = toBind.length; i; ) {
  75. this.addEventListener( toBind[--i], handler, false );
  76. }
  77. } else {
  78. this.onmousewheel = handler;
  79. }
  80. // Store the line height and page height for this particular element
  81. $.data(this, 'mousewheel-line-height', special.getLineHeight(this));
  82. $.data(this, 'mousewheel-page-height', special.getPageHeight(this));
  83. },
  84. teardown: function() {
  85. if ( this.removeEventListener ) {
  86. for ( var i = toBind.length; i; ) {
  87. this.removeEventListener( toBind[--i], handler, false );
  88. }
  89. } else {
  90. this.onmousewheel = null;
  91. }
  92. },
  93. getLineHeight: function(elem) {
  94. return parseInt($(elem)['offsetParent' in $.fn ? 'offsetParent' : 'parent']().css('fontSize'), 10);
  95. },
  96. getPageHeight: function(elem) {
  97. return $(elem).height();
  98. },
  99. settings: {
  100. adjustOldDeltas: true
  101. }
  102. };
  103. $.fn.extend({
  104. mousewheel: function(fn) {
  105. return fn ? this.bind('mousewheel', fn) : this.trigger('mousewheel');
  106. },
  107. unmousewheel: function(fn) {
  108. return this.unbind('mousewheel', fn);
  109. }
  110. });
  111. function handler(event) {
  112. var orgEvent = event || window.event,
  113. args = slice.call(arguments, 1),
  114. delta = 0,
  115. deltaX = 0,
  116. deltaY = 0,
  117. absDelta = 0;
  118. event = $.event.fix(orgEvent);
  119. event.type = 'mousewheel';
  120. // Old school scrollwheel delta
  121. if ( 'detail' in orgEvent ) { deltaY = orgEvent.detail * -1; }
  122. if ( 'wheelDelta' in orgEvent ) { deltaY = orgEvent.wheelDelta; }
  123. if ( 'wheelDeltaY' in orgEvent ) { deltaY = orgEvent.wheelDeltaY; }
  124. if ( 'wheelDeltaX' in orgEvent ) { deltaX = orgEvent.wheelDeltaX * -1; }
  125. // Firefox < 17 horizontal scrolling related to DOMMouseScroll event
  126. if ( 'axis' in orgEvent && orgEvent.axis === orgEvent.HORIZONTAL_AXIS ) {
  127. deltaX = deltaY * -1;
  128. deltaY = 0;
  129. }
  130. // Set delta to be deltaY or deltaX if deltaY is 0 for backwards compatabilitiy
  131. delta = deltaY === 0 ? deltaX : deltaY;
  132. // New school wheel delta (wheel event)
  133. if ( 'deltaY' in orgEvent ) {
  134. deltaY = orgEvent.deltaY * -1;
  135. delta = deltaY;
  136. }
  137. if ( 'deltaX' in orgEvent ) {
  138. deltaX = orgEvent.deltaX;
  139. if ( deltaY === 0 ) { delta = deltaX * -1; }
  140. }
  141. // No change actually happened, no reason to go any further
  142. if ( deltaY === 0 && deltaX === 0 ) { return; }
  143. // Need to convert lines and pages to pixels if we aren't already in pixels
  144. // There are three delta modes:
  145. // * deltaMode 0 is by pixels, nothing to do
  146. // * deltaMode 1 is by lines
  147. // * deltaMode 2 is by pages
  148. if ( orgEvent.deltaMode === 1 ) {
  149. var lineHeight = $.data(this, 'mousewheel-line-height');
  150. delta *= lineHeight;
  151. deltaY *= lineHeight;
  152. deltaX *= lineHeight;
  153. } else if ( orgEvent.deltaMode === 2 ) {
  154. var pageHeight = $.data(this, 'mousewheel-page-height');
  155. delta *= pageHeight;
  156. deltaY *= pageHeight;
  157. deltaX *= pageHeight;
  158. }
  159. // Store lowest absolute delta to normalize the delta values
  160. absDelta = Math.max( Math.abs(deltaY), Math.abs(deltaX) );
  161. if ( !lowestDelta || absDelta < lowestDelta ) {
  162. lowestDelta = absDelta;
  163. // Adjust older deltas if necessary
  164. if ( shouldAdjustOldDeltas(orgEvent, absDelta) ) {
  165. lowestDelta /= 40;
  166. }
  167. }
  168. // Adjust older deltas if necessary
  169. if ( shouldAdjustOldDeltas(orgEvent, absDelta) ) {
  170. // Divide all the things by 40!
  171. delta /= 40;
  172. deltaX /= 40;
  173. deltaY /= 40;
  174. }
  175. // Get a whole, normalized value for the deltas
  176. delta = Math[ delta >= 1 ? 'floor' : 'ceil' ](delta / lowestDelta);
  177. deltaX = Math[ deltaX >= 1 ? 'floor' : 'ceil' ](deltaX / lowestDelta);
  178. deltaY = Math[ deltaY >= 1 ? 'floor' : 'ceil' ](deltaY / lowestDelta);
  179. // Add information to the event object
  180. event.deltaX = deltaX;
  181. event.deltaY = deltaY;
  182. event.deltaFactor = lowestDelta;
  183. // Go ahead and set deltaMode to 0 since we converted to pixels
  184. // Although this is a little odd since we overwrite the deltaX/Y
  185. // properties with normalized deltas.
  186. event.deltaMode = 0;
  187. // Add event and delta to the front of the arguments
  188. args.unshift(event, delta, deltaX, deltaY);
  189. // Clearout lowestDelta after sometime to better
  190. // handle multiple device types that give different
  191. // a different lowestDelta
  192. // Ex: trackpad = 3 and mouse wheel = 120
  193. if (nullLowestDeltaTimeout) { clearTimeout(nullLowestDeltaTimeout); }
  194. nullLowestDeltaTimeout = setTimeout(nullLowestDelta, 200);
  195. return ($.event.dispatch || $.event.handle).apply(this, args);
  196. }
  197. function nullLowestDelta() {
  198. lowestDelta = null;
  199. }
  200. function shouldAdjustOldDeltas(orgEvent, absDelta) {
  201. // If this is an older event and the delta is divisable by 120,
  202. // then we are assuming that the browser is treating this as an
  203. // older mouse wheel event and that we should divide the deltas
  204. // by 40 to try and get a more usable deltaFactor.
  205. // Side note, this actually impacts the reported scroll distance
  206. // in older browsers and can cause scrolling to be slower than native.
  207. // Turn this off by setting $.event.special.mousewheel.settings.adjustOldDeltas to false.
  208. return special.settings.adjustOldDeltas && orgEvent.type === 'mousewheel' && absDelta % 120 === 0;
  209. }
  210. }));/**
  211. * @namespace jvm Holds core methods and classes used by jVectorMap.
  212. */
  213. var jvm = {
  214. /**
  215. * Inherits child's prototype from the parent's one.
  216. * @param {Function} child
  217. * @param {Function} parent
  218. */
  219. inherits: function(child, parent) {
  220. function temp() {}
  221. temp.prototype = parent.prototype;
  222. child.prototype = new temp();
  223. child.prototype.constructor = child;
  224. child.parentClass = parent;
  225. },
  226. /**
  227. * Mixes in methods from the source constructor to the target one.
  228. * @param {Function} target
  229. * @param {Function} source
  230. */
  231. mixin: function(target, source){
  232. var prop;
  233. for (prop in source.prototype) {
  234. if (source.prototype.hasOwnProperty(prop)) {
  235. target.prototype[prop] = source.prototype[prop];
  236. }
  237. }
  238. },
  239. min: function(values){
  240. var min = Number.MAX_VALUE,
  241. i;
  242. if (values instanceof Array) {
  243. for (i = 0; i < values.length; i++) {
  244. if (values[i] < min) {
  245. min = values[i];
  246. }
  247. }
  248. } else {
  249. for (i in values) {
  250. if (values[i] < min) {
  251. min = values[i];
  252. }
  253. }
  254. }
  255. return min;
  256. },
  257. max: function(values){
  258. var max = Number.MIN_VALUE,
  259. i;
  260. if (values instanceof Array) {
  261. for (i = 0; i < values.length; i++) {
  262. if (values[i] > max) {
  263. max = values[i];
  264. }
  265. }
  266. } else {
  267. for (i in values) {
  268. if (values[i] > max) {
  269. max = values[i];
  270. }
  271. }
  272. }
  273. return max;
  274. },
  275. keys: function(object){
  276. var keys = [],
  277. key;
  278. for (key in object) {
  279. keys.push(key);
  280. }
  281. return keys;
  282. },
  283. values: function(object){
  284. var values = [],
  285. key,
  286. i;
  287. for (i = 0; i < arguments.length; i++) {
  288. object = arguments[i];
  289. for (key in object) {
  290. values.push(object[key]);
  291. }
  292. }
  293. return values;
  294. },
  295. whenImageLoaded: function(url){
  296. var deferred = new jvm.$.Deferred(),
  297. img = jvm.$('<img/>');
  298. img.error(function(){
  299. deferred.reject();
  300. }).load(function(){
  301. deferred.resolve(img);
  302. });
  303. img.attr('src', url);
  304. return deferred;
  305. },
  306. isImageUrl: function(s){
  307. return /\.\w{3,4}$/.test(s);
  308. }
  309. };
  310. jvm.$ = jQuery;
  311. /**
  312. * indexOf polyfill for IE < 9
  313. * https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/indexOf
  314. */
  315. if (!Array.prototype.indexOf) {
  316. Array.prototype.indexOf = function (searchElement, fromIndex) {
  317. var k;
  318. // 1. Let O be the result of calling ToObject passing
  319. // the this value as the argument.
  320. if (this == null) {
  321. throw new TypeError('"this" is null or not defined');
  322. }
  323. var O = Object(this);
  324. // 2. Let lenValue be the result of calling the Get
  325. // internal method of O with the argument "length".
  326. // 3. Let len be ToUint32(lenValue).
  327. var len = O.length >>> 0;
  328. // 4. If len is 0, return -1.
  329. if (len === 0) {
  330. return -1;
  331. }
  332. // 5. If argument fromIndex was passed let n be
  333. // ToInteger(fromIndex); else let n be 0.
  334. var n = +fromIndex || 0;
  335. if (Math.abs(n) === Infinity) {
  336. n = 0;
  337. }
  338. // 6. If n >= len, return -1.
  339. if (n >= len) {
  340. return -1;
  341. }
  342. // 7. If n >= 0, then Let k be n.
  343. // 8. Else, n<0, Let k be len - abs(n).
  344. // If k is less than 0, then let k be 0.
  345. k = Math.max(n >= 0 ? n : len - Math.abs(n), 0);
  346. // 9. Repeat, while k < len
  347. while (k < len) {
  348. // a. Let Pk be ToString(k).
  349. // This is implicit for LHS operands of the in operator
  350. // b. Let kPresent be the result of calling the
  351. // HasProperty internal method of O with argument Pk.
  352. // This step can be combined with c
  353. // c. If kPresent is true, then
  354. // i. Let elementK be the result of calling the Get
  355. // internal method of O with the argument ToString(k).
  356. // ii. Let same be the result of applying the
  357. // Strict Equality Comparison Algorithm to
  358. // searchElement and elementK.
  359. // iii. If same is true, return k.
  360. if (k in O && O[k] === searchElement) {
  361. return k;
  362. }
  363. k++;
  364. }
  365. return -1;
  366. };
  367. }/**
  368. * Basic wrapper for DOM element.
  369. * @constructor
  370. * @param {String} name Tag name of the element
  371. * @param {Object} config Set of parameters to initialize element with
  372. */
  373. jvm.AbstractElement = function(name, config){
  374. /**
  375. * Underlying DOM element
  376. * @type {DOMElement}
  377. * @private
  378. */
  379. this.node = this.createElement(name);
  380. /**
  381. * Name of underlying element
  382. * @type {String}
  383. * @private
  384. */
  385. this.name = name;
  386. /**
  387. * Internal store of attributes
  388. * @type {Object}
  389. * @private
  390. */
  391. this.properties = {};
  392. if (config) {
  393. this.set(config);
  394. }
  395. };
  396. /**
  397. * Set attribute of the underlying DOM element.
  398. * @param {String} name Name of attribute
  399. * @param {Number|String} config Set of parameters to initialize element with
  400. */
  401. jvm.AbstractElement.prototype.set = function(property, value){
  402. var key;
  403. if (typeof property === 'object') {
  404. for (key in property) {
  405. this.properties[key] = property[key];
  406. this.applyAttr(key, property[key]);
  407. }
  408. } else {
  409. this.properties[property] = value;
  410. this.applyAttr(property, value);
  411. }
  412. };
  413. /**
  414. * Returns value of attribute.
  415. * @param {String} name Name of attribute
  416. */
  417. jvm.AbstractElement.prototype.get = function(property){
  418. return this.properties[property];
  419. };
  420. /**
  421. * Applies attribute value to the underlying DOM element.
  422. * @param {String} name Name of attribute
  423. * @param {Number|String} config Value of attribute to apply
  424. * @private
  425. */
  426. jvm.AbstractElement.prototype.applyAttr = function(property, value){
  427. this.node.setAttribute(property, value);
  428. };
  429. jvm.AbstractElement.prototype.remove = function(){
  430. jvm.$(this.node).remove();
  431. };/**
  432. * Implements abstract vector canvas.
  433. * @constructor
  434. * @param {HTMLElement} container Container to put element to.
  435. * @param {Number} width Width of canvas.
  436. * @param {Number} height Height of canvas.
  437. */
  438. jvm.AbstractCanvasElement = function(container, width, height){
  439. this.container = container;
  440. this.setSize(width, height);
  441. this.rootElement = new jvm[this.classPrefix+'GroupElement']();
  442. this.node.appendChild( this.rootElement.node );
  443. this.container.appendChild(this.node);
  444. }
  445. /**
  446. * Add element to the certain group inside of the canvas.
  447. * @param {HTMLElement} element Element to add to canvas.
  448. * @param {HTMLElement} group Group to add element into or into root group if not provided.
  449. */
  450. jvm.AbstractCanvasElement.prototype.add = function(element, group){
  451. group = group || this.rootElement;
  452. group.add(element);
  453. element.canvas = this;
  454. }
  455. /**
  456. * Create path and add it to the canvas.
  457. * @param {Object} config Parameters of path to create.
  458. * @param {Object} style Styles of the path to create.
  459. * @param {HTMLElement} group Group to add path into.
  460. */
  461. jvm.AbstractCanvasElement.prototype.addPath = function(config, style, group){
  462. var el = new jvm[this.classPrefix+'PathElement'](config, style);
  463. this.add(el, group);
  464. return el;
  465. };
  466. /**
  467. * Create circle and add it to the canvas.
  468. * @param {Object} config Parameters of path to create.
  469. * @param {Object} style Styles of the path to create.
  470. * @param {HTMLElement} group Group to add circle into.
  471. */
  472. jvm.AbstractCanvasElement.prototype.addCircle = function(config, style, group){
  473. var el = new jvm[this.classPrefix+'CircleElement'](config, style);
  474. this.add(el, group);
  475. return el;
  476. };
  477. /**
  478. * Create circle and add it to the canvas.
  479. * @param {Object} config Parameters of path to create.
  480. * @param {Object} style Styles of the path to create.
  481. * @param {HTMLElement} group Group to add circle into.
  482. */
  483. jvm.AbstractCanvasElement.prototype.addImage = function(config, style, group){
  484. var el = new jvm[this.classPrefix+'ImageElement'](config, style);
  485. this.add(el, group);
  486. return el;
  487. };
  488. /**
  489. * Create text and add it to the canvas.
  490. * @param {Object} config Parameters of path to create.
  491. * @param {Object} style Styles of the path to create.
  492. * @param {HTMLElement} group Group to add circle into.
  493. */
  494. jvm.AbstractCanvasElement.prototype.addText = function(config, style, group){
  495. var el = new jvm[this.classPrefix+'TextElement'](config, style);
  496. this.add(el, group);
  497. return el;
  498. };
  499. /**
  500. * Add group to the another group inside of the canvas.
  501. * @param {HTMLElement} group Group to add circle into or root group if not provided.
  502. */
  503. jvm.AbstractCanvasElement.prototype.addGroup = function(parentGroup){
  504. var el = new jvm[this.classPrefix+'GroupElement']();
  505. if (parentGroup) {
  506. parentGroup.node.appendChild(el.node);
  507. } else {
  508. this.node.appendChild(el.node);
  509. }
  510. el.canvas = this;
  511. return el;
  512. };/**
  513. * Abstract shape element. Shape element represents some visual vector or raster object.
  514. * @constructor
  515. * @param {String} name Tag name of the element.
  516. * @param {Object} config Set of parameters to initialize element with.
  517. * @param {Object} style Object with styles to set on element initialization.
  518. */
  519. jvm.AbstractShapeElement = function(name, config, style){
  520. this.style = style || {};
  521. this.style.current = this.style.current || {};
  522. this.isHovered = false;
  523. this.isSelected = false;
  524. this.updateStyle();
  525. };
  526. /**
  527. * Set element's style.
  528. * @param {Object|String} property Could be string to set only one property or object to set several style properties at once.
  529. * @param {String} value Value to set in case only one property should be set.
  530. */
  531. jvm.AbstractShapeElement.prototype.setStyle = function(property, value){
  532. var styles = {};
  533. if (typeof property === 'object') {
  534. styles = property;
  535. } else {
  536. styles[property] = value;
  537. }
  538. jvm.$.extend(this.style.current, styles);
  539. this.updateStyle();
  540. };
  541. jvm.AbstractShapeElement.prototype.updateStyle = function(){
  542. var attrs = {};
  543. jvm.AbstractShapeElement.mergeStyles(attrs, this.style.initial);
  544. jvm.AbstractShapeElement.mergeStyles(attrs, this.style.current);
  545. if (this.isHovered) {
  546. jvm.AbstractShapeElement.mergeStyles(attrs, this.style.hover);
  547. }
  548. if (this.isSelected) {
  549. jvm.AbstractShapeElement.mergeStyles(attrs, this.style.selected);
  550. if (this.isHovered) {
  551. jvm.AbstractShapeElement.mergeStyles(attrs, this.style.selectedHover);
  552. }
  553. }
  554. this.set(attrs);
  555. };
  556. jvm.AbstractShapeElement.mergeStyles = function(styles, newStyles){
  557. var key;
  558. newStyles = newStyles || {};
  559. for (key in newStyles) {
  560. if (newStyles[key] === null) {
  561. delete styles[key];
  562. } else {
  563. styles[key] = newStyles[key];
  564. }
  565. }
  566. }/**
  567. * Wrapper for SVG element.
  568. * @constructor
  569. * @extends jvm.AbstractElement
  570. * @param {String} name Tag name of the element
  571. * @param {Object} config Set of parameters to initialize element with
  572. */
  573. jvm.SVGElement = function(name, config){
  574. jvm.SVGElement.parentClass.apply(this, arguments);
  575. }
  576. jvm.inherits(jvm.SVGElement, jvm.AbstractElement);
  577. jvm.SVGElement.svgns = "http://www.w3.org/2000/svg";
  578. /**
  579. * Creates DOM element.
  580. * @param {String} tagName Name of element
  581. * @private
  582. * @returns DOMElement
  583. */
  584. jvm.SVGElement.prototype.createElement = function( tagName ){
  585. return document.createElementNS( jvm.SVGElement.svgns, tagName );
  586. };
  587. /**
  588. * Adds CSS class for underlying DOM element.
  589. * @param {String} className Name of CSS class name
  590. */
  591. jvm.SVGElement.prototype.addClass = function( className ){
  592. this.node.setAttribute('class', className);
  593. };
  594. /**
  595. * Returns constructor for element by name prefixed with 'VML'.
  596. * @param {String} ctr Name of basic constructor to return
  597. * proper implementation for.
  598. * @returns Function
  599. * @private
  600. */
  601. jvm.SVGElement.prototype.getElementCtr = function( ctr ){
  602. return jvm['SVG'+ctr];
  603. };
  604. jvm.SVGElement.prototype.getBBox = function(){
  605. return this.node.getBBox();
  606. };jvm.SVGGroupElement = function(){
  607. jvm.SVGGroupElement.parentClass.call(this, 'g');
  608. }
  609. jvm.inherits(jvm.SVGGroupElement, jvm.SVGElement);
  610. jvm.SVGGroupElement.prototype.add = function(element){
  611. this.node.appendChild( element.node );
  612. };jvm.SVGCanvasElement = function(container, width, height){
  613. this.classPrefix = 'SVG';
  614. jvm.SVGCanvasElement.parentClass.call(this, 'svg');
  615. this.defsElement = new jvm.SVGElement('defs');
  616. this.node.appendChild( this.defsElement.node );
  617. jvm.AbstractCanvasElement.apply(this, arguments);
  618. }
  619. jvm.inherits(jvm.SVGCanvasElement, jvm.SVGElement);
  620. jvm.mixin(jvm.SVGCanvasElement, jvm.AbstractCanvasElement);
  621. jvm.SVGCanvasElement.prototype.setSize = function(width, height){
  622. this.width = width;
  623. this.height = height;
  624. this.node.setAttribute('width', width);
  625. this.node.setAttribute('height', height);
  626. };
  627. jvm.SVGCanvasElement.prototype.applyTransformParams = function(scale, transX, transY) {
  628. this.scale = scale;
  629. this.transX = transX;
  630. this.transY = transY;
  631. this.rootElement.node.setAttribute('transform', 'scale('+scale+') translate('+transX+', '+transY+')');
  632. };jvm.SVGShapeElement = function(name, config, style){
  633. jvm.SVGShapeElement.parentClass.call(this, name, config);
  634. jvm.AbstractShapeElement.apply(this, arguments);
  635. };
  636. jvm.inherits(jvm.SVGShapeElement, jvm.SVGElement);
  637. jvm.mixin(jvm.SVGShapeElement, jvm.AbstractShapeElement);
  638. jvm.SVGShapeElement.prototype.applyAttr = function(attr, value){
  639. var patternEl,
  640. imageEl,
  641. that = this;
  642. if (attr === 'fill' && jvm.isImageUrl(value)) {
  643. if (!jvm.SVGShapeElement.images[value]) {
  644. jvm.whenImageLoaded(value).then(function(img){
  645. imageEl = new jvm.SVGElement('image');
  646. imageEl.node.setAttributeNS('http://www.w3.org/1999/xlink', 'href', value);
  647. imageEl.applyAttr('x', '0');
  648. imageEl.applyAttr('y', '0');
  649. imageEl.applyAttr('width', img[0].width);
  650. imageEl.applyAttr('height', img[0].height);
  651. patternEl = new jvm.SVGElement('pattern');
  652. patternEl.applyAttr('id', 'image'+jvm.SVGShapeElement.imageCounter);
  653. patternEl.applyAttr('x', 0);
  654. patternEl.applyAttr('y', 0);
  655. patternEl.applyAttr('width', img[0].width / 2);
  656. patternEl.applyAttr('height', img[0].height / 2);
  657. patternEl.applyAttr('viewBox', '0 0 '+img[0].width+' '+img[0].height);
  658. patternEl.applyAttr('patternUnits', 'userSpaceOnUse');
  659. patternEl.node.appendChild( imageEl.node );
  660. that.canvas.defsElement.node.appendChild( patternEl.node );
  661. jvm.SVGShapeElement.images[value] = jvm.SVGShapeElement.imageCounter++;
  662. that.applyAttr('fill', 'url(#image'+jvm.SVGShapeElement.images[value]+')');
  663. });
  664. } else {
  665. this.applyAttr('fill', 'url(#image'+jvm.SVGShapeElement.images[value]+')');
  666. }
  667. } else {
  668. jvm.SVGShapeElement.parentClass.prototype.applyAttr.apply(this, arguments);
  669. }
  670. };
  671. jvm.SVGShapeElement.imageCounter = 1;
  672. jvm.SVGShapeElement.images = {};jvm.SVGPathElement = function(config, style){
  673. jvm.SVGPathElement.parentClass.call(this, 'path', config, style);
  674. this.node.setAttribute('fill-rule', 'evenodd');
  675. }
  676. jvm.inherits(jvm.SVGPathElement, jvm.SVGShapeElement);jvm.SVGCircleElement = function(config, style){
  677. jvm.SVGCircleElement.parentClass.call(this, 'circle', config, style);
  678. };
  679. jvm.inherits(jvm.SVGCircleElement, jvm.SVGShapeElement);jvm.SVGImageElement = function(config, style){
  680. jvm.SVGImageElement.parentClass.call(this, 'image', config, style);
  681. };
  682. jvm.inherits(jvm.SVGImageElement, jvm.SVGShapeElement);
  683. jvm.SVGImageElement.prototype.applyAttr = function(attr, value){
  684. var that = this;
  685. if (attr == 'image') {
  686. jvm.whenImageLoaded(value).then(function(img){
  687. that.node.setAttributeNS('http://www.w3.org/1999/xlink', 'href', value);
  688. that.width = img[0].width;
  689. that.height = img[0].height;
  690. that.applyAttr('width', that.width);
  691. that.applyAttr('height', that.height);
  692. that.applyAttr('x', that.cx - that.width / 2);
  693. that.applyAttr('y', that.cy - that.height / 2);
  694. jvm.$(that.node).trigger('imageloaded', [img]);
  695. });
  696. } else if(attr == 'cx') {
  697. this.cx = value;
  698. if (this.width) {
  699. this.applyAttr('x', value - this.width / 2);
  700. }
  701. } else if(attr == 'cy') {
  702. this.cy = value;
  703. if (this.height) {
  704. this.applyAttr('y', value - this.height / 2);
  705. }
  706. } else {
  707. jvm.SVGImageElement.parentClass.prototype.applyAttr.apply(this, arguments);
  708. }
  709. };jvm.SVGTextElement = function(config, style){
  710. jvm.SVGTextElement.parentClass.call(this, 'text', config, style);
  711. }
  712. jvm.inherits(jvm.SVGTextElement, jvm.SVGShapeElement);
  713. jvm.SVGTextElement.prototype.applyAttr = function(attr, value){
  714. if (attr === 'text') {
  715. this.node.textContent = value;
  716. } else {
  717. jvm.SVGTextElement.parentClass.prototype.applyAttr.apply(this, arguments);
  718. }
  719. };/**
  720. * Wrapper for VML element.
  721. * @constructor
  722. * @extends jvm.AbstractElement
  723. * @param {String} name Tag name of the element
  724. * @param {Object} config Set of parameters to initialize element with
  725. */
  726. jvm.VMLElement = function(name, config){
  727. if (!jvm.VMLElement.VMLInitialized) {
  728. jvm.VMLElement.initializeVML();
  729. }
  730. jvm.VMLElement.parentClass.apply(this, arguments);
  731. };
  732. jvm.inherits(jvm.VMLElement, jvm.AbstractElement);
  733. /**
  734. * Shows if VML was already initialized for the current document or not.
  735. * @static
  736. * @private
  737. * @type {Boolean}
  738. */
  739. jvm.VMLElement.VMLInitialized = false;
  740. /**
  741. * Initializes VML handling before creating the first element
  742. * (adds CSS class and creates namespace). Adds one of two forms
  743. * of createElement method depending of support by browser.
  744. * @static
  745. * @private
  746. */
  747. // The following method of VML handling is borrowed from the
  748. // Raphael library by Dmitry Baranovsky.
  749. jvm.VMLElement.initializeVML = function(){
  750. try {
  751. if (!document.namespaces.rvml) {
  752. document.namespaces.add("rvml","urn:schemas-microsoft-com:vml");
  753. }
  754. /**
  755. * Creates DOM element.
  756. * @param {String} tagName Name of element
  757. * @private
  758. * @returns DOMElement
  759. */
  760. jvm.VMLElement.prototype.createElement = function (tagName) {
  761. return document.createElement('<rvml:' + tagName + ' class="rvml">');
  762. };
  763. } catch (e) {
  764. /**
  765. * @private
  766. */
  767. jvm.VMLElement.prototype.createElement = function (tagName) {
  768. return document.createElement('<' + tagName + ' xmlns="urn:schemas-microsoft.com:vml" class="rvml">');
  769. };
  770. }
  771. document.createStyleSheet().addRule(".rvml", "behavior:url(#default#VML)");
  772. jvm.VMLElement.VMLInitialized = true;
  773. };
  774. /**
  775. * Returns constructor for element by name prefixed with 'VML'.
  776. * @param {String} ctr Name of basic constructor to return
  777. * proper implementation for.
  778. * @returns Function
  779. * @private
  780. */
  781. jvm.VMLElement.prototype.getElementCtr = function( ctr ){
  782. return jvm['VML'+ctr];
  783. };
  784. /**
  785. * Adds CSS class for underlying DOM element.
  786. * @param {String} className Name of CSS class name
  787. */
  788. jvm.VMLElement.prototype.addClass = function( className ){
  789. jvm.$(this.node).addClass(className);
  790. };
  791. /**
  792. * Applies attribute value to the underlying DOM element.
  793. * @param {String} name Name of attribute
  794. * @param {Number|String} config Value of attribute to apply
  795. * @private
  796. */
  797. jvm.VMLElement.prototype.applyAttr = function( attr, value ){
  798. this.node[attr] = value;
  799. };
  800. /**
  801. * Returns boundary box for the element.
  802. * @returns {Object} Boundary box with numeric fields: x, y, width, height
  803. * @override
  804. */
  805. jvm.VMLElement.prototype.getBBox = function(){
  806. var node = jvm.$(this.node);
  807. return {
  808. x: node.position().left / this.canvas.scale,
  809. y: node.position().top / this.canvas.scale,
  810. width: node.width() / this.canvas.scale,
  811. height: node.height() / this.canvas.scale
  812. };
  813. };jvm.VMLGroupElement = function(){
  814. jvm.VMLGroupElement.parentClass.call(this, 'group');
  815. this.node.style.left = '0px';
  816. this.node.style.top = '0px';
  817. this.node.coordorigin = "0 0";
  818. };
  819. jvm.inherits(jvm.VMLGroupElement, jvm.VMLElement);
  820. jvm.VMLGroupElement.prototype.add = function(element){
  821. this.node.appendChild( element.node );
  822. };jvm.VMLCanvasElement = function(container, width, height){
  823. this.classPrefix = 'VML';
  824. jvm.VMLCanvasElement.parentClass.call(this, 'group');
  825. jvm.AbstractCanvasElement.apply(this, arguments);
  826. this.node.style.position = 'absolute';
  827. };
  828. jvm.inherits(jvm.VMLCanvasElement, jvm.VMLElement);
  829. jvm.mixin(jvm.VMLCanvasElement, jvm.AbstractCanvasElement);
  830. jvm.VMLCanvasElement.prototype.setSize = function(width, height){
  831. var paths,
  832. groups,
  833. i,
  834. l;
  835. this.width = width;
  836. this.height = height;
  837. this.node.style.width = width + "px";
  838. this.node.style.height = height + "px";
  839. this.node.coordsize = width+' '+height;
  840. this.node.coordorigin = "0 0";
  841. if (this.rootElement) {
  842. paths = this.rootElement.node.getElementsByTagName('shape');
  843. for(i = 0, l = paths.length; i < l; i++) {
  844. paths[i].coordsize = width+' '+height;
  845. paths[i].style.width = width+'px';
  846. paths[i].style.height = height+'px';
  847. }
  848. groups = this.node.getElementsByTagName('group');
  849. for(i = 0, l = groups.length; i < l; i++) {
  850. groups[i].coordsize = width+' '+height;
  851. groups[i].style.width = width+'px';
  852. groups[i].style.height = height+'px';
  853. }
  854. }
  855. };
  856. jvm.VMLCanvasElement.prototype.applyTransformParams = function(scale, transX, transY) {
  857. this.scale = scale;
  858. this.transX = transX;
  859. this.transY = transY;
  860. this.rootElement.node.coordorigin = (this.width-transX-this.width/100)+','+(this.height-transY-this.height/100);
  861. this.rootElement.node.coordsize = this.width/scale+','+this.height/scale;
  862. };jvm.VMLShapeElement = function(name, config){
  863. jvm.VMLShapeElement.parentClass.call(this, name, config);
  864. this.fillElement = new jvm.VMLElement('fill');
  865. this.strokeElement = new jvm.VMLElement('stroke');
  866. this.node.appendChild(this.fillElement.node);
  867. this.node.appendChild(this.strokeElement.node);
  868. this.node.stroked = false;
  869. jvm.AbstractShapeElement.apply(this, arguments);
  870. };
  871. jvm.inherits(jvm.VMLShapeElement, jvm.VMLElement);
  872. jvm.mixin(jvm.VMLShapeElement, jvm.AbstractShapeElement);
  873. jvm.VMLShapeElement.prototype.applyAttr = function(attr, value){
  874. switch (attr) {
  875. case 'fill':
  876. this.node.fillcolor = value;
  877. break;
  878. case 'fill-opacity':
  879. this.fillElement.node.opacity = Math.round(value*100)+'%';
  880. break;
  881. case 'stroke':
  882. if (value === 'none') {
  883. this.node.stroked = false;
  884. } else {
  885. this.node.stroked = true;
  886. }
  887. this.node.strokecolor = value;
  888. break;
  889. case 'stroke-opacity':
  890. this.strokeElement.node.opacity = Math.round(value*100)+'%';
  891. break;
  892. case 'stroke-width':
  893. if (parseInt(value, 10) === 0) {
  894. this.node.stroked = false;
  895. } else {
  896. this.node.stroked = true;
  897. }
  898. this.node.strokeweight = value;
  899. break;
  900. case 'd':
  901. this.node.path = jvm.VMLPathElement.pathSvgToVml(value);
  902. break;
  903. default:
  904. jvm.VMLShapeElement.parentClass.prototype.applyAttr.apply(this, arguments);
  905. }
  906. };jvm.VMLPathElement = function(config, style){
  907. var scale = new jvm.VMLElement('skew');
  908. jvm.VMLPathElement.parentClass.call(this, 'shape', config, style);
  909. this.node.coordorigin = "0 0";
  910. scale.node.on = true;
  911. scale.node.matrix = '0.01,0,0,0.01,0,0';
  912. scale.node.offset = '0,0';
  913. this.node.appendChild(scale.node);
  914. };
  915. jvm.inherits(jvm.VMLPathElement, jvm.VMLShapeElement);
  916. jvm.VMLPathElement.prototype.applyAttr = function(attr, value){
  917. if (attr === 'd') {
  918. this.node.path = jvm.VMLPathElement.pathSvgToVml(value);
  919. } else {
  920. jvm.VMLShapeElement.prototype.applyAttr.call(this, attr, value);
  921. }
  922. };
  923. jvm.VMLPathElement.pathSvgToVml = function(path) {
  924. var cx = 0, cy = 0, ctrlx, ctrly;
  925. path = path.replace(/(-?\d+)e(-?\d+)/g, '0');
  926. return path.replace(/([MmLlHhVvCcSs])\s*((?:-?\d*(?:\.\d+)?\s*,?\s*)+)/g, function(segment, letter, coords, index){
  927. coords = coords.replace(/(\d)-/g, '$1,-')
  928. .replace(/^\s+/g, '')
  929. .replace(/\s+$/g, '')
  930. .replace(/\s+/g, ',').split(',');
  931. if (!coords[0]) coords.shift();
  932. for (var i=0, l=coords.length; i<l; i++) {
  933. coords[i] = Math.round(100*coords[i]);
  934. }
  935. switch (letter) {
  936. case 'm':
  937. cx += coords[0];
  938. cy += coords[1];
  939. return 't'+coords.join(',');
  940. case 'M':
  941. cx = coords[0];
  942. cy = coords[1];
  943. return 'm'+coords.join(',');
  944. case 'l':
  945. cx += coords[0];
  946. cy += coords[1];
  947. return 'r'+coords.join(',');
  948. case 'L':
  949. cx = coords[0];
  950. cy = coords[1];
  951. return 'l'+coords.join(',');
  952. case 'h':
  953. cx += coords[0];
  954. return 'r'+coords[0]+',0';
  955. case 'H':
  956. cx = coords[0];
  957. return 'l'+cx+','+cy;
  958. case 'v':
  959. cy += coords[0];
  960. return 'r0,'+coords[0];
  961. case 'V':
  962. cy = coords[0];
  963. return 'l'+cx+','+cy;
  964. case 'c':
  965. ctrlx = cx + coords[coords.length-4];
  966. ctrly = cy + coords[coords.length-3];
  967. cx += coords[coords.length-2];
  968. cy += coords[coords.length-1];
  969. return 'v'+coords.join(',');
  970. case 'C':
  971. ctrlx = coords[coords.length-4];
  972. ctrly = coords[coords.length-3];
  973. cx = coords[coords.length-2];
  974. cy = coords[coords.length-1];
  975. return 'c'+coords.join(',');
  976. case 's':
  977. coords.unshift(cy-ctrly);
  978. coords.unshift(cx-ctrlx);
  979. ctrlx = cx + coords[coords.length-4];
  980. ctrly = cy + coords[coords.length-3];
  981. cx += coords[coords.length-2];
  982. cy += coords[coords.length-1];
  983. return 'v'+coords.join(',');
  984. case 'S':
  985. coords.unshift(cy+cy-ctrly);
  986. coords.unshift(cx+cx-ctrlx);
  987. ctrlx = coords[coords.length-4];
  988. ctrly = coords[coords.length-3];
  989. cx = coords[coords.length-2];
  990. cy = coords[coords.length-1];
  991. return 'c'+coords.join(',');
  992. }
  993. return '';
  994. }).replace(/z/g, 'e');
  995. };jvm.VMLCircleElement = function(config, style){
  996. jvm.VMLCircleElement.parentClass.call(this, 'oval', config, style);
  997. };
  998. jvm.inherits(jvm.VMLCircleElement, jvm.VMLShapeElement);
  999. jvm.VMLCircleElement.prototype.applyAttr = function(attr, value){
  1000. switch (attr) {
  1001. case 'r':
  1002. this.node.style.width = value*2+'px';
  1003. this.node.style.height = value*2+'px';
  1004. this.applyAttr('cx', this.get('cx') || 0);
  1005. this.applyAttr('cy', this.get('cy') || 0);
  1006. break;
  1007. case 'cx':
  1008. if (!value) return;
  1009. this.node.style.left = value - (this.get('r') || 0) + 'px';
  1010. break;
  1011. case 'cy':
  1012. if (!value) return;
  1013. this.node.style.top = value - (this.get('r') || 0) + 'px';
  1014. break;
  1015. default:
  1016. jvm.VMLCircleElement.parentClass.prototype.applyAttr.call(this, attr, value);
  1017. }
  1018. };/**
  1019. * Class for vector images manipulations.
  1020. * @constructor
  1021. * @param {DOMElement} container to place canvas to
  1022. * @param {Number} width
  1023. * @param {Number} height
  1024. */
  1025. jvm.VectorCanvas = function(container, width, height) {
  1026. this.mode = window.SVGAngle ? 'svg' : 'vml';
  1027. if (this.mode == 'svg') {
  1028. this.impl = new jvm.SVGCanvasElement(container, width, height);
  1029. } else {
  1030. this.impl = new jvm.VMLCanvasElement(container, width, height);
  1031. }
  1032. this.impl.mode = this.mode;
  1033. return this.impl;
  1034. };jvm.SimpleScale = function(scale){
  1035. this.scale = scale;
  1036. };
  1037. jvm.SimpleScale.prototype.getValue = function(value){
  1038. return value;
  1039. };jvm.OrdinalScale = function(scale){
  1040. this.scale = scale;
  1041. };
  1042. jvm.OrdinalScale.prototype.getValue = function(value){
  1043. return this.scale[value];
  1044. };
  1045. jvm.OrdinalScale.prototype.getTicks = function(){
  1046. var ticks = [],
  1047. key;
  1048. for (key in this.scale) {
  1049. ticks.push({
  1050. label: key,
  1051. value: this.scale[key]
  1052. });
  1053. }
  1054. return ticks;
  1055. };jvm.NumericScale = function(scale, normalizeFunction, minValue, maxValue) {
  1056. this.scale = [];
  1057. normalizeFunction = normalizeFunction || 'linear';
  1058. if (scale) this.setScale(scale);
  1059. if (normalizeFunction) this.setNormalizeFunction(normalizeFunction);
  1060. if (typeof minValue !== 'undefined' ) this.setMin(minValue);
  1061. if (typeof maxValue !== 'undefined' ) this.setMax(maxValue);
  1062. };
  1063. jvm.NumericScale.prototype = {
  1064. setMin: function(min) {
  1065. this.clearMinValue = min;
  1066. if (typeof this.normalize === 'function') {
  1067. this.minValue = this.normalize(min);
  1068. } else {
  1069. this.minValue = min;
  1070. }
  1071. },
  1072. setMax: function(max) {
  1073. this.clearMaxValue = max;
  1074. if (typeof this.normalize === 'function') {
  1075. this.maxValue = this.normalize(max);
  1076. } else {
  1077. this.maxValue = max;
  1078. }
  1079. },
  1080. setScale: function(scale) {
  1081. var i;
  1082. this.scale = [];
  1083. for (i = 0; i < scale.length; i++) {
  1084. this.scale[i] = [scale[i]];
  1085. }
  1086. },
  1087. setNormalizeFunction: function(f) {
  1088. if (f === 'polynomial') {
  1089. this.normalize = function(value) {
  1090. return Math.pow(value, 0.2);
  1091. }
  1092. } else if (f === 'linear') {
  1093. delete this.normalize;
  1094. } else {
  1095. this.normalize = f;
  1096. }
  1097. this.setMin(this.clearMinValue);
  1098. this.setMax(this.clearMaxValue);
  1099. },
  1100. getValue: function(value) {
  1101. var lengthes = [],
  1102. fullLength = 0,
  1103. l,
  1104. i = 0,
  1105. c;
  1106. if (typeof this.normalize === 'function') {
  1107. value = this.normalize(value);
  1108. }
  1109. for (i = 0; i < this.scale.length-1; i++) {
  1110. l = this.vectorLength(this.vectorSubtract(this.scale[i+1], this.scale[i]));
  1111. lengthes.push(l);
  1112. fullLength += l;
  1113. }
  1114. c = (this.maxValue - this.minValue) / fullLength;
  1115. for (i=0; i<lengthes.length; i++) {
  1116. lengthes[i] *= c;
  1117. }
  1118. i = 0;
  1119. value -= this.minValue;
  1120. while (value - lengthes[i] >= 0) {
  1121. value -= lengthes[i];
  1122. i++;
  1123. }
  1124. if (i == this.scale.length - 1) {
  1125. value = this.vectorToNum(this.scale[i])
  1126. } else {
  1127. value = (
  1128. this.vectorToNum(
  1129. this.vectorAdd(this.scale[i],
  1130. this.vectorMult(
  1131. this.vectorSubtract(this.scale[i+1], this.scale[i]),
  1132. (value) / (lengthes[i])
  1133. )
  1134. )
  1135. )
  1136. );
  1137. }
  1138. return value;
  1139. },
  1140. vectorToNum: function(vector) {
  1141. var num = 0,
  1142. i;
  1143. for (i = 0; i < vector.length; i++) {
  1144. num += Math.round(vector[i])*Math.pow(256, vector.length-i-1);
  1145. }
  1146. return num;
  1147. },
  1148. vectorSubtract: function(vector1, vector2) {
  1149. var vector = [],
  1150. i;
  1151. for (i = 0; i < vector1.length; i++) {
  1152. vector[i] = vector1[i] - vector2[i];
  1153. }
  1154. return vector;
  1155. },
  1156. vectorAdd: function(vector1, vector2) {
  1157. var vector = [],
  1158. i;
  1159. for (i = 0; i < vector1.length; i++) {
  1160. vector[i] = vector1[i] + vector2[i];
  1161. }
  1162. return vector;
  1163. },
  1164. vectorMult: function(vector, num) {
  1165. var result = [],
  1166. i;
  1167. for (i = 0; i < vector.length; i++) {
  1168. result[i] = vector[i] * num;
  1169. }
  1170. return result;
  1171. },
  1172. vectorLength: function(vector) {
  1173. var result = 0,
  1174. i;
  1175. for (i = 0; i < vector.length; i++) {
  1176. result += vector[i] * vector[i];
  1177. }
  1178. return Math.sqrt(result);
  1179. },
  1180. /* Derived from d3 implementation https://github.com/mbostock/d3/blob/master/src/scale/linear.js#L94 */
  1181. getTicks: function(){
  1182. var m = 5,
  1183. extent = [this.clearMinValue, this.clearMaxValue],
  1184. span = extent[1] - extent[0],
  1185. step = Math.pow(10, Math.floor(Math.log(span / m) / Math.LN10)),
  1186. err = m / span * step,
  1187. ticks = [],
  1188. tick,
  1189. v;
  1190. if (err <= .15) step *= 10;
  1191. else if (err <= .35) step *= 5;
  1192. else if (err <= .75) step *= 2;
  1193. extent[0] = Math.floor(extent[0] / step) * step;
  1194. extent[1] = Math.ceil(extent[1] / step) * step;
  1195. tick = extent[0];
  1196. while (tick <= extent[1]) {
  1197. if (tick == extent[0]) {
  1198. v = this.clearMinValue;
  1199. } else if (tick == extent[1]) {
  1200. v = this.clearMaxValue;
  1201. } else {
  1202. v = tick;
  1203. }
  1204. ticks.push({
  1205. label: tick,
  1206. value: this.getValue(v)
  1207. });
  1208. tick += step;
  1209. }
  1210. return ticks;
  1211. }
  1212. };
  1213. jvm.ColorScale = function(colors, normalizeFunction, minValue, maxValue) {
  1214. jvm.ColorScale.parentClass.apply(this, arguments);
  1215. }
  1216. jvm.inherits(jvm.ColorScale, jvm.NumericScale);
  1217. jvm.ColorScale.prototype.setScale = function(scale) {
  1218. var i;
  1219. for (i = 0; i < scale.length; i++) {
  1220. this.scale[i] = jvm.ColorScale.rgbToArray(scale[i]);
  1221. }
  1222. };
  1223. jvm.ColorScale.prototype.getValue = function(value) {
  1224. return jvm.ColorScale.numToRgb(jvm.ColorScale.parentClass.prototype.getValue.call(this, value));
  1225. };
  1226. jvm.ColorScale.arrayToRgb = function(ar) {
  1227. var rgb = '#',
  1228. d,
  1229. i;
  1230. for (i = 0; i < ar.length; i++) {
  1231. d = ar[i].toString(16);
  1232. rgb += d.length == 1 ? '0'+d : d;
  1233. }
  1234. return rgb;
  1235. };
  1236. jvm.ColorScale.numToRgb = function(num) {
  1237. num = num.toString(16);
  1238. while (num.length < 6) {
  1239. num = '0' + num;
  1240. }
  1241. return '#'+num;
  1242. };
  1243. jvm.ColorScale.rgbToArray = function(rgb) {
  1244. rgb = rgb.substr(1);
  1245. return [parseInt(rgb.substr(0, 2), 16), parseInt(rgb.substr(2, 2), 16), parseInt(rgb.substr(4, 2), 16)];
  1246. };/**
  1247. * Represents map legend.
  1248. * @constructor
  1249. * @param {Object} params Configuration parameters.
  1250. * @param {String} params.cssClass Additional CSS class to apply to legend element.
  1251. * @param {Boolean} params.vertical If <code>true</code> legend will be rendered as vertical.
  1252. * @param {String} params.title Legend title.
  1253. * @param {Function} params.labelRender Method to convert series values to legend labels.
  1254. */
  1255. jvm.Legend = function(params) {
  1256. this.params = params || {};
  1257. this.map = this.params.map;
  1258. this.series = this.params.series;
  1259. this.body = jvm.$('<div/>');
  1260. this.body.addClass('jvectormap-legend');
  1261. if (this.params.cssClass) {
  1262. this.body.addClass(this.params.cssClass);
  1263. }
  1264. if (params.vertical) {
  1265. this.map.legendCntVertical.append( this.body );
  1266. } else {
  1267. this.map.legendCntHorizontal.append( this.body );
  1268. }
  1269. this.render();
  1270. }
  1271. jvm.Legend.prototype.render = function(){
  1272. var ticks = this.series.scale.getTicks(),
  1273. i,
  1274. inner = jvm.$('<div/>').addClass('jvectormap-legend-inner'),
  1275. tick,
  1276. sample,
  1277. label;
  1278. this.body.html('');
  1279. if (this.params.title) {
  1280. this.body.append(
  1281. jvm.$('<div/>').addClass('jvectormap-legend-title').html(this.params.title)
  1282. );
  1283. }
  1284. this.body.append(inner);
  1285. for (i = 0; i < ticks.length; i++) {
  1286. tick = jvm.$('<div/>').addClass('jvectormap-legend-tick');
  1287. sample = jvm.$('<div/>').addClass('jvectormap-legend-tick-sample');
  1288. switch (this.series.params.attribute) {
  1289. case 'fill':
  1290. if (jvm.isImageUrl(ticks[i].value)) {
  1291. sample.css('background', 'url('+ticks[i].value+')');
  1292. } else {
  1293. sample.css('background', ticks[i].value);
  1294. }
  1295. break;
  1296. case 'stroke':
  1297. sample.css('background', ticks[i].value);
  1298. break;
  1299. case 'image':
  1300. sample.css('background', 'url('+ticks[i].value+') no-repeat center center');
  1301. break;
  1302. case 'r':
  1303. jvm.$('<div/>').css({
  1304. 'border-radius': ticks[i].value,
  1305. border: this.map.params.markerStyle.initial['stroke-width']+'px '+
  1306. this.map.params.markerStyle.initial['stroke']+' solid',
  1307. width: ticks[i].value * 2 + 'px',
  1308. height: ticks[i].value * 2 + 'px',
  1309. background: this.map.params.markerStyle.initial['fill']
  1310. }).appendTo(sample);
  1311. break;
  1312. }
  1313. tick.append( sample );
  1314. label = ticks[i].label;
  1315. if (this.params.labelRender) {
  1316. label = this.params.labelRender(label);
  1317. }
  1318. tick.append( jvm.$('<div>'+label+' </div>').addClass('jvectormap-legend-tick-text') );
  1319. inner.append(tick);
  1320. }
  1321. inner.append( jvm.$('<div/>').css('clear', 'both') );
  1322. }/**
  1323. * Creates data series.
  1324. * @constructor
  1325. * @param {Object} params Parameters to initialize series with.
  1326. * @param {Array} params.values The data set to visualize.
  1327. * @param {String} params.attribute Numberic or color attribute to use for data visualization. This could be: <code>fill</code>, <code>stroke</code>, <code>fill-opacity</code>, <code>stroke-opacity</code> for markers and regions and <code>r</code> (radius) for markers only.
  1328. * @param {Array} params.scale Values used to map a dimension of data to a visual representation. The first value sets visualization for minimum value from the data set and the last value sets visualization for the maximum value. There also could be intermidiate values. Default value is <code>['#C8EEFF', '#0071A4']</code>
  1329. * @param {Function|String} params.normalizeFunction The function used to map input values to the provided scale. This parameter could be provided as function or one of the strings: <code>'linear'</code> or <code>'polynomial'</code>, while <code>'linear'</code> is used by default. The function provided takes value from the data set as an input and returns corresponding value from the scale.
  1330. * @param {Number} params.min Minimum value of the data set. Could be calculated automatically if not provided.
  1331. * @param {Number} params.min Maximum value of the data set. Could be calculated automatically if not provided.
  1332. */
  1333. jvm.DataSeries = function(params, elements, map) {
  1334. var scaleConstructor;
  1335. params = params || {};
  1336. params.attribute = params.attribute || 'fill';
  1337. this.elements = elements;
  1338. this.params = params;
  1339. this.map = map;
  1340. if (params.attributes) {
  1341. this.setAttributes(params.attributes);
  1342. }
  1343. if (jvm.$.isArray(params.scale)) {
  1344. scaleConstructor = (params.attribute === 'fill' || params.attribute === 'stroke') ? jvm.ColorScale : jvm.NumericScale;
  1345. this.scale = new scaleConstructor(params.scale, params.normalizeFunction, params.min, params.max);
  1346. } else if (params.scale) {
  1347. this.scale = new jvm.OrdinalScale(params.scale);
  1348. } else {
  1349. this.scale = new jvm.SimpleScale(params.scale);
  1350. }
  1351. this.values = params.values || {};
  1352. this.setValues(this.values);
  1353. if (this.params.legend) {
  1354. this.legend = new jvm.Legend($.extend({
  1355. map: this.map,
  1356. series: this
  1357. }, this.params.legend))
  1358. }
  1359. };
  1360. jvm.DataSeries.prototype = {
  1361. setAttributes: function(key, attr){
  1362. var attrs = key,
  1363. code;
  1364. if (typeof key == 'string') {
  1365. if (this.elements[key]) {
  1366. this.elements[key].setStyle(this.params.attribute, attr);
  1367. }
  1368. } else {
  1369. for (code in attrs) {
  1370. if (this.elements[code]) {
  1371. this.elements[code].element.setStyle(this.params.attribute, attrs[code]);
  1372. }
  1373. }
  1374. }
  1375. },
  1376. /**
  1377. * Set values for the data set.
  1378. * @param {Object} values Object which maps codes of regions or markers to values.
  1379. */
  1380. setValues: function(values) {
  1381. var max = -Number.MAX_VALUE,
  1382. min = Number.MAX_VALUE,
  1383. val,
  1384. cc,
  1385. attrs = {};
  1386. if (!(this.scale instanceof jvm.OrdinalScale) && !(this.scale instanceof jvm.SimpleScale)) {
  1387. // we have a color scale as an array
  1388. if (typeof this.params.min === 'undefined' || typeof this.params.max === 'undefined') {
  1389. // min and/or max are not defined, so calculate them
  1390. for (cc in values) {
  1391. val = parseFloat(values[cc]);
  1392. if (val > max) max = val;
  1393. if (val < min) min = val;
  1394. }
  1395. }
  1396. if (typeof this.params.min === 'undefined') {
  1397. this.scale.setMin(min);
  1398. this.params.min = min;
  1399. } else {
  1400. this.scale.setMin(this.params.min);
  1401. }
  1402. if (typeof this.params.max === 'undefined') {
  1403. this.scale.setMax(max);
  1404. this.params.max = max;
  1405. } else {
  1406. this.scale.setMax(this.params.max);
  1407. }
  1408. for (cc in values) {
  1409. if (cc != 'indexOf') {
  1410. val = parseFloat(values[cc]);
  1411. if (!isNaN(val)) {
  1412. attrs[cc] = this.scale.getValue(val);
  1413. } else {
  1414. attrs[cc] = this.elements[cc].element.style.initial[this.params.attribute];
  1415. }
  1416. }
  1417. }
  1418. } else {
  1419. for (cc in values) {
  1420. if (values[cc]) {
  1421. attrs[cc] = this.scale.getValue(values[cc]);
  1422. } else {
  1423. attrs[cc] = this.elements[cc].element.style.initial[this.params.attribute];
  1424. }
  1425. }
  1426. }
  1427. this.setAttributes(attrs);
  1428. jvm.$.extend(this.values, values);
  1429. },
  1430. clear: function(){
  1431. var key,
  1432. attrs = {};
  1433. for (key in this.values) {
  1434. if (this.elements[key]) {
  1435. attrs[key] = this.elements[key].element.shape.style.initial[this.params.attribute];
  1436. }
  1437. }
  1438. this.setAttributes(attrs);
  1439. this.values = {};
  1440. },
  1441. /**
  1442. * Set scale of the data series.
  1443. * @param {Array} scale Values representing scale.
  1444. */
  1445. setScale: function(scale) {
  1446. this.scale.setScale(scale);
  1447. if (this.values) {
  1448. this.setValues(this.values);
  1449. }
  1450. },
  1451. /**
  1452. * Set normalize function of the data series.
  1453. * @param {Function|String} normilizeFunction.
  1454. */
  1455. setNormalizeFunction: function(f) {
  1456. this.scale.setNormalizeFunction(f);
  1457. if (this.values) {
  1458. this.setValues(this.values);
  1459. }
  1460. }
  1461. };
  1462. /**
  1463. * Contains methods for transforming point on sphere to
  1464. * Cartesian coordinates using various projections.
  1465. * @class
  1466. */
  1467. jvm.Proj = {
  1468. degRad: 180 / Math.PI,
  1469. radDeg: Math.PI / 180,
  1470. radius: 6381372,
  1471. sgn: function(n){
  1472. if (n > 0) {
  1473. return 1;
  1474. } else if (n < 0) {
  1475. return -1;
  1476. } else {
  1477. return n;
  1478. }
  1479. },
  1480. /**
  1481. * Converts point on sphere to the Cartesian coordinates using Miller projection
  1482. * @param {Number} lat Latitude in degrees
  1483. * @param {Number} lng Longitude in degrees
  1484. * @param {Number} c Central meridian in degrees
  1485. */
  1486. mill: function(lat, lng, c){
  1487. return {
  1488. x: this.radius * (lng - c) * this.radDeg,
  1489. y: - this.radius * Math.log(Math.tan((45 + 0.4 * lat) * this.radDeg)) / 0.8
  1490. };
  1491. },
  1492. /**
  1493. * Inverse function of mill()
  1494. * Converts Cartesian coordinates to point on sphere using Miller projection
  1495. * @param {Number} x X of point in Cartesian system as integer
  1496. * @param {Number} y Y of point in Cartesian system as integer
  1497. * @param {Number} c Central meridian in degrees
  1498. */
  1499. mill_inv: function(x, y, c){
  1500. return {
  1501. lat: (2.5 * Math.atan(Math.exp(0.8 * y / this.radius)) - 5 * Math.PI / 8) * this.degRad,
  1502. lng: (c * this.radDeg + x / this.radius) * this.degRad
  1503. };
  1504. },
  1505. /**
  1506. * Converts point on sphere to the Cartesian coordinates using Mercator projection
  1507. * @param {Number} lat Latitude in degrees
  1508. * @param {Number} lng Longitude in degrees
  1509. * @param {Number} c Central meridian in degrees
  1510. */
  1511. merc: function(lat, lng, c){
  1512. return {
  1513. x: this.radius * (lng - c) * this.radDeg,
  1514. y: - this.radius * Math.log(Math.tan(Math.PI / 4 + lat * Math.PI / 360))
  1515. };
  1516. },
  1517. /**
  1518. * Inverse function of merc()
  1519. * Converts Cartesian coordinates to point on sphere using Mercator projection
  1520. * @param {Number} x X of point in Cartesian system as integer
  1521. * @param {Number} y Y of point in Cartesian system as integer
  1522. * @param {Number} c Central meridian in degrees
  1523. */
  1524. merc_inv: function(x, y, c){
  1525. return {
  1526. lat: (2 * Math.atan(Math.exp(y / this.radius)) - Math.PI / 2) * this.degRad,
  1527. lng: (c * this.radDeg + x / this.radius) * this.degRad
  1528. };
  1529. },
  1530. /**
  1531. * Converts point on sphere to the Cartesian coordinates using Albers Equal-Area Conic
  1532. * projection
  1533. * @see <a href="http://mathworld.wolfram.com/AlbersEqual-AreaConicProjection.html">Albers Equal-Area Conic projection</a>
  1534. * @param {Number} lat Latitude in degrees
  1535. * @param {Number} lng Longitude in degrees
  1536. * @param {Number} c Central meridian in degrees
  1537. */
  1538. aea: function(lat, lng, c){
  1539. var fi0 = 0,
  1540. lambda0 = c * this.radDeg,
  1541. fi1 = 29.5 * this.radDeg,
  1542. fi2 = 45.5 * this.radDeg,
  1543. fi = lat * this.radDeg,
  1544. lambda = lng * this.radDeg,
  1545. n = (Math.sin(fi1)+Math.sin(fi2)) / 2,
  1546. C = Math.cos(fi1)*Math.cos(fi1)+2*n*Math.sin(fi1),
  1547. theta = n*(lambda-lambda0),
  1548. ro = Math.sqrt(C-2*n*Math.sin(fi))/n,
  1549. ro0 = Math.sqrt(C-2*n*Math.sin(fi0))/n;
  1550. return {
  1551. x: ro * Math.sin(theta) * this.radius,
  1552. y: - (ro0 - ro * Math.cos(theta)) * this.radius
  1553. };
  1554. },
  1555. /**
  1556. * Converts Cartesian coordinates to the point on sphere using Albers Equal-Area Conic
  1557. * projection
  1558. * @see <a href="http://mathworld.wolfram.com/AlbersEqual-AreaConicProjection.html">Albers Equal-Area Conic projection</a>
  1559. * @param {Number} x X of point in Cartesian system as integer
  1560. * @param {Number} y Y of point in Cartesian system as integer
  1561. * @param {Number} c Central meridian in degrees
  1562. */
  1563. aea_inv: function(xCoord, yCoord, c){
  1564. var x = xCoord / this.radius,
  1565. y = yCoord / this.radius,
  1566. fi0 = 0,
  1567. lambda0 = c * this.radDeg,
  1568. fi1 = 29.5 * this.radDeg,
  1569. fi2 = 45.5 * this.radDeg,
  1570. n = (Math.sin(fi1)+Math.sin(fi2)) / 2,
  1571. C = Math.cos(fi1)*Math.cos(fi1)+2*n*Math.sin(fi1),
  1572. ro0 = Math.sqrt(C-2*n*Math.sin(fi0))/n,
  1573. ro = Math.sqrt(x*x+(ro0-y)*(ro0-y)),
  1574. theta = Math.atan( x / (ro0 - y) );
  1575. return {
  1576. lat: (Math.asin((C - ro * ro * n * n) / (2 * n))) * this.degRad,
  1577. lng: (lambda0 + theta / n) * this.degRad
  1578. };
  1579. },
  1580. /**
  1581. * Converts point on sphere to the Cartesian coordinates using Lambert conformal
  1582. * conic projection
  1583. * @see <a href="http://mathworld.wolfram.com/LambertConformalConicProjection.html">Lambert Conformal Conic Projection</a>
  1584. * @param {Number} lat Latitude in degrees
  1585. * @param {Number} lng Longitude in degrees
  1586. * @param {Number} c Central meridian in degrees
  1587. */
  1588. lcc: function(lat, lng, c){
  1589. var fi0 = 0,
  1590. lambda0 = c * this.radDeg,
  1591. lambda = lng * this.radDeg,
  1592. fi1 = 33 * this.radDeg,
  1593. fi2 = 45 * this.radDeg,
  1594. fi = lat * this.radDeg,
  1595. n = Math.log( Math.cos(fi1) * (1 / Math.cos(fi2)) ) / Math.log( Math.tan( Math.PI / 4 + fi2 / 2) * (1 / Math.tan( Math.PI / 4 + fi1 / 2) ) ),
  1596. F = ( Math.cos(fi1) * Math.pow( Math.tan( Math.PI / 4 + fi1 / 2 ), n ) ) / n,
  1597. ro = F * Math.pow( 1 / Math.tan( Math.PI / 4 + fi / 2 ), n ),
  1598. ro0 = F * Math.pow( 1 / Math.tan( Math.PI / 4 + fi0 / 2 ), n );
  1599. return {
  1600. x: ro * Math.sin( n * (lambda - lambda0) ) * this.radius,
  1601. y: - (ro0 - ro * Math.cos( n * (lambda - lambda0) ) ) * this.radius
  1602. };
  1603. },
  1604. /**
  1605. * Converts Cartesian coordinates to the point on sphere using Lambert conformal conic
  1606. * projection
  1607. * @see <a href="http://mathworld.wolfram.com/LambertConformalConicProjection.html">Lambert Conformal Conic Projection</a>
  1608. * @param {Number} x X of point in Cartesian system as integer
  1609. * @param {Number} y Y of point in Cartesian system as integer
  1610. * @param {Number} c Central meridian in degrees
  1611. */
  1612. lcc_inv: function(xCoord, yCoord, c){
  1613. var x = xCoord / this.radius,
  1614. y = yCoord / this.radius,
  1615. fi0 = 0,
  1616. lambda0 = c * this.radDeg,
  1617. fi1 = 33 * this.radDeg,
  1618. fi2 = 45 * this.radDeg,
  1619. n = Math.log( Math.cos(fi1) * (1 / Math.cos(fi2)) ) / Math.log( Math.tan( Math.PI / 4 + fi2 / 2) * (1 / Math.tan( Math.PI / 4 + fi1 / 2) ) ),
  1620. F = ( Math.cos(fi1) * Math.pow( Math.tan( Math.PI / 4 + fi1 / 2 ), n ) ) / n,
  1621. ro0 = F * Math.pow( 1 / Math.tan( Math.PI / 4 + fi0 / 2 ), n ),
  1622. ro = this.sgn(n) * Math.sqrt(x*x+(ro0-y)*(ro0-y)),
  1623. theta = Math.atan( x / (ro0 - y) );
  1624. return {
  1625. lat: (2 * Math.atan(Math.pow(F/ro, 1/n)) - Math.PI / 2) * this.degRad,
  1626. lng: (lambda0 + theta / n) * this.degRad
  1627. };
  1628. }
  1629. };jvm.MapObject = function(config){};
  1630. jvm.MapObject.prototype.getLabelText = function(key){
  1631. var text;
  1632. if (this.config.label) {
  1633. if (typeof this.config.label.render === 'function') {
  1634. text = this.config.label.render(key);
  1635. } else {
  1636. text = key;
  1637. }
  1638. } else {
  1639. text = null;
  1640. }
  1641. return text;
  1642. }
  1643. jvm.MapObject.prototype.getLabelOffsets = function(key){
  1644. var offsets;
  1645. if (this.config.label) {
  1646. if (typeof this.config.label.offsets === 'function') {
  1647. offsets = this.config.label.offsets(key);
  1648. } else if (typeof this.config.label.offsets === 'object') {
  1649. offsets = this.config.label.offsets[key];
  1650. }
  1651. }
  1652. return offsets || [0, 0];
  1653. }
  1654. /**
  1655. * Set hovered state to the element. Hovered state means mouse cursor is over element. Styles will be updates respectively.
  1656. * @param {Boolean} isHovered <code>true</code> to make element hovered, <code>false</code> otherwise.
  1657. */
  1658. jvm.MapObject.prototype.setHovered = function(isHovered){
  1659. if (this.isHovered !== isHovered) {
  1660. this.isHovered = isHovered;
  1661. this.shape.isHovered = isHovered;
  1662. this.shape.updateStyle();
  1663. if (this.label) {
  1664. this.label.isHovered = isHovered;
  1665. this.label.updateStyle();
  1666. }
  1667. }
  1668. };
  1669. /**
  1670. * Set selected state to the element. Styles will be updates respectively.
  1671. * @param {Boolean} isSelected <code>true</code> to make element selected, <code>false</code> otherwise.
  1672. */
  1673. jvm.MapObject.prototype.setSelected = function(isSelected){
  1674. if (this.isSelected !== isSelected) {
  1675. this.isSelected = isSelected;
  1676. this.shape.isSelected = isSelected;
  1677. this.shape.updateStyle();
  1678. if (this.label) {
  1679. this.label.isSelected = isSelected;
  1680. this.label.updateStyle();
  1681. }
  1682. jvm.$(this.shape).trigger('selected', [isSelected]);
  1683. }
  1684. };
  1685. jvm.MapObject.prototype.setStyle = function(){
  1686. this.shape.setStyle.apply(this.shape, arguments);
  1687. };
  1688. jvm.MapObject.prototype.remove = function(){
  1689. this.shape.remove();
  1690. if (this.label) {
  1691. this.label.remove();
  1692. }
  1693. };jvm.Region = function(config){
  1694. var bbox,
  1695. text,
  1696. offsets,
  1697. labelDx,
  1698. labelDy;
  1699. this.config = config;
  1700. this.map = this.config.map;
  1701. this.shape = config.canvas.addPath({
  1702. d: config.path,
  1703. 'data-code': config.code
  1704. }, config.style, config.canvas.rootElement);
  1705. this.shape.addClass('jvectormap-region jvectormap-element');
  1706. bbox = this.shape.getBBox();
  1707. text = this.getLabelText(config.code);
  1708. if (this.config.label && text) {
  1709. offsets = this.getLabelOffsets(config.code);
  1710. this.labelX = bbox.x + bbox.width / 2 + offsets[0];
  1711. this.labelY = bbox.y + bbox.height / 2 + offsets[1];
  1712. this.label = config.canvas.addText({
  1713. text: text,
  1714. 'text-anchor': 'middle',
  1715. 'alignment-baseline': 'central',
  1716. x: this.labelX,
  1717. y: this.labelY,
  1718. 'data-code': config.code
  1719. }, config.labelStyle, config.labelsGroup);
  1720. this.label.addClass('jvectormap-region jvectormap-element');
  1721. }
  1722. };
  1723. jvm.inherits(jvm.Region, jvm.MapObject);
  1724. jvm.Region.prototype.updateLabelPosition = function(){
  1725. if (this.label) {
  1726. this.label.set({
  1727. x: this.labelX * this.map.scale + this.map.transX * this.map.scale,
  1728. y: this.labelY * this.map.scale + this.map.transY * this.map.scale
  1729. });
  1730. }
  1731. };jvm.Marker = function(config){
  1732. var text,
  1733. offsets;
  1734. this.config = config;
  1735. this.map = this.config.map;
  1736. this.isImage = !!this.config.style.initial.image;
  1737. this.createShape();
  1738. text = this.getLabelText(config.index);
  1739. if (this.config.label && text) {
  1740. this.offsets = this.getLabelOffsets(config.index);
  1741. this.labelX = config.cx / this.map.scale - this.map.transX;
  1742. this.labelY = config.cy / this.map.scale - this.map.transY;
  1743. this.label = config.canvas.addText({
  1744. text: text,
  1745. 'data-index': config.index,
  1746. dy: "0.6ex",
  1747. x: this.labelX,
  1748. y: this.labelY
  1749. }, config.labelStyle, config.labelsGroup);
  1750. this.label.addClass('jvectormap-marker jvectormap-element');
  1751. }
  1752. };
  1753. jvm.inherits(jvm.Marker, jvm.MapObject);
  1754. jvm.Marker.prototype.createShape = function(){
  1755. var that = this;
  1756. if (this.shape) {
  1757. this.shape.remove();
  1758. }
  1759. this.shape = this.config.canvas[this.isImage ? 'addImage' : 'addCircle']({
  1760. "data-index": this.config.index,
  1761. cx: this.config.cx,
  1762. cy: this.config.cy
  1763. }, this.config.style, this.config.group);
  1764. this.shape.addClass('jvectormap-marker jvectormap-element');
  1765. if (this.isImage) {
  1766. jvm.$(this.shape.node).on('imageloaded', function(){
  1767. that.updateLabelPosition();
  1768. });
  1769. }
  1770. };
  1771. jvm.Marker.prototype.updateLabelPosition = function(){
  1772. if (this.label) {
  1773. this.label.set({
  1774. x: this.labelX * this.map.scale + this.offsets[0] +
  1775. this.map.transX * this.map.scale + 5 + (this.isImage ? (this.shape.width || 0) / 2 : this.shape.properties.r),
  1776. y: this.labelY * this.map.scale + this.map.transY * this.map.scale + this.offsets[1]
  1777. });
  1778. }
  1779. };
  1780. jvm.Marker.prototype.setStyle = function(property, value){
  1781. var isImage;
  1782. jvm.Marker.parentClass.prototype.setStyle.apply(this, arguments);
  1783. if (property === 'r') {
  1784. this.updateLabelPosition();
  1785. }
  1786. isImage = !!this.shape.get('image');
  1787. if (isImage != this.isImage) {
  1788. this.isImage = isImage;
  1789. this.config.style = jvm.$.extend(true, {}, this.shape.style);
  1790. this.createShape();
  1791. }
  1792. };/**
  1793. * Creates map, draws paths, binds events.
  1794. * @constructor
  1795. * @param {Object} params Parameters to initialize map with.
  1796. * @param {String} params.map Name of the map in the format <code>territory_proj_lang</code> where <code>territory</code> is a unique code or name of the territory which the map represents (ISO 3166 standard is used where possible), <code>proj</code> is a name of projection used to generate representation of the map on the plane (projections are named according to the conventions of proj4 utility) and <code>lang</code> is a code of the language, used for the names of regions.
  1797. * @param {String} params.backgroundColor Background color of the map in CSS format.
  1798. * @param {Boolean} params.zoomOnScroll When set to true map could be zoomed using mouse scroll. Default value is <code>true</code>.
  1799. * @param {Boolean} params.zoomOnScrollSpeed Mouse scroll speed. Number from 1 to 10. Default value is <code>3</code>.
  1800. * @param {Boolean} params.panOnDrag When set to true, the map pans when being dragged. Default value is <code>true</code>.
  1801. * @param {Number} params.zoomMax Indicates the maximum zoom ratio which could be reached zooming the map. Default value is <code>8</code>.
  1802. * @param {Number} params.zoomMin Indicates the minimum zoom ratio which could be reached zooming the map. Default value is <code>1</code>.
  1803. * @param {Number} params.zoomStep Indicates the multiplier used to zoom map with +/- buttons. Default value is <code>1.6</code>.
  1804. * @param {Boolean} params.zoomAnimate Indicates whether or not to animate changing of map zoom with zoom buttons.
  1805. * @param {Boolean} params.regionsSelectable When set to true regions of the map could be selected. Default value is <code>false</code>.
  1806. * @param {Boolean} params.regionsSelectableOne Allow only one region to be selected at the moment. Default value is <code>false</code>.
  1807. * @param {Boolean} params.markersSelectable When set to true markers on the map could be selected. Default value is <code>false</code>.
  1808. * @param {Boolean} params.markersSelectableOne Allow only one marker to be selected at the moment. Default value is <code>false</code>.
  1809. * @param {Object} params.regionStyle Set the styles for the map's regions. Each region or marker has four states: <code>initial</code> (default state), <code>hover</code> (when the mouse cursor is over the region or marker), <code>selected</code> (when region or marker is selected), <code>selectedHover</code> (when the mouse cursor is over the region or marker and it's selected simultaneously). Styles could be set for each of this states. Default value for that parameter is:
  1810. <pre>{
  1811. initial: {
  1812. fill: 'white',
  1813. "fill-opacity": 1,
  1814. stroke: 'none',
  1815. "stroke-width": 0,
  1816. "stroke-opacity": 1
  1817. },
  1818. hover: {
  1819. "fill-opacity": 0.8,
  1820. cursor: 'pointer'
  1821. },
  1822. selected: {
  1823. fill: 'yellow'
  1824. },
  1825. selectedHover: {
  1826. }
  1827. }</pre>
  1828. * @param {Object} params.regionLabelStyle Set the styles for the regions' labels. Each region or marker has four states: <code>initial</code> (default state), <code>hover</code> (when the mouse cursor is over the region or marker), <code>selected</code> (when region or marker is selected), <code>selectedHover</code> (when the mouse cursor is over the region or marker and it's selected simultaneously). Styles could be set for each of this states. Default value for that parameter is:
  1829. <pre>{
  1830. initial: {
  1831. 'font-family': 'Verdana',
  1832. 'font-size': '12',
  1833. 'font-weight': 'bold',
  1834. cursor: 'default',
  1835. fill: 'black'
  1836. },
  1837. hover: {
  1838. cursor: 'pointer'
  1839. }
  1840. }</pre>
  1841. * @param {Object} params.markerStyle Set the styles for the map's markers. Any parameter suitable for <code>regionStyle</code> could be used as well as numeric parameter <code>r</code> to set the marker's radius. Default value for that parameter is:
  1842. <pre>{
  1843. initial: {
  1844. fill: 'grey',
  1845. stroke: '#505050',
  1846. "fill-opacity": 1,
  1847. "stroke-width": 1,
  1848. "stroke-opacity": 1,
  1849. r: 5
  1850. },
  1851. hover: {
  1852. stroke: 'black',
  1853. "stroke-width": 2,
  1854. cursor: 'pointer'
  1855. },
  1856. selected: {
  1857. fill: 'blue'
  1858. },
  1859. selectedHover: {
  1860. }
  1861. }</pre>
  1862. * @param {Object} params.markerLabelStyle Set the styles for the markers' labels. Default value for that parameter is:
  1863. <pre>{
  1864. initial: {
  1865. 'font-family': 'Verdana',
  1866. 'font-size': '12',
  1867. 'font-weight': 'bold',
  1868. cursor: 'default',
  1869. fill: 'black'
  1870. },
  1871. hover: {
  1872. cursor: 'pointer'
  1873. }
  1874. }</pre>
  1875. * @param {Object|Array} params.markers Set of markers to add to the map during initialization. In case of array is provided, codes of markers will be set as string representations of array indexes. Each marker is represented by <code>latLng</code> (array of two numeric values), <code>name</code> (string which will be show on marker's tip) and any marker styles.
  1876. * @param {Object} params.series Object with two keys: <code>markers</code> and <code>regions</code>. Each of which is an array of series configs to be applied to the respective map elements. See <a href="jvm.DataSeries.html">DataSeries</a> description for a list of parameters available.
  1877. * @param {Object|String} params.focusOn This parameter sets the initial position and scale of the map viewport. See <code>setFocus</code> docuemntation for possible parameters.
  1878. * @param {Object} params.labels Defines parameters for rendering static labels. Object could contain two keys: <code>regions</code> and <code>markers</code>. Each key value defines configuration object with the following possible options:
  1879. <ul>
  1880. <li><code>render {Function}</code> - defines method for converting region code or marker index to actual label value.</li>
  1881. <li><code>offsets {Object|Function}</code> - provides method or object which could be used to define label offset by region code or marker index.</li>
  1882. </ul>
  1883. <b>Plase note: static labels feature is not supported in Internet Explorer 8 and below.</b>
  1884. * @param {Array|Object|String} params.selectedRegions Set initially selected regions.
  1885. * @param {Array|Object|String} params.selectedMarkers Set initially selected markers.
  1886. * @param {Function} params.onRegionTipShow <code>(Event e, Object tip, String code)</code> Will be called right before the region tip is going to be shown.
  1887. * @param {Function} params.onRegionOver <code>(Event e, String code)</code> Will be called on region mouse over event.
  1888. * @param {Function} params.onRegionOut <code>(Event e, String code)</code> Will be called on region mouse out event.
  1889. * @param {Function} params.onRegionClick <code>(Event e, String code)</code> Will be called on region click event.
  1890. * @param {Function} params.onRegionSelected <code>(Event e, String code, Boolean isSelected, Array selectedRegions)</code> Will be called when region is (de)selected. <code>isSelected</code> parameter of the callback indicates whether region is selected or not. <code>selectedRegions</code> contains codes of all currently selected regions.
  1891. * @param {Function} params.onMarkerTipShow <code>(Event e, Object tip, String code)</code> Will be called right before the marker tip is going to be shown.
  1892. * @param {Function} params.onMarkerOver <code>(Event e, String code)</code> Will be called on marker mouse over event.
  1893. * @param {Function} params.onMarkerOut <code>(Event e, String code)</code> Will be called on marker mouse out event.
  1894. * @param {Function} params.onMarkerClick <code>(Event e, String code)</code> Will be called on marker click event.
  1895. * @param {Function} params.onMarkerSelected <code>(Event e, String code, Boolean isSelected, Array selectedMarkers)</code> Will be called when marker is (de)selected. <code>isSelected</code> parameter of the callback indicates whether marker is selected or not. <code>selectedMarkers</code> contains codes of all currently selected markers.
  1896. * @param {Function} params.onViewportChange <code>(Event e, Number scale)</code> Triggered when the map's viewport is changed (map was panned or zoomed).
  1897. */
  1898. jvm.Map = function(params) {
  1899. var map = this,
  1900. e;
  1901. this.params = jvm.$.extend(true, {}, jvm.Map.defaultParams, params);
  1902. if (!jvm.Map.maps[this.params.map]) {
  1903. throw new Error('Attempt to use map which was not loaded: '+this.params.map);
  1904. }
  1905. this.mapData = jvm.Map.maps[this.params.map];
  1906. this.markers = {};
  1907. this.regions = {};
  1908. this.regionsColors = {};
  1909. this.regionsData = {};
  1910. this.container = jvm.$('<div>').addClass('jvectormap-container');
  1911. if (this.params.container) {
  1912. this.params.container.append( this.container );
  1913. }
  1914. this.container.data('mapObject', this);
  1915. this.defaultWidth = this.mapData.width;
  1916. this.defaultHeight = this.mapData.height;
  1917. this.setBackgroundColor(this.params.backgroundColor);
  1918. this.onResize = function(){
  1919. map.updateSize();
  1920. }
  1921. jvm.$(window).resize(this.onResize);
  1922. for (e in jvm.Map.apiEvents) {
  1923. if (this.params[e]) {
  1924. this.container.bind(jvm.Map.apiEvents[e]+'.jvectormap', this.params[e]);
  1925. }
  1926. }
  1927. this.canvas = new jvm.VectorCanvas(this.container[0], this.width, this.height);
  1928. if ( ('ontouchstart' in window) || (window.DocumentTouch && document instanceof DocumentTouch) ) {
  1929. if (this.params.bindTouchEvents) {
  1930. this.bindContainerTouchEvents();
  1931. }
  1932. }
  1933. this.bindContainerEvents();
  1934. this.bindElementEvents();
  1935. this.createTip();
  1936. if (this.params.zoomButtons) {
  1937. this.bindZoomButtons();
  1938. }
  1939. this.createRegions();
  1940. this.createMarkers(this.params.markers || {});
  1941. this.updateSize();
  1942. if (this.params.focusOn) {
  1943. if (typeof this.params.focusOn === 'string') {
  1944. this.params.focusOn = {region: this.params.focusOn};
  1945. } else if (jvm.$.isArray(this.params.focusOn)) {
  1946. this.params.focusOn = {regions: this.params.focusOn};
  1947. }
  1948. this.setFocus(this.params.focusOn);
  1949. }
  1950. if (this.params.selectedRegions) {
  1951. this.setSelectedRegions(this.params.selectedRegions);
  1952. }
  1953. if (this.params.selectedMarkers) {
  1954. this.setSelectedMarkers(this.params.selectedMarkers);
  1955. }
  1956. this.legendCntHorizontal = jvm.$('<div/>').addClass('jvectormap-legend-cnt jvectormap-legend-cnt-h');
  1957. this.legendCntVertical = jvm.$('<div/>').addClass('jvectormap-legend-cnt jvectormap-legend-cnt-v');
  1958. this.container.append(this.legendCntHorizontal);
  1959. this.container.append(this.legendCntVertical);
  1960. if (this.params.series) {
  1961. this.createSeries();
  1962. }
  1963. };
  1964. jvm.Map.prototype = {
  1965. transX: 0,
  1966. transY: 0,
  1967. scale: 1,
  1968. baseTransX: 0,
  1969. baseTransY: 0,
  1970. baseScale: 1,
  1971. width: 0,
  1972. height: 0,
  1973. /**
  1974. * Set background color of the map.
  1975. * @param {String} backgroundColor Background color in CSS format.
  1976. */
  1977. setBackgroundColor: function(backgroundColor) {
  1978. this.container.css('background-color', backgroundColor);
  1979. },
  1980. resize: function() {
  1981. var curBaseScale = this.baseScale;
  1982. if (this.width / this.height > this.defaultWidth / this.defaultHeight) {
  1983. this.baseScale = this.height / this.defaultHeight;
  1984. this.baseTransX = Math.abs(this.width - this.defaultWidth * this.baseScale) / (2 * this.baseScale);
  1985. } else {
  1986. this.baseScale = this.width / this.defaultWidth;
  1987. this.baseTransY = Math.abs(this.height - this.defaultHeight * this.baseScale) / (2 * this.baseScale);
  1988. }
  1989. this.scale *= this.baseScale / curBaseScale;
  1990. this.transX *= this.baseScale / curBaseScale;
  1991. this.transY *= this.baseScale / curBaseScale;
  1992. },
  1993. /**
  1994. * Synchronize the size of the map with the size of the container. Suitable in situations where the size of the container is changed programmatically or container is shown after it became visible.
  1995. */
  1996. updateSize: function(){
  1997. this.width = this.container.width();
  1998. this.height = this.container.height();
  1999. this.resize();
  2000. this.canvas.setSize(this.width, this.height);
  2001. this.applyTransform();
  2002. },
  2003. /**
  2004. * Reset all the series and show the map with the initial zoom.
  2005. */
  2006. reset: function() {
  2007. var key,
  2008. i;
  2009. for (key in this.series) {
  2010. for (i = 0; i < this.series[key].length; i++) {
  2011. this.series[key][i].clear();
  2012. }
  2013. }
  2014. this.scale = this.baseScale;
  2015. this.transX = this.baseTransX;
  2016. this.transY = this.baseTransY;
  2017. this.applyTransform();
  2018. },
  2019. applyTransform: function() {
  2020. var maxTransX,
  2021. maxTransY,
  2022. minTransX,
  2023. minTransY;
  2024. if (this.defaultWidth * this.scale <= this.width) {
  2025. maxTransX = (this.width - this.defaultWidth * this.scale) / (2 * this.scale);
  2026. minTransX = (this.width - this.defaultWidth * this.scale) / (2 * this.scale);
  2027. } else {
  2028. maxTransX = 0;
  2029. minTransX = (this.width - this.defaultWidth * this.scale) / this.scale;
  2030. }
  2031. if (this.defaultHeight * this.scale <= this.height) {
  2032. maxTransY = (this.height - this.defaultHeight * this.scale) / (2 * this.scale);
  2033. minTransY = (this.height - this.defaultHeight * this.scale) / (2 * this.scale);
  2034. } else {
  2035. maxTransY = 0;
  2036. minTransY = (this.height - this.defaultHeight * this.scale) / this.scale;
  2037. }
  2038. if (this.transY > maxTransY) {
  2039. this.transY = maxTransY;
  2040. } else if (this.transY < minTransY) {
  2041. this.transY = minTransY;
  2042. }
  2043. if (this.transX > maxTransX) {
  2044. this.transX = maxTransX;
  2045. } else if (this.transX < minTransX) {
  2046. this.transX = minTransX;
  2047. }
  2048. this.canvas.applyTransformParams(this.scale, this.transX, this.transY);
  2049. if (this.markers) {
  2050. this.repositionMarkers();
  2051. }
  2052. this.repositionLabels();
  2053. this.container.trigger('viewportChange', [this.scale/this.baseScale, this.transX, this.transY]);
  2054. },
  2055. bindContainerEvents: function(){
  2056. var mouseDown = false,
  2057. oldPageX,
  2058. oldPageY,
  2059. map = this;
  2060. if (this.params.panOnDrag) {
  2061. this.container.mousemove(function(e){
  2062. if (mouseDown) {
  2063. map.transX -= (oldPageX - e.pageX) / map.scale;
  2064. map.transY -= (oldPageY - e.pageY) / map.scale;
  2065. map.applyTransform();
  2066. oldPageX = e.pageX;
  2067. oldPageY = e.pageY;
  2068. }
  2069. return false;
  2070. }).mousedown(function(e){
  2071. mouseDown = true;
  2072. oldPageX = e.pageX;
  2073. oldPageY = e.pageY;
  2074. return false;
  2075. });
  2076. this.onContainerMouseUp = function(){
  2077. mouseDown = false;
  2078. };
  2079. jvm.$('body').mouseup(this.onContainerMouseUp);
  2080. }
  2081. if (this.params.zoomOnScroll) {
  2082. this.container.mousewheel(function(event, delta, deltaX, deltaY) {
  2083. var offset = jvm.$(map.container).offset(),
  2084. centerX = event.pageX - offset.left,
  2085. centerY = event.pageY - offset.top,
  2086. zoomStep = Math.pow(1 + map.params.zoomOnScrollSpeed / 1000, event.deltaFactor * event.deltaY);
  2087. map.tip.hide();
  2088. map.setScale(map.scale * zoomStep, centerX, centerY);
  2089. event.preventDefault();
  2090. });
  2091. }
  2092. },
  2093. bindContainerTouchEvents: function(){
  2094. var touchStartScale,
  2095. touchStartDistance,
  2096. map = this,
  2097. touchX,
  2098. touchY,
  2099. centerTouchX,
  2100. centerTouchY,
  2101. lastTouchesLength,
  2102. handleTouchEvent = function(e){
  2103. var touches = e.originalEvent.touches,
  2104. offset,
  2105. scale,
  2106. transXOld,
  2107. transYOld;
  2108. if (e.type == 'touchstart') {
  2109. lastTouchesLength = 0;
  2110. }
  2111. if (touches.length == 1) {
  2112. if (lastTouchesLength == 1) {
  2113. transXOld = map.transX;
  2114. transYOld = map.transY;
  2115. map.transX -= (touchX - touches[0].pageX) / map.scale;
  2116. map.transY -= (touchY - touches[0].pageY) / map.scale;
  2117. map.applyTransform();
  2118. map.tip.hide();
  2119. if (transXOld != map.transX || transYOld != map.transY) {
  2120. e.preventDefault();
  2121. }
  2122. }
  2123. touchX = touches[0].pageX;
  2124. touchY = touches[0].pageY;
  2125. } else if (touches.length == 2) {
  2126. if (lastTouchesLength == 2) {
  2127. scale = Math.sqrt(
  2128. Math.pow(touches[0].pageX - touches[1].pageX, 2) +
  2129. Math.pow(touches[0].pageY - touches[1].pageY, 2)
  2130. ) / touchStartDistance;
  2131. map.setScale(
  2132. touchStartScale * scale,
  2133. centerTouchX,
  2134. centerTouchY
  2135. )
  2136. map.tip.hide();
  2137. e.preventDefault();
  2138. } else {
  2139. offset = jvm.$(map.container).offset();
  2140. if (touches[0].pageX > touches[1].pageX) {
  2141. centerTouchX = touches[1].pageX + (touches[0].pageX - touches[1].pageX) / 2;
  2142. } else {
  2143. centerTouchX = touches[0].pageX + (touches[1].pageX - touches[0].pageX) / 2;
  2144. }
  2145. if (touches[0].pageY > touches[1].pageY) {
  2146. centerTouchY = touches[1].pageY + (touches[0].pageY - touches[1].pageY) / 2;
  2147. } else {
  2148. centerTouchY = touches[0].pageY + (touches[1].pageY - touches[0].pageY) / 2;
  2149. }
  2150. centerTouchX -= offset.left;
  2151. centerTouchY -= offset.top;
  2152. touchStartScale = map.scale;
  2153. touchStartDistance = Math.sqrt(
  2154. Math.pow(touches[0].pageX - touches[1].pageX, 2) +
  2155. Math.pow(touches[0].pageY - touches[1].pageY, 2)
  2156. );
  2157. }
  2158. }
  2159. lastTouchesLength = touches.length;
  2160. };
  2161. jvm.$(this.container).bind('touchstart', handleTouchEvent);
  2162. jvm.$(this.container).bind('touchmove', handleTouchEvent);
  2163. },
  2164. bindElementEvents: function(){
  2165. var map = this,
  2166. mouseMoved;
  2167. this.container.mousemove(function(){
  2168. mouseMoved = true;
  2169. });
  2170. /* Can not use common class selectors here because of the bug in jQuery
  2171. SVG handling, use with caution. */
  2172. this.container.delegate("[class~='jvectormap-element']", 'mouseover mouseout', function(e){
  2173. var baseVal = jvm.$(this).attr('class').baseVal || jvm.$(this).attr('class'),
  2174. type = baseVal.indexOf('jvectormap-region') === -1 ? 'marker' : 'region',
  2175. code = type == 'region' ? jvm.$(this).attr('data-code') : jvm.$(this).attr('data-index'),
  2176. element = type == 'region' ? map.regions[code].element : map.markers[code].element,
  2177. tipText = type == 'region' ? map.mapData.paths[code].name : (map.markers[code].config.name || ''),
  2178. tipShowEvent = jvm.$.Event(type+'TipShow.jvectormap'),
  2179. overEvent = jvm.$.Event(type+'Over.jvectormap');
  2180. if (e.type == 'mouseover') {
  2181. map.container.trigger(overEvent, [code]);
  2182. if (!overEvent.isDefaultPrevented()) {
  2183. element.setHovered(true);
  2184. }
  2185. map.tip.text(tipText);
  2186. map.container.trigger(tipShowEvent, [map.tip, code]);
  2187. if (!tipShowEvent.isDefaultPrevented()) {
  2188. map.tip.show();
  2189. map.tipWidth = map.tip.width();
  2190. map.tipHeight = map.tip.height();
  2191. }
  2192. } else {
  2193. element.setHovered(false);
  2194. map.tip.hide();
  2195. map.container.trigger(type+'Out.jvectormap', [code]);
  2196. }
  2197. });
  2198. /* Can not use common class selectors here because of the bug in jQuery
  2199. SVG handling, use with caution. */
  2200. this.container.delegate("[class~='jvectormap-element']", 'mousedown', function(){
  2201. mouseMoved = false;
  2202. });
  2203. /* Can not use common class selectors here because of the bug in jQuery
  2204. SVG handling, use with caution. */
  2205. this.container.delegate("[class~='jvectormap-element']", 'mouseup', function(){
  2206. var baseVal = jvm.$(this).attr('class').baseVal ? jvm.$(this).attr('class').baseVal : jvm.$(this).attr('class'),
  2207. type = baseVal.indexOf('jvectormap-region') === -1 ? 'marker' : 'region',
  2208. code = type == 'region' ? jvm.$(this).attr('data-code') : jvm.$(this).attr('data-index'),
  2209. clickEvent = jvm.$.Event(type+'Click.jvectormap'),
  2210. element = type == 'region' ? map.regions[code].element : map.markers[code].element;
  2211. if (!mouseMoved) {
  2212. map.container.trigger(clickEvent, [code]);
  2213. if ((type === 'region' && map.params.regionsSelectable) || (type === 'marker' && map.params.markersSelectable)) {
  2214. if (!clickEvent.isDefaultPrevented()) {
  2215. if (map.params[type+'sSelectableOne']) {
  2216. map.clearSelected(type+'s');
  2217. }
  2218. element.setSelected(!element.isSelected);
  2219. }
  2220. }
  2221. }
  2222. });
  2223. },
  2224. bindZoomButtons: function() {
  2225. var map = this;
  2226. jvm.$('<div/>').addClass('jvectormap-zoomin').text('+').appendTo(this.container);
  2227. jvm.$('<div/>').addClass('jvectormap-zoomout').html('&#x2212;').appendTo(this.container);
  2228. this.container.find('.jvectormap-zoomin').click(function(){
  2229. map.setScale(map.scale * map.params.zoomStep, map.width / 2, map.height / 2, false, map.params.zoomAnimate);
  2230. });
  2231. this.container.find('.jvectormap-zoomout').click(function(){
  2232. map.setScale(map.scale / map.params.zoomStep, map.width / 2, map.height / 2, false, map.params.zoomAnimate);
  2233. });
  2234. },
  2235. createTip: function(){
  2236. var map = this;
  2237. this.tip = jvm.$('<div/>').addClass('jvectormap-tip').appendTo(jvm.$('body'));
  2238. this.container.mousemove(function(e){
  2239. var left = e.pageX-15-map.tipWidth,
  2240. top = e.pageY-15-map.tipHeight;
  2241. if (left < 5) {
  2242. left = e.pageX + 15;
  2243. }
  2244. if (top < 5) {
  2245. top = e.pageY + 15;
  2246. }
  2247. map.tip.css({
  2248. left: left,
  2249. top: top
  2250. });
  2251. });
  2252. },
  2253. setScale: function(scale, anchorX, anchorY, isCentered, animate) {
  2254. var viewportChangeEvent = jvm.$.Event('zoom.jvectormap'),
  2255. interval,
  2256. that = this,
  2257. i = 0,
  2258. count = Math.abs(Math.round((scale - this.scale) * 60 / Math.max(scale, this.scale))),
  2259. scaleStart,
  2260. scaleDiff,
  2261. transXStart,
  2262. transXDiff,
  2263. transYStart,
  2264. transYDiff,
  2265. transX,
  2266. transY,
  2267. deferred = new jvm.$.Deferred();
  2268. if (scale > this.params.zoomMax * this.baseScale) {
  2269. scale = this.params.zoomMax * this.baseScale;
  2270. } else if (scale < this.params.zoomMin * this.baseScale) {
  2271. scale = this.params.zoomMin * this.baseScale;
  2272. }
  2273. if (typeof anchorX != 'undefined' && typeof anchorY != 'undefined') {
  2274. zoomStep = scale / this.scale;
  2275. if (isCentered) {
  2276. transX = anchorX + this.defaultWidth * (this.width / (this.defaultWidth * scale)) / 2;
  2277. transY = anchorY + this.defaultHeight * (this.height / (this.defaultHeight * scale)) / 2;
  2278. } else {
  2279. transX = this.transX - (zoomStep - 1) / scale * anchorX;
  2280. transY = this.transY - (zoomStep - 1) / scale * anchorY;
  2281. }
  2282. }
  2283. if (animate && count > 0) {
  2284. scaleStart = this.scale;
  2285. scaleDiff = (scale - scaleStart) / count;
  2286. transXStart = this.transX * this.scale;
  2287. transYStart = this.transY * this.scale;
  2288. transXDiff = (transX * scale - transXStart) / count;
  2289. transYDiff = (transY * scale - transYStart) / count;
  2290. interval = setInterval(function(){
  2291. i += 1;
  2292. that.scale = scaleStart + scaleDiff * i;
  2293. that.transX = (transXStart + transXDiff * i) / that.scale;
  2294. that.transY = (transYStart + transYDiff * i) / that.scale;
  2295. that.applyTransform();
  2296. if (i == count) {
  2297. clearInterval(interval);
  2298. that.container.trigger(viewportChangeEvent, [scale/that.baseScale]);
  2299. deferred.resolve();
  2300. }
  2301. }, 10);
  2302. } else {
  2303. this.transX = transX;
  2304. this.transY = transY;
  2305. this.scale = scale;
  2306. this.applyTransform();
  2307. this.container.trigger(viewportChangeEvent, [scale/this.baseScale]);
  2308. deferred.resolve();
  2309. }
  2310. return deferred;
  2311. },
  2312. /**
  2313. * Set the map's viewport to the specific point and set zoom of the map to the specific level. Point and zoom level could be defined in two ways: using the code of some region to focus on or a central point and zoom level as numbers.
  2314. * @param This method takes a configuration object as the single argument. The options passed to it are the following:
  2315. * @param {Array} params.regions Array of region codes to zoom to.
  2316. * @param {String} params.region Region code to zoom to.
  2317. * @param {Number} params.scale Map scale to set.
  2318. * @param {Number} params.lat Latitude to set viewport to.
  2319. * @param {Number} params.lng Longitude to set viewport to.
  2320. * @param {Number} params.x Number from 0 to 1 specifying the horizontal coordinate of the central point of the viewport.
  2321. * @param {Number} params.y Number from 0 to 1 specifying the vertical coordinate of the central point of the viewport.
  2322. * @param {Boolean} params.animate Indicates whether or not to animate the scale change and transition.
  2323. */
  2324. setFocus: function(config){
  2325. var bbox,
  2326. itemBbox,
  2327. newBbox,
  2328. codes,
  2329. i,
  2330. point;
  2331. config = config || {};
  2332. if (config.region) {
  2333. codes = [config.region];
  2334. } else if (config.regions) {
  2335. codes = config.regions;
  2336. }
  2337. if (codes) {
  2338. for (i = 0; i < codes.length; i++) {
  2339. if (this.regions[codes[i]]) {
  2340. itemBbox = this.regions[codes[i]].element.shape.getBBox();
  2341. if (itemBbox) {
  2342. if (typeof bbox == 'undefined') {
  2343. bbox = itemBbox;
  2344. } else {
  2345. newBbox = {
  2346. x: Math.min(bbox.x, itemBbox.x),
  2347. y: Math.min(bbox.y, itemBbox.y),
  2348. width: Math.max(bbox.x + bbox.width, itemBbox.x + itemBbox.width) - Math.min(bbox.x, itemBbox.x),
  2349. height: Math.max(bbox.y + bbox.height, itemBbox.y + itemBbox.height) - Math.min(bbox.y, itemBbox.y)
  2350. }
  2351. bbox = newBbox;
  2352. }
  2353. }
  2354. }
  2355. }
  2356. return this.setScale(
  2357. Math.min(this.width / bbox.width, this.height / bbox.height),
  2358. - (bbox.x + bbox.width / 2),
  2359. - (bbox.y + bbox.height / 2),
  2360. true,
  2361. config.animate
  2362. );
  2363. } else {
  2364. if (config.lat && config.lng) {
  2365. point = this.latLngToPoint(config.lat, config.lng);
  2366. config.x = this.transX - point.x / this.scale;
  2367. config.y = this.transY - point.y / this.scale;
  2368. } else if (config.x && config.y) {
  2369. config.x *= -this.defaultWidth;
  2370. config.y *= -this.defaultHeight;
  2371. }
  2372. return this.setScale(config.scale * this.baseScale, config.x, config.y, true, config.animate);
  2373. }
  2374. },
  2375. getSelected: function(type){
  2376. var key,
  2377. selected = [];
  2378. for (key in this[type]) {
  2379. if (this[type][key].element.isSelected) {
  2380. selected.push(key);
  2381. }
  2382. }
  2383. return selected;
  2384. },
  2385. /**
  2386. * Return the codes of currently selected regions.
  2387. * @returns {Array}
  2388. */
  2389. getSelectedRegions: function(){
  2390. return this.getSelected('regions');
  2391. },
  2392. /**
  2393. * Return the codes of currently selected markers.
  2394. * @returns {Array}
  2395. */
  2396. getSelectedMarkers: function(){
  2397. return this.getSelected('markers');
  2398. },
  2399. setSelected: function(type, keys){
  2400. var i;
  2401. if (typeof keys != 'object') {
  2402. keys = [keys];
  2403. }
  2404. if (jvm.$.isArray(keys)) {
  2405. for (i = 0; i < keys.length; i++) {
  2406. this[type][keys[i]].element.setSelected(true);
  2407. }
  2408. } else {
  2409. for (i in keys) {
  2410. this[type][i].element.setSelected(!!keys[i]);
  2411. }
  2412. }
  2413. },
  2414. /**
  2415. * Set or remove selected state for the regions.
  2416. * @param {String|Array|Object} keys If <code>String</code> or <code>Array</code> the region(s) with the corresponding code(s) will be selected. If <code>Object</code> was provided its keys are codes of regions, state of which should be changed. Selected state will be set if value is true, removed otherwise.
  2417. */
  2418. setSelectedRegions: function(keys){
  2419. this.setSelected('regions', keys);
  2420. },
  2421. /**
  2422. * Set or remove selected state for the markers.
  2423. * @param {String|Array|Object} keys If <code>String</code> or <code>Array</code> the marker(s) with the corresponding code(s) will be selected. If <code>Object</code> was provided its keys are codes of markers, state of which should be changed. Selected state will be set if value is true, removed otherwise.
  2424. */
  2425. setSelectedMarkers: function(keys){
  2426. this.setSelected('markers', keys);
  2427. },
  2428. clearSelected: function(type){
  2429. var select = {},
  2430. selected = this.getSelected(type),
  2431. i;
  2432. for (i = 0; i < selected.length; i++) {
  2433. select[selected[i]] = false;
  2434. };
  2435. this.setSelected(type, select);
  2436. },
  2437. /**
  2438. * Remove the selected state from all the currently selected regions.
  2439. */
  2440. clearSelectedRegions: function(){
  2441. this.clearSelected('regions');
  2442. },
  2443. /**
  2444. * Remove the selected state from all the currently selected markers.
  2445. */
  2446. clearSelectedMarkers: function(){
  2447. this.clearSelected('markers');
  2448. },
  2449. /**
  2450. * Return the instance of Map. Useful when instantiated as a jQuery plug-in.
  2451. * @returns {Map}
  2452. */
  2453. getMapObject: function(){
  2454. return this;
  2455. },
  2456. /**
  2457. * Return the name of the region by region code.
  2458. * @returns {String}
  2459. */
  2460. getRegionName: function(code){
  2461. return this.mapData.paths[code].name;
  2462. },
  2463. createRegions: function(){
  2464. var key,
  2465. region,
  2466. map = this;
  2467. this.regionLabelsGroup = this.regionLabelsGroup || this.canvas.addGroup();
  2468. for (key in this.mapData.paths) {
  2469. region = new jvm.Region({
  2470. map: this,
  2471. path: this.mapData.paths[key].path,
  2472. code: key,
  2473. style: jvm.$.extend(true, {}, this.params.regionStyle),
  2474. labelStyle: jvm.$.extend(true, {}, this.params.regionLabelStyle),
  2475. canvas: this.canvas,
  2476. labelsGroup: this.regionLabelsGroup,
  2477. label: this.canvas.mode != 'vml' ? (this.params.labels && this.params.labels.regions) : null
  2478. });
  2479. jvm.$(region.shape).bind('selected', function(e, isSelected){
  2480. map.container.trigger('regionSelected.jvectormap', [jvm.$(this.node).attr('data-code'), isSelected, map.getSelectedRegions()]);
  2481. });
  2482. this.regions[key] = {
  2483. element: region,
  2484. config: this.mapData.paths[key]
  2485. };
  2486. }
  2487. },
  2488. createMarkers: function(markers) {
  2489. var i,
  2490. marker,
  2491. point,
  2492. markerConfig,
  2493. markersArray,
  2494. map = this;
  2495. this.markersGroup = this.markersGroup || this.canvas.addGroup();
  2496. this.markerLabelsGroup = this.markerLabelsGroup || this.canvas.addGroup();
  2497. if (jvm.$.isArray(markers)) {
  2498. markersArray = markers.slice();
  2499. markers = {};
  2500. for (i = 0; i < markersArray.length; i++) {
  2501. markers[i] = markersArray[i];
  2502. }
  2503. }
  2504. for (i in markers) {
  2505. markerConfig = markers[i] instanceof Array ? {latLng: markers[i]} : markers[i];
  2506. point = this.getMarkerPosition( markerConfig );
  2507. if (point !== false) {
  2508. marker = new jvm.Marker({
  2509. map: this,
  2510. style: jvm.$.extend(true, {}, this.params.markerStyle, {initial: markerConfig.style || {}}),
  2511. labelStyle: jvm.$.extend(true, {}, this.params.markerLabelStyle),
  2512. index: i,
  2513. cx: point.x,
  2514. cy: point.y,
  2515. group: this.markersGroup,
  2516. canvas: this.canvas,
  2517. labelsGroup: this.markerLabelsGroup,
  2518. label: this.canvas.mode != 'vml' ? (this.params.labels && this.params.labels.markers) : null
  2519. });
  2520. jvm.$(marker.shape).bind('selected', function(e, isSelected){
  2521. map.container.trigger('markerSelected.jvectormap', [jvm.$(this.node).attr('data-index'), isSelected, map.getSelectedMarkers()]);
  2522. });
  2523. if (this.markers[i]) {
  2524. this.removeMarkers([i]);
  2525. }
  2526. this.markers[i] = {element: marker, config: markerConfig};
  2527. }
  2528. }
  2529. },
  2530. repositionMarkers: function() {
  2531. var i,
  2532. point;
  2533. for (i in this.markers) {
  2534. point = this.getMarkerPosition( this.markers[i].config );
  2535. if (point !== false) {
  2536. this.markers[i].element.setStyle({cx: point.x, cy: point.y});
  2537. }
  2538. }
  2539. },
  2540. repositionLabels: function() {
  2541. var key;
  2542. for (key in this.regions) {
  2543. this.regions[key].element.updateLabelPosition();
  2544. }
  2545. for (key in this.markers) {
  2546. this.markers[key].element.updateLabelPosition();
  2547. }
  2548. },
  2549. getMarkerPosition: function(markerConfig) {
  2550. if (jvm.Map.maps[this.params.map].projection) {
  2551. return this.latLngToPoint.apply(this, markerConfig.latLng || [0, 0]);
  2552. } else {
  2553. return {
  2554. x: markerConfig.coords[0]*this.scale + this.transX*this.scale,
  2555. y: markerConfig.coords[1]*this.scale + this.transY*this.scale
  2556. };
  2557. }
  2558. },
  2559. /**
  2560. * Add one marker to the map.
  2561. * @param {String} key Marker unique code.
  2562. * @param {Object} marker Marker configuration parameters.
  2563. * @param {Array} seriesData Values to add to the data series.
  2564. */
  2565. addMarker: function(key, marker, seriesData){
  2566. var markers = {},
  2567. data = [],
  2568. values,
  2569. i,
  2570. seriesData = seriesData || [];
  2571. markers[key] = marker;
  2572. for (i = 0; i < seriesData.length; i++) {
  2573. values = {};
  2574. if (typeof seriesData[i] !== 'undefined') {
  2575. values[key] = seriesData[i];
  2576. }
  2577. data.push(values);
  2578. }
  2579. this.addMarkers(markers, data);
  2580. },
  2581. /**
  2582. * Add set of marker to the map.
  2583. * @param {Object|Array} markers Markers to add to the map. In case of array is provided, codes of markers will be set as string representations of array indexes.
  2584. * @param {Array} seriesData Values to add to the data series.
  2585. */
  2586. addMarkers: function(markers, seriesData){
  2587. var i;
  2588. seriesData = seriesData || [];
  2589. this.createMarkers(markers);
  2590. for (i = 0; i < seriesData.length; i++) {
  2591. this.series.markers[i].setValues(seriesData[i] || {});
  2592. };
  2593. },
  2594. /**
  2595. * Remove some markers from the map.
  2596. * @param {Array} markers Array of marker codes to be removed.
  2597. */
  2598. removeMarkers: function(markers){
  2599. var i;
  2600. for (i = 0; i < markers.length; i++) {
  2601. this.markers[ markers[i] ].element.remove();
  2602. delete this.markers[ markers[i] ];
  2603. };
  2604. },
  2605. /**
  2606. * Remove all markers from the map.
  2607. */
  2608. removeAllMarkers: function(){
  2609. var i,
  2610. markers = [];
  2611. for (i in this.markers) {
  2612. markers.push(i);
  2613. }
  2614. this.removeMarkers(markers)
  2615. },
  2616. /**
  2617. * Converts coordinates expressed as latitude and longitude to the coordinates in pixels on the map.
  2618. * @param {Number} lat Latitide of point in degrees.
  2619. * @param {Number} lng Longitude of point in degrees.
  2620. */
  2621. latLngToPoint: function(lat, lng) {
  2622. var point,
  2623. proj = jvm.Map.maps[this.params.map].projection,
  2624. centralMeridian = proj.centralMeridian,
  2625. inset,
  2626. bbox;
  2627. if (lng < (-180 + centralMeridian)) {
  2628. lng += 360;
  2629. }
  2630. point = jvm.Proj[proj.type](lat, lng, centralMeridian);
  2631. inset = this.getInsetForPoint(point.x, point.y);
  2632. if (inset) {
  2633. bbox = inset.bbox;
  2634. point.x = (point.x - bbox[0].x) / (bbox[1].x - bbox[0].x) * inset.width * this.scale;
  2635. point.y = (point.y - bbox[0].y) / (bbox[1].y - bbox[0].y) * inset.height * this.scale;
  2636. return {
  2637. x: point.x + this.transX*this.scale + inset.left*this.scale,
  2638. y: point.y + this.transY*this.scale + inset.top*this.scale
  2639. };
  2640. } else {
  2641. return false;
  2642. }
  2643. },
  2644. /**
  2645. * Converts cartesian coordinates into coordinates expressed as latitude and longitude.
  2646. * @param {Number} x X-axis of point on map in pixels.
  2647. * @param {Number} y Y-axis of point on map in pixels.
  2648. */
  2649. pointToLatLng: function(x, y) {
  2650. var proj = jvm.Map.maps[this.params.map].projection,
  2651. centralMeridian = proj.centralMeridian,
  2652. insets = jvm.Map.maps[this.params.map].insets,
  2653. i,
  2654. inset,
  2655. bbox,
  2656. nx,
  2657. ny;
  2658. for (i = 0; i < insets.length; i++) {
  2659. inset = insets[i];
  2660. bbox = inset.bbox;
  2661. nx = x - (this.transX*this.scale + inset.left*this.scale);
  2662. ny = y - (this.transY*this.scale + inset.top*this.scale);
  2663. nx = (nx / (inset.width * this.scale)) * (bbox[1].x - bbox[0].x) + bbox[0].x;
  2664. ny = (ny / (inset.height * this.scale)) * (bbox[1].y - bbox[0].y) + bbox[0].y;
  2665. if (nx > bbox[0].x && nx < bbox[1].x && ny > bbox[0].y && ny < bbox[1].y) {
  2666. return jvm.Proj[proj.type + '_inv'](nx, -ny, centralMeridian);
  2667. }
  2668. }
  2669. return false;
  2670. },
  2671. getInsetForPoint: function(x, y){
  2672. var insets = jvm.Map.maps[this.params.map].insets,
  2673. i,
  2674. bbox;
  2675. for (i = 0; i < insets.length; i++) {
  2676. bbox = insets[i].bbox;
  2677. if (x > bbox[0].x && x < bbox[1].x && y > bbox[0].y && y < bbox[1].y) {
  2678. return insets[i];
  2679. }
  2680. }
  2681. },
  2682. createSeries: function(){
  2683. var i,
  2684. key;
  2685. this.series = {
  2686. markers: [],
  2687. regions: []
  2688. };
  2689. for (key in this.params.series) {
  2690. for (i = 0; i < this.params.series[key].length; i++) {
  2691. this.series[key][i] = new jvm.DataSeries(
  2692. this.params.series[key][i],
  2693. this[key],
  2694. this
  2695. );
  2696. }
  2697. }
  2698. },
  2699. /**
  2700. * Gracefully remove the map and and all its accessories, unbind event handlers.
  2701. */
  2702. remove: function(){
  2703. this.tip.remove();
  2704. this.container.remove();
  2705. jvm.$(window).unbind('resize', this.onResize);
  2706. jvm.$('body').unbind('mouseup', this.onContainerMouseUp);
  2707. }
  2708. };
  2709. jvm.Map.maps = {};
  2710. jvm.Map.defaultParams = {
  2711. map: 'world_mill_en',
  2712. backgroundColor: '#505050',
  2713. zoomButtons: true,
  2714. zoomOnScroll: true,
  2715. zoomOnScrollSpeed: 3,
  2716. panOnDrag: true,
  2717. zoomMax: 8,
  2718. zoomMin: 1,
  2719. zoomStep: 1.6,
  2720. zoomAnimate: true,
  2721. regionsSelectable: false,
  2722. markersSelectable: false,
  2723. bindTouchEvents: true,
  2724. regionStyle: {
  2725. initial: {
  2726. fill: 'white',
  2727. "fill-opacity": 1,
  2728. stroke: 'none',
  2729. "stroke-width": 0,
  2730. "stroke-opacity": 1
  2731. },
  2732. hover: {
  2733. "fill-opacity": 0.8,
  2734. cursor: 'pointer'
  2735. },
  2736. selected: {
  2737. fill: 'yellow'
  2738. },
  2739. selectedHover: {
  2740. }
  2741. },
  2742. regionLabelStyle: {
  2743. initial: {
  2744. 'font-family': 'Verdana',
  2745. 'font-size': '12',
  2746. 'font-weight': 'bold',
  2747. cursor: 'default',
  2748. fill: 'black'
  2749. },
  2750. hover: {
  2751. cursor: 'pointer'
  2752. }
  2753. },
  2754. markerStyle: {
  2755. initial: {
  2756. fill: 'grey',
  2757. stroke: '#505050',
  2758. "fill-opacity": 1,
  2759. "stroke-width": 1,
  2760. "stroke-opacity": 1,
  2761. r: 5
  2762. },
  2763. hover: {
  2764. stroke: 'black',
  2765. "stroke-width": 2,
  2766. cursor: 'pointer'
  2767. },
  2768. selected: {
  2769. fill: 'blue'
  2770. },
  2771. selectedHover: {
  2772. }
  2773. },
  2774. markerLabelStyle: {
  2775. initial: {
  2776. 'font-family': 'Verdana',
  2777. 'font-size': '12',
  2778. 'font-weight': 'bold',
  2779. cursor: 'default',
  2780. fill: 'black'
  2781. },
  2782. hover: {
  2783. cursor: 'pointer'
  2784. }
  2785. }
  2786. };
  2787. jvm.Map.apiEvents = {
  2788. onRegionTipShow: 'regionTipShow',
  2789. onRegionOver: 'regionOver',
  2790. onRegionOut: 'regionOut',
  2791. onRegionClick: 'regionClick',
  2792. onRegionSelected: 'regionSelected',
  2793. onMarkerTipShow: 'markerTipShow',
  2794. onMarkerOver: 'markerOver',
  2795. onMarkerOut: 'markerOut',
  2796. onMarkerClick: 'markerClick',
  2797. onMarkerSelected: 'markerSelected',
  2798. onViewportChange: 'viewportChange'
  2799. };
  2800. /**
  2801. * Creates map with drill-down functionality.
  2802. * @constructor
  2803. * @param {Object} params Parameters to initialize map with.
  2804. * @param {Number} params.maxLevel Maximum number of levels user can go through
  2805. * @param {Object} params.main Config of the main map. See <a href="./jvm-map/">jvm.Map</a> for more information.
  2806. * @param {Function} params.mapNameByCode Function go generate map name by region code. Default value is:
  2807. <pre>
  2808. function(code, multiMap) {
  2809. return code.toLowerCase()+'_'+
  2810. multiMap.defaultProjection+'_en';
  2811. }
  2812. </pre>
  2813. * @param {Function} params.mapUrlByCode Function to generate map url by region code. Default value is:
  2814. <pre>
  2815. function(code, multiMap){
  2816. return 'jquery-jvectormap-data-'+
  2817. code.toLowerCase()+'-'+
  2818. multiMap.defaultProjection+'-en.js';
  2819. }
  2820. </pre>
  2821. */
  2822. jvm.MultiMap = function(params) {
  2823. var that = this;
  2824. this.maps = {};
  2825. this.params = jvm.$.extend(true, {}, jvm.MultiMap.defaultParams, params);
  2826. this.params.maxLevel = this.params.maxLevel || Number.MAX_VALUE;
  2827. this.params.main = this.params.main || {};
  2828. this.params.main.multiMapLevel = 0;
  2829. this.history = [ this.addMap(this.params.main.map, this.params.main) ];
  2830. this.defaultProjection = this.history[0].mapData.projection.type;
  2831. this.mapsLoaded = {};
  2832. this.params.container.css({position: 'relative'});
  2833. this.backButton = jvm.$('<div/>').addClass('jvectormap-goback').text('Back').appendTo(this.params.container);
  2834. this.backButton.hide();
  2835. this.backButton.click(function(){
  2836. that.goBack();
  2837. });
  2838. this.spinner = jvm.$('<div/>').addClass('jvectormap-spinner').appendTo(this.params.container);
  2839. this.spinner.hide();
  2840. };
  2841. jvm.MultiMap.prototype = {
  2842. addMap: function(name, config){
  2843. var cnt = jvm.$('<div/>').css({
  2844. width: '100%',
  2845. height: '100%'
  2846. });
  2847. this.params.container.append(cnt);
  2848. this.maps[name] = new jvm.Map(jvm.$.extend(config, {container: cnt}));
  2849. if (this.params.maxLevel > config.multiMapLevel) {
  2850. this.maps[name].container.on('regionClick.jvectormap', {scope: this}, function(e, code){
  2851. var multimap = e.data.scope,
  2852. mapName = multimap.params.mapNameByCode(code, multimap);
  2853. if (!multimap.drillDownPromise || multimap.drillDownPromise.state() !== 'pending') {
  2854. multimap.drillDown(mapName, code);
  2855. }
  2856. });
  2857. }
  2858. return this.maps[name];
  2859. },
  2860. downloadMap: function(code){
  2861. var that = this,
  2862. deferred = jvm.$.Deferred();
  2863. if (!this.mapsLoaded[code]) {
  2864. jvm.$.get(this.params.mapUrlByCode(code, this)).then(function(){
  2865. that.mapsLoaded[code] = true;
  2866. deferred.resolve();
  2867. }, function(){
  2868. deferred.reject();
  2869. });
  2870. } else {
  2871. deferred.resolve();
  2872. }
  2873. return deferred;
  2874. },
  2875. drillDown: function(name, code){
  2876. var currentMap = this.history[this.history.length - 1],
  2877. that = this,
  2878. focusPromise = currentMap.setFocus({region: code, animate: true}),
  2879. downloadPromise = this.downloadMap(code);
  2880. focusPromise.then(function(){
  2881. if (downloadPromise.state() === 'pending') {
  2882. that.spinner.show();
  2883. }
  2884. });
  2885. downloadPromise.always(function(){
  2886. that.spinner.hide();
  2887. });
  2888. this.drillDownPromise = jvm.$.when(downloadPromise, focusPromise);
  2889. this.drillDownPromise.then(function(){
  2890. currentMap.params.container.hide();
  2891. if (!that.maps[name]) {
  2892. that.addMap(name, {map: name, multiMapLevel: currentMap.params.multiMapLevel + 1});
  2893. } else {
  2894. that.maps[name].params.container.show();
  2895. }
  2896. that.history.push( that.maps[name] );
  2897. that.backButton.show();
  2898. });
  2899. },
  2900. goBack: function(){
  2901. var currentMap = this.history.pop(),
  2902. prevMap = this.history[this.history.length - 1],
  2903. that = this;
  2904. currentMap.setFocus({scale: 1, x: 0.5, y: 0.5, animate: true}).then(function(){
  2905. currentMap.params.container.hide();
  2906. prevMap.params.container.show();
  2907. prevMap.updateSize();
  2908. if (that.history.length === 1) {
  2909. that.backButton.hide();
  2910. }
  2911. prevMap.setFocus({scale: 1, x: 0.5, y: 0.5, animate: true});
  2912. });
  2913. }
  2914. };
  2915. jvm.MultiMap.defaultParams = {
  2916. mapNameByCode: function(code, multiMap){
  2917. return code.toLowerCase()+'_'+multiMap.defaultProjection+'_en';
  2918. },
  2919. mapUrlByCode: function(code, multiMap){
  2920. return 'jquery-jvectormap-data-'+code.toLowerCase()+'-'+multiMap.defaultProjection+'-en.js';
  2921. }
  2922. }