| 1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096109710981099110011011102110311041105110611071108110911101111111211131114111511161117111811191120112111221123112411251126112711281129113011311132113311341135113611371138113911401141114211431144114511461147114811491150115111521153115411551156115711581159116011611162116311641165116611671168116911701171117211731174117511761177117811791180118111821183118411851186118711881189119011911192119311941195119611971198119912001201120212031204120512061207120812091210121112121213121412151216121712181219122012211222122312241225122612271228122912301231123212331234123512361237123812391240124112421243124412451246124712481249125012511252125312541255125612571258125912601261126212631264126512661267126812691270127112721273127412751276127712781279128012811282128312841285128612871288128912901291129212931294129512961297129812991300130113021303130413051306130713081309131013111312131313141315131613171318131913201321132213231324132513261327132813291330133113321333133413351336133713381339134013411342134313441345134613471348134913501351135213531354135513561357135813591360136113621363136413651366136713681369137013711372137313741375137613771378137913801381138213831384138513861387138813891390139113921393139413951396139713981399140014011402140314041405140614071408140914101411141214131414141514161417141814191420142114221423142414251426142714281429143014311432143314341435143614371438143914401441144214431444144514461447144814491450145114521453145414551456145714581459146014611462146314641465146614671468146914701471147214731474147514761477147814791480148114821483148414851486148714881489149014911492149314941495149614971498149915001501150215031504150515061507150815091510151115121513151415151516151715181519152015211522152315241525152615271528152915301531153215331534153515361537153815391540154115421543154415451546154715481549155015511552155315541555155615571558155915601561156215631564156515661567156815691570157115721573157415751576157715781579158015811582158315841585158615871588158915901591159215931594159515961597159815991600160116021603160416051606160716081609161016111612161316141615161616171618161916201621162216231624162516261627162816291630163116321633163416351636163716381639164016411642164316441645164616471648164916501651165216531654165516561657165816591660166116621663166416651666166716681669167016711672167316741675167616771678167916801681168216831684168516861687168816891690169116921693169416951696169716981699170017011702170317041705170617071708170917101711171217131714171517161717171817191720172117221723172417251726172717281729173017311732173317341735173617371738173917401741174217431744174517461747174817491750175117521753175417551756175717581759176017611762176317641765176617671768176917701771177217731774177517761777177817791780178117821783178417851786178717881789179017911792179317941795179617971798179918001801180218031804180518061807180818091810181118121813181418151816181718181819182018211822182318241825182618271828182918301831183218331834183518361837183818391840184118421843184418451846184718481849185018511852185318541855185618571858185918601861186218631864186518661867186818691870187118721873187418751876187718781879188018811882188318841885188618871888188918901891189218931894189518961897189818991900190119021903190419051906190719081909191019111912191319141915191619171918191919201921192219231924192519261927192819291930193119321933193419351936193719381939194019411942194319441945194619471948194919501951195219531954195519561957195819591960196119621963196419651966196719681969197019711972197319741975197619771978197919801981198219831984198519861987198819891990199119921993199419951996199719981999200020012002200320042005200620072008200920102011201220132014201520162017201820192020202120222023202420252026202720282029203020312032203320342035203620372038203920402041204220432044204520462047204820492050205120522053205420552056205720582059206020612062206320642065206620672068206920702071207220732074207520762077207820792080208120822083208420852086208720882089209020912092209320942095209620972098209921002101210221032104210521062107210821092110211121122113211421152116211721182119212021212122212321242125212621272128212921302131213221332134213521362137213821392140214121422143214421452146214721482149215021512152215321542155215621572158215921602161216221632164216521662167216821692170217121722173217421752176217721782179218021812182218321842185218621872188218921902191219221932194219521962197219821992200220122022203220422052206220722082209221022112212221322142215221622172218221922202221222222232224222522262227222822292230223122322233223422352236223722382239224022412242224322442245224622472248224922502251225222532254225522562257225822592260226122622263226422652266226722682269227022712272227322742275227622772278227922802281228222832284228522862287228822892290229122922293229422952296229722982299230023012302230323042305230623072308230923102311231223132314231523162317231823192320232123222323232423252326232723282329233023312332233323342335233623372338233923402341234223432344234523462347234823492350235123522353235423552356235723582359236023612362236323642365236623672368236923702371237223732374237523762377237823792380238123822383238423852386238723882389239023912392239323942395239623972398239924002401240224032404240524062407240824092410241124122413241424152416241724182419242024212422242324242425242624272428242924302431243224332434243524362437243824392440244124422443244424452446244724482449245024512452245324542455245624572458245924602461246224632464246524662467246824692470247124722473247424752476247724782479248024812482248324842485248624872488248924902491249224932494249524962497249824992500250125022503250425052506250725082509251025112512251325142515251625172518251925202521252225232524252525262527252825292530253125322533253425352536253725382539254025412542254325442545254625472548254925502551255225532554255525562557255825592560256125622563256425652566256725682569257025712572257325742575257625772578257925802581258225832584258525862587258825892590259125922593259425952596259725982599260026012602260326042605260626072608260926102611261226132614261526162617261826192620262126222623262426252626262726282629263026312632263326342635263626372638263926402641264226432644264526462647264826492650265126522653265426552656265726582659266026612662266326642665266626672668266926702671267226732674267526762677267826792680268126822683268426852686268726882689269026912692269326942695269626972698269927002701270227032704270527062707270827092710271127122713271427152716271727182719272027212722272327242725272627272728272927302731273227332734273527362737273827392740274127422743274427452746274727482749275027512752275327542755275627572758275927602761276227632764276527662767276827692770277127722773277427752776277727782779278027812782278327842785278627872788278927902791279227932794279527962797279827992800280128022803280428052806280728082809281028112812281328142815281628172818281928202821282228232824282528262827282828292830283128322833283428352836283728382839284028412842284328442845284628472848284928502851285228532854285528562857285828592860286128622863286428652866286728682869287028712872287328742875287628772878287928802881288228832884288528862887288828892890289128922893289428952896289728982899290029012902290329042905290629072908290929102911291229132914291529162917291829192920292129222923292429252926292729282929293029312932293329342935293629372938293929402941294229432944294529462947294829492950295129522953295429552956295729582959296029612962296329642965296629672968296929702971297229732974297529762977297829792980298129822983298429852986298729882989299029912992299329942995299629972998299930003001300230033004300530063007300830093010301130123013301430153016301730183019302030213022302330243025302630273028302930303031303230333034303530363037303830393040304130423043304430453046304730483049305030513052305330543055305630573058305930603061306230633064306530663067306830693070307130723073307430753076307730783079308030813082308330843085308630873088308930903091309230933094309530963097309830993100310131023103310431053106310731083109311031113112311331143115311631173118311931203121312231233124312531263127312831293130313131323133313431353136313731383139314031413142314331443145314631473148314931503151315231533154315531563157315831593160316131623163316431653166316731683169317031713172317331743175317631773178317931803181318231833184318531863187318831893190319131923193319431953196319731983199320032013202320332043205320632073208320932103211321232133214321532163217321832193220322132223223322432253226322732283229323032313232323332343235323632373238323932403241324232433244324532463247324832493250325132523253325432553256325732583259326032613262326332643265326632673268326932703271327232733274327532763277327832793280328132823283328432853286328732883289329032913292329332943295329632973298329933003301330233033304330533063307330833093310331133123313331433153316331733183319332033213322332333243325332633273328332933303331333233333334333533363337333833393340334133423343334433453346334733483349335033513352335333543355335633573358335933603361336233633364336533663367336833693370337133723373337433753376337733783379338033813382338333843385338633873388338933903391339233933394339533963397339833993400340134023403340434053406340734083409341034113412341334143415341634173418341934203421342234233424342534263427342834293430343134323433343434353436343734383439344034413442344334443445344634473448344934503451345234533454345534563457345834593460346134623463346434653466346734683469347034713472347334743475347634773478347934803481348234833484348534863487348834893490349134923493349434953496349734983499350035013502350335043505350635073508350935103511351235133514351535163517351835193520352135223523352435253526352735283529353035313532353335343535353635373538353935403541354235433544354535463547354835493550355135523553355435553556355735583559356035613562356335643565356635673568356935703571357235733574357535763577357835793580358135823583358435853586358735883589359035913592359335943595359635973598359936003601360236033604360536063607360836093610361136123613361436153616361736183619362036213622362336243625362636273628362936303631363236333634363536363637363836393640364136423643364436453646364736483649365036513652365336543655365636573658365936603661366236633664366536663667366836693670367136723673367436753676367736783679368036813682368336843685368636873688368936903691369236933694369536963697369836993700370137023703370437053706370737083709371037113712371337143715371637173718371937203721372237233724372537263727372837293730373137323733373437353736373737383739374037413742374337443745374637473748374937503751375237533754375537563757375837593760376137623763376437653766376737683769377037713772377337743775377637773778377937803781378237833784378537863787378837893790379137923793379437953796379737983799380038013802380338043805380638073808380938103811381238133814381538163817381838193820382138223823382438253826382738283829383038313832383338343835383638373838383938403841384238433844384538463847384838493850385138523853385438553856385738583859386038613862386338643865386638673868386938703871387238733874387538763877387838793880388138823883388438853886388738883889389038913892389338943895389638973898389939003901390239033904390539063907390839093910391139123913391439153916391739183919392039213922392339243925392639273928392939303931393239333934393539363937393839393940394139423943394439453946394739483949395039513952395339543955395639573958395939603961396239633964396539663967396839693970397139723973397439753976397739783979398039813982398339843985398639873988398939903991399239933994399539963997399839994000400140024003400440054006400740084009401040114012401340144015401640174018401940204021402240234024402540264027402840294030403140324033403440354036403740384039404040414042404340444045404640474048404940504051405240534054405540564057405840594060406140624063406440654066406740684069407040714072407340744075407640774078407940804081408240834084408540864087408840894090409140924093409440954096409740984099410041014102410341044105410641074108410941104111411241134114411541164117411841194120412141224123412441254126412741284129413041314132413341344135413641374138413941404141414241434144414541464147414841494150415141524153415441554156415741584159416041614162416341644165416641674168416941704171417241734174417541764177417841794180418141824183418441854186418741884189419041914192419341944195419641974198419942004201420242034204420542064207420842094210421142124213421442154216421742184219422042214222422342244225422642274228422942304231423242334234423542364237423842394240424142424243424442454246424742484249425042514252425342544255425642574258425942604261426242634264426542664267426842694270427142724273427442754276427742784279428042814282428342844285428642874288428942904291429242934294429542964297429842994300430143024303430443054306430743084309431043114312431343144315431643174318431943204321432243234324432543264327432843294330433143324333433443354336433743384339434043414342434343444345434643474348434943504351435243534354435543564357435843594360436143624363436443654366436743684369437043714372437343744375437643774378437943804381438243834384438543864387438843894390439143924393439443954396439743984399440044014402440344044405440644074408440944104411441244134414441544164417441844194420442144224423442444254426442744284429443044314432443344344435443644374438443944404441444244434444444544464447444844494450445144524453445444554456445744584459446044614462446344644465446644674468446944704471447244734474447544764477447844794480448144824483448444854486448744884489449044914492449344944495449644974498449945004501450245034504450545064507450845094510451145124513451445154516451745184519452045214522452345244525452645274528452945304531453245334534453545364537453845394540454145424543454445454546454745484549455045514552455345544555455645574558455945604561456245634564456545664567456845694570457145724573457445754576457745784579458045814582458345844585458645874588458945904591459245934594459545964597459845994600460146024603460446054606460746084609461046114612461346144615461646174618461946204621462246234624462546264627462846294630463146324633463446354636463746384639464046414642464346444645464646474648464946504651465246534654465546564657465846594660466146624663466446654666466746684669467046714672467346744675467646774678467946804681468246834684468546864687468846894690469146924693469446954696469746984699470047014702470347044705470647074708470947104711471247134714471547164717471847194720472147224723472447254726472747284729473047314732473347344735473647374738473947404741474247434744474547464747474847494750475147524753475447554756475747584759476047614762476347644765476647674768476947704771477247734774477547764777477847794780478147824783478447854786478747884789479047914792479347944795479647974798479948004801480248034804480548064807480848094810481148124813481448154816481748184819482048214822482348244825482648274828482948304831483248334834483548364837483848394840484148424843484448454846484748484849485048514852485348544855485648574858485948604861486248634864486548664867486848694870487148724873487448754876487748784879488048814882488348844885488648874888488948904891489248934894489548964897489848994900490149024903490449054906490749084909491049114912491349144915491649174918491949204921492249234924492549264927492849294930493149324933493449354936493749384939494049414942494349444945494649474948494949504951495249534954495549564957495849594960496149624963496449654966496749684969497049714972497349744975497649774978497949804981498249834984498549864987498849894990499149924993499449954996499749984999500050015002500350045005500650075008500950105011501250135014501550165017501850195020502150225023502450255026502750285029503050315032503350345035503650375038503950405041504250435044504550465047504850495050505150525053505450555056505750585059506050615062506350645065506650675068506950705071507250735074507550765077507850795080508150825083508450855086508750885089509050915092509350945095509650975098509951005101510251035104510551065107510851095110511151125113511451155116511751185119512051215122512351245125512651275128512951305131513251335134513551365137513851395140514151425143514451455146514751485149515051515152515351545155515651575158515951605161516251635164516551665167516851695170517151725173517451755176517751785179518051815182518351845185518651875188518951905191519251935194519551965197519851995200520152025203520452055206520752085209521052115212521352145215521652175218521952205221522252235224522552265227522852295230523152325233523452355236523752385239524052415242524352445245524652475248524952505251525252535254525552565257525852595260526152625263526452655266526752685269527052715272527352745275527652775278527952805281528252835284528552865287528852895290529152925293529452955296529752985299530053015302530353045305530653075308530953105311531253135314531553165317531853195320532153225323532453255326532753285329533053315332533353345335533653375338533953405341534253435344534553465347534853495350535153525353535453555356535753585359536053615362536353645365536653675368536953705371537253735374537553765377537853795380538153825383538453855386538753885389539053915392539353945395539653975398539954005401540254035404540554065407540854095410541154125413541454155416541754185419542054215422542354245425542654275428542954305431543254335434543554365437543854395440544154425443544454455446544754485449545054515452545354545455545654575458545954605461546254635464546554665467546854695470547154725473547454755476547754785479548054815482548354845485548654875488548954905491549254935494549554965497549854995500550155025503550455055506550755085509551055115512551355145515551655175518551955205521552255235524552555265527552855295530553155325533553455355536553755385539554055415542554355445545554655475548554955505551555255535554555555565557555855595560556155625563556455655566556755685569557055715572557355745575557655775578557955805581558255835584558555865587558855895590559155925593559455955596559755985599560056015602560356045605560656075608560956105611561256135614561556165617561856195620562156225623562456255626562756285629563056315632563356345635563656375638563956405641564256435644564556465647564856495650565156525653565456555656565756585659566056615662566356645665566656675668566956705671567256735674567556765677567856795680568156825683568456855686568756885689569056915692569356945695569656975698569957005701570257035704570557065707570857095710571157125713571457155716571757185719572057215722572357245725572657275728572957305731573257335734573557365737573857395740574157425743574457455746574757485749575057515752575357545755575657575758575957605761576257635764576557665767576857695770577157725773577457755776577757785779578057815782578357845785578657875788578957905791579257935794579557965797579857995800580158025803580458055806580758085809581058115812581358145815581658175818581958205821582258235824582558265827582858295830583158325833583458355836583758385839584058415842584358445845584658475848584958505851585258535854585558565857585858595860586158625863586458655866586758685869587058715872587358745875587658775878587958805881588258835884588558865887588858895890589158925893589458955896589758985899590059015902590359045905590659075908590959105911591259135914591559165917591859195920592159225923592459255926592759285929593059315932593359345935593659375938593959405941594259435944594559465947594859495950595159525953595459555956595759585959596059615962596359645965596659675968596959705971597259735974597559765977597859795980598159825983598459855986598759885989599059915992599359945995599659975998599960006001600260036004600560066007600860096010601160126013601460156016601760186019602060216022602360246025602660276028602960306031603260336034603560366037603860396040604160426043604460456046604760486049605060516052605360546055605660576058605960606061606260636064606560666067606860696070607160726073607460756076607760786079608060816082608360846085608660876088608960906091609260936094609560966097609860996100610161026103610461056106610761086109611061116112611361146115611661176118611961206121612261236124612561266127612861296130613161326133613461356136613761386139614061416142614361446145614661476148614961506151615261536154615561566157615861596160616161626163616461656166616761686169617061716172617361746175617661776178617961806181618261836184618561866187618861896190619161926193619461956196619761986199620062016202620362046205620662076208620962106211621262136214621562166217621862196220622162226223622462256226622762286229623062316232623362346235623662376238623962406241624262436244624562466247624862496250625162526253625462556256625762586259626062616262626362646265626662676268626962706271627262736274627562766277627862796280628162826283628462856286628762886289629062916292629362946295629662976298629963006301630263036304630563066307630863096310631163126313631463156316631763186319632063216322632363246325632663276328632963306331633263336334633563366337633863396340634163426343634463456346634763486349635063516352635363546355635663576358635963606361636263636364636563666367636863696370637163726373637463756376637763786379638063816382638363846385638663876388638963906391639263936394639563966397639863996400640164026403640464056406640764086409641064116412641364146415641664176418641964206421642264236424642564266427642864296430643164326433643464356436643764386439644064416442644364446445644664476448644964506451645264536454645564566457645864596460646164626463646464656466646764686469647064716472647364746475647664776478647964806481648264836484648564866487648864896490649164926493649464956496649764986499650065016502650365046505650665076508650965106511651265136514651565166517651865196520652165226523652465256526652765286529653065316532653365346535653665376538653965406541654265436544654565466547654865496550655165526553655465556556655765586559656065616562656365646565656665676568656965706571657265736574657565766577657865796580658165826583658465856586658765886589659065916592659365946595659665976598659966006601660266036604660566066607660866096610661166126613661466156616661766186619662066216622662366246625662666276628662966306631663266336634663566366637663866396640664166426643664466456646664766486649665066516652665366546655665666576658665966606661666266636664666566666667666866696670667166726673667466756676667766786679668066816682668366846685668666876688668966906691669266936694669566966697669866996700670167026703670467056706670767086709671067116712671367146715671667176718671967206721672267236724672567266727672867296730673167326733673467356736673767386739674067416742674367446745674667476748674967506751675267536754675567566757675867596760676167626763676467656766676767686769677067716772677367746775677667776778677967806781678267836784678567866787678867896790679167926793679467956796679767986799680068016802680368046805680668076808680968106811681268136814681568166817681868196820682168226823682468256826682768286829683068316832683368346835683668376838683968406841684268436844684568466847684868496850685168526853685468556856685768586859686068616862686368646865686668676868686968706871687268736874687568766877687868796880688168826883688468856886688768886889689068916892689368946895689668976898689969006901690269036904690569066907690869096910691169126913691469156916691769186919692069216922692369246925692669276928692969306931693269336934693569366937693869396940694169426943694469456946694769486949695069516952695369546955695669576958695969606961696269636964696569666967696869696970697169726973697469756976697769786979698069816982698369846985698669876988698969906991699269936994699569966997699869997000700170027003700470057006700770087009701070117012701370147015701670177018701970207021702270237024702570267027702870297030703170327033703470357036703770387039704070417042704370447045704670477048704970507051705270537054705570567057705870597060706170627063706470657066706770687069707070717072707370747075707670777078707970807081708270837084708570867087708870897090709170927093709470957096709770987099710071017102710371047105710671077108710971107111711271137114711571167117711871197120712171227123712471257126712771287129713071317132713371347135713671377138713971407141714271437144714571467147714871497150715171527153715471557156715771587159716071617162716371647165716671677168716971707171717271737174717571767177717871797180718171827183718471857186718771887189719071917192719371947195719671977198719972007201720272037204720572067207720872097210721172127213721472157216721772187219722072217222722372247225722672277228722972307231723272337234723572367237723872397240724172427243724472457246724772487249725072517252725372547255725672577258725972607261726272637264726572667267726872697270727172727273727472757276727772787279728072817282728372847285728672877288728972907291729272937294729572967297729872997300730173027303730473057306730773087309731073117312731373147315731673177318731973207321732273237324732573267327732873297330733173327333733473357336733773387339734073417342734373447345734673477348734973507351735273537354735573567357735873597360736173627363736473657366736773687369737073717372737373747375737673777378737973807381738273837384738573867387738873897390739173927393739473957396739773987399740074017402740374047405740674077408740974107411741274137414741574167417741874197420742174227423742474257426742774287429743074317432743374347435743674377438743974407441744274437444744574467447744874497450745174527453745474557456745774587459746074617462746374647465746674677468746974707471747274737474747574767477747874797480748174827483748474857486748774887489749074917492749374947495749674977498749975007501750275037504750575067507750875097510751175127513751475157516751775187519752075217522752375247525752675277528752975307531753275337534753575367537753875397540754175427543754475457546754775487549755075517552755375547555755675577558755975607561756275637564756575667567756875697570757175727573757475757576757775787579758075817582758375847585758675877588758975907591759275937594759575967597759875997600760176027603760476057606760776087609761076117612761376147615761676177618761976207621762276237624762576267627762876297630763176327633763476357636763776387639764076417642764376447645764676477648764976507651765276537654765576567657765876597660766176627663766476657666766776687669767076717672767376747675767676777678767976807681768276837684768576867687768876897690769176927693769476957696769776987699770077017702770377047705770677077708770977107711771277137714771577167717771877197720772177227723772477257726772777287729773077317732773377347735773677377738773977407741774277437744774577467747774877497750775177527753775477557756775777587759776077617762776377647765776677677768776977707771777277737774777577767777777877797780778177827783778477857786778777887789779077917792779377947795779677977798779978007801780278037804780578067807780878097810781178127813781478157816781778187819782078217822782378247825782678277828782978307831783278337834783578367837783878397840784178427843784478457846784778487849785078517852785378547855785678577858785978607861786278637864786578667867786878697870787178727873787478757876787778787879788078817882788378847885788678877888788978907891789278937894789578967897789878997900790179027903790479057906790779087909791079117912791379147915791679177918791979207921792279237924792579267927792879297930793179327933793479357936793779387939794079417942794379447945794679477948794979507951795279537954795579567957795879597960796179627963796479657966796779687969797079717972797379747975797679777978797979807981798279837984798579867987798879897990799179927993799479957996799779987999800080018002800380048005800680078008800980108011801280138014801580168017801880198020802180228023802480258026802780288029803080318032803380348035803680378038803980408041804280438044804580468047804880498050805180528053805480558056805780588059806080618062806380648065806680678068806980708071807280738074807580768077807880798080808180828083808480858086808780888089809080918092809380948095809680978098809981008101810281038104810581068107810881098110811181128113811481158116811781188119812081218122812381248125812681278128812981308131813281338134813581368137813881398140814181428143814481458146814781488149815081518152815381548155815681578158815981608161816281638164816581668167816881698170817181728173817481758176817781788179818081818182818381848185818681878188818981908191819281938194819581968197819881998200820182028203820482058206820782088209821082118212821382148215821682178218821982208221822282238224822582268227822882298230823182328233823482358236823782388239824082418242824382448245824682478248824982508251825282538254825582568257825882598260826182628263826482658266826782688269827082718272827382748275827682778278827982808281828282838284828582868287828882898290829182928293829482958296829782988299830083018302830383048305830683078308830983108311831283138314831583168317831883198320832183228323832483258326832783288329833083318332833383348335833683378338833983408341834283438344834583468347834883498350835183528353835483558356835783588359836083618362836383648365836683678368836983708371837283738374837583768377837883798380838183828383838483858386838783888389839083918392839383948395839683978398839984008401840284038404840584068407840884098410841184128413841484158416841784188419842084218422842384248425842684278428842984308431843284338434843584368437843884398440844184428443844484458446844784488449845084518452845384548455845684578458845984608461846284638464846584668467846884698470847184728473847484758476847784788479848084818482848384848485848684878488848984908491849284938494849584968497849884998500850185028503850485058506850785088509851085118512851385148515851685178518851985208521852285238524852585268527852885298530853185328533853485358536853785388539854085418542854385448545854685478548854985508551855285538554855585568557855885598560856185628563856485658566856785688569857085718572857385748575857685778578857985808581858285838584858585868587858885898590859185928593859485958596859785988599860086018602860386048605860686078608860986108611861286138614861586168617861886198620862186228623862486258626862786288629863086318632863386348635863686378638863986408641864286438644864586468647864886498650865186528653865486558656865786588659866086618662866386648665866686678668866986708671867286738674867586768677867886798680868186828683868486858686868786888689869086918692869386948695869686978698869987008701870287038704870587068707870887098710871187128713871487158716871787188719872087218722872387248725872687278728872987308731873287338734873587368737873887398740874187428743874487458746874787488749875087518752875387548755875687578758875987608761876287638764876587668767876887698770877187728773877487758776877787788779878087818782878387848785878687878788878987908791879287938794879587968797879887998800880188028803880488058806880788088809881088118812881388148815881688178818881988208821882288238824882588268827882888298830883188328833883488358836883788388839884088418842884388448845884688478848884988508851885288538854885588568857885888598860886188628863886488658866886788688869887088718872887388748875887688778878887988808881888288838884888588868887888888898890889188928893889488958896889788988899890089018902890389048905890689078908890989108911891289138914891589168917891889198920892189228923892489258926892789288929893089318932893389348935893689378938893989408941894289438944894589468947894889498950895189528953895489558956895789588959896089618962896389648965896689678968896989708971897289738974897589768977897889798980898189828983898489858986898789888989899089918992899389948995899689978998899990009001900290039004900590069007900890099010901190129013901490159016901790189019902090219022902390249025902690279028902990309031903290339034903590369037903890399040904190429043 |
- /**
- * @license Highstock JS v8.1.2 (2020-06-16)
- *
- * Highstock as a plugin for Highcharts
- *
- * (c) 2010-2019 Torstein Honsi
- *
- * License: www.highcharts.com/license
- */
- 'use strict';
- (function (factory) {
- if (typeof module === 'object' && module.exports) {
- factory['default'] = factory;
- module.exports = factory;
- } else if (typeof define === 'function' && define.amd) {
- define('highcharts/modules/stock', ['highcharts'], function (Highcharts) {
- factory(Highcharts);
- factory.Highcharts = Highcharts;
- return factory;
- });
- } else {
- factory(typeof Highcharts !== 'undefined' ? Highcharts : undefined);
- }
- }(function (Highcharts) {
- var _modules = Highcharts ? Highcharts._modules : {};
- function _registerModule(obj, path, args, fn) {
- if (!obj.hasOwnProperty(path)) {
- obj[path] = fn.apply(null, args);
- }
- }
- _registerModule(_modules, 'parts/NavigatorAxis.js', [_modules['parts/Globals.js'], _modules['parts/Utilities.js']], function (H, U) {
- /* *
- *
- * (c) 2010-2020 Torstein Honsi
- *
- * License: www.highcharts.com/license
- *
- * !!!!!!! SOURCE GETS TRANSPILED BY TYPESCRIPT. EDIT TS FILE ONLY. !!!!!!!
- *
- * */
- var isTouchDevice = H.isTouchDevice;
- var addEvent = U.addEvent, correctFloat = U.correctFloat, defined = U.defined, isNumber = U.isNumber, pick = U.pick;
- /* eslint-disable valid-jsdoc */
- /**
- * @private
- * @class
- */
- var NavigatorAxisAdditions = /** @class */ (function () {
- /* *
- *
- * Constructors
- *
- * */
- function NavigatorAxisAdditions(axis) {
- this.axis = axis;
- }
- /* *
- *
- * Functions
- *
- * */
- /**
- * @private
- */
- NavigatorAxisAdditions.prototype.destroy = function () {
- this.axis = void 0;
- };
- /**
- * Add logic to normalize the zoomed range in order to preserve the pressed
- * state of range selector buttons
- *
- * @private
- * @function Highcharts.Axis#toFixedRange
- * @param {number} [pxMin]
- * @param {number} [pxMax]
- * @param {number} [fixedMin]
- * @param {number} [fixedMax]
- * @return {*}
- */
- NavigatorAxisAdditions.prototype.toFixedRange = function (pxMin, pxMax, fixedMin, fixedMax) {
- var navigator = this;
- var axis = navigator.axis;
- var chart = axis.chart;
- var fixedRange = chart && chart.fixedRange, halfPointRange = (axis.pointRange || 0) / 2, newMin = pick(fixedMin, axis.translate(pxMin, true, !axis.horiz)), newMax = pick(fixedMax, axis.translate(pxMax, true, !axis.horiz)), changeRatio = fixedRange && (newMax - newMin) / fixedRange;
- // Add/remove half point range to/from the extremes (#1172)
- if (!defined(fixedMin)) {
- newMin = correctFloat(newMin + halfPointRange);
- }
- if (!defined(fixedMax)) {
- newMax = correctFloat(newMax - halfPointRange);
- }
- // If the difference between the fixed range and the actual requested
- // range is too great, the user is dragging across an ordinal gap, and
- // we need to release the range selector button.
- if (changeRatio > 0.7 && changeRatio < 1.3) {
- if (fixedMax) {
- newMin = newMax - fixedRange;
- }
- else {
- newMax = newMin + fixedRange;
- }
- }
- if (!isNumber(newMin) || !isNumber(newMax)) { // #1195, #7411
- newMin = newMax = void 0;
- }
- return {
- min: newMin,
- max: newMax
- };
- };
- return NavigatorAxisAdditions;
- }());
- /**
- * @private
- * @class
- */
- var NavigatorAxis = /** @class */ (function () {
- function NavigatorAxis() {
- }
- /* *
- *
- * Static Functions
- *
- * */
- /**
- * @private
- */
- NavigatorAxis.compose = function (AxisClass) {
- AxisClass.keepProps.push('navigatorAxis');
- /* eslint-disable no-invalid-this */
- addEvent(AxisClass, 'init', function () {
- var axis = this;
- if (!axis.navigatorAxis) {
- axis.navigatorAxis = new NavigatorAxisAdditions(axis);
- }
- });
- // For Stock charts, override selection zooming with some special
- // features because X axis zooming is already allowed by the Navigator
- // and Range selector.
- addEvent(AxisClass, 'zoom', function (e) {
- var axis = this;
- var chart = axis.chart;
- var chartOptions = chart.options;
- var navigator = chartOptions.navigator;
- var navigatorAxis = axis.navigatorAxis;
- var pinchType = chartOptions.chart.pinchType;
- var rangeSelector = chartOptions.rangeSelector;
- var zoomType = chartOptions.chart.zoomType;
- var previousZoom;
- if (axis.isXAxis && ((navigator && navigator.enabled) ||
- (rangeSelector && rangeSelector.enabled))) {
- // For y only zooming, ignore the X axis completely
- if (zoomType === 'y') {
- e.zoomed = false;
- // For xy zooming, record the state of the zoom before zoom
- // selection, then when the reset button is pressed, revert to
- // this state. This should apply only if the chart is
- // initialized with a range (#6612), otherwise zoom all the way
- // out.
- }
- else if (((!isTouchDevice && zoomType === 'xy') ||
- (isTouchDevice && pinchType === 'xy')) &&
- axis.options.range) {
- previousZoom = navigatorAxis.previousZoom;
- if (defined(e.newMin)) {
- navigatorAxis.previousZoom = [axis.min, axis.max];
- }
- else if (previousZoom) {
- e.newMin = previousZoom[0];
- e.newMax = previousZoom[1];
- navigatorAxis.previousZoom = void 0;
- }
- }
- }
- if (typeof e.zoomed !== 'undefined') {
- e.preventDefault();
- }
- });
- /* eslint-enable no-invalid-this */
- };
- /* *
- *
- * Static Properties
- *
- * */
- /**
- * @private
- */
- NavigatorAxis.AdditionsClass = NavigatorAxisAdditions;
- return NavigatorAxis;
- }());
- return NavigatorAxis;
- });
- _registerModule(_modules, 'parts/ScrollbarAxis.js', [_modules['parts/Globals.js'], _modules['parts/Utilities.js']], function (H, U) {
- /* *
- *
- * (c) 2010-2020 Torstein Honsi
- *
- * License: www.highcharts.com/license
- *
- * !!!!!!! SOURCE GETS TRANSPILED BY TYPESCRIPT. EDIT TS FILE ONLY. !!!!!!!
- *
- * */
- var addEvent = U.addEvent, defined = U.defined, pick = U.pick;
- /* eslint-disable no-invalid-this, valid-jsdoc */
- /**
- * Creates scrollbars if enabled.
- *
- * @private
- */
- var ScrollbarAxis = /** @class */ (function () {
- function ScrollbarAxis() {
- }
- /**
- * Attaches to axis events to create scrollbars if enabled.
- *
- * @private
- *
- * @param AxisClass
- * Axis class to extend.
- *
- * @param ScrollbarClass
- * Scrollbar class to use.
- */
- ScrollbarAxis.compose = function (AxisClass, ScrollbarClass) {
- // Wrap axis initialization and create scrollbar if enabled:
- addEvent(AxisClass, 'afterInit', function () {
- var axis = this;
- if (axis.options &&
- axis.options.scrollbar &&
- axis.options.scrollbar.enabled) {
- // Predefined options:
- axis.options.scrollbar.vertical = !axis.horiz;
- axis.options.startOnTick = axis.options.endOnTick = false;
- axis.scrollbar = new ScrollbarClass(axis.chart.renderer, axis.options.scrollbar, axis.chart);
- addEvent(axis.scrollbar, 'changed', function (e) {
- var axisMin = pick(axis.options && axis.options.min, axis.min), axisMax = pick(axis.options && axis.options.max, axis.max), unitedMin = defined(axis.dataMin) ?
- Math.min(axisMin, axis.min, axis.dataMin) : axisMin, unitedMax = defined(axis.dataMax) ?
- Math.max(axisMax, axis.max, axis.dataMax) : axisMax, range = unitedMax - unitedMin, to, from;
- // #12834, scroll when show/hide series, wrong extremes
- if (!defined(axisMin) || !defined(axisMax)) {
- return;
- }
- if ((axis.horiz && !axis.reversed) ||
- (!axis.horiz && axis.reversed)) {
- to = unitedMin + range * this.to;
- from = unitedMin + range * this.from;
- }
- else {
- // y-values in browser are reversed, but this also
- // applies for reversed horizontal axis:
- to = unitedMin + range * (1 - this.from);
- from = unitedMin + range * (1 - this.to);
- }
- if (pick(this.options.liveRedraw, H.svg && !H.isTouchDevice && !this.chart.isBoosting) ||
- // Mouseup always should change extremes
- e.DOMType === 'mouseup' ||
- // Internal events
- !defined(e.DOMType)) {
- axis.setExtremes(from, to, true, e.DOMType !== 'mousemove', e);
- }
- else {
- // When live redraw is disabled, don't change extremes
- // Only change the position of the scollbar thumb
- this.setRange(this.from, this.to);
- }
- });
- }
- });
- // Wrap rendering axis, and update scrollbar if one is created:
- addEvent(AxisClass, 'afterRender', function () {
- var axis = this, scrollMin = Math.min(pick(axis.options.min, axis.min), axis.min, pick(axis.dataMin, axis.min) // #6930
- ), scrollMax = Math.max(pick(axis.options.max, axis.max), axis.max, pick(axis.dataMax, axis.max) // #6930
- ), scrollbar = axis.scrollbar, offset = axis.axisTitleMargin + (axis.titleOffset || 0), scrollbarsOffsets = axis.chart.scrollbarsOffsets, axisMargin = axis.options.margin || 0, offsetsIndex, from, to;
- if (scrollbar) {
- if (axis.horiz) {
- // Reserve space for labels/title
- if (!axis.opposite) {
- scrollbarsOffsets[1] += offset;
- }
- scrollbar.position(axis.left, axis.top + axis.height + 2 + scrollbarsOffsets[1] -
- (axis.opposite ? axisMargin : 0), axis.width, axis.height);
- // Next scrollbar should reserve space for margin (if set)
- if (!axis.opposite) {
- scrollbarsOffsets[1] += axisMargin;
- }
- offsetsIndex = 1;
- }
- else {
- // Reserve space for labels/title
- if (axis.opposite) {
- scrollbarsOffsets[0] += offset;
- }
- scrollbar.position(axis.left + axis.width + 2 + scrollbarsOffsets[0] -
- (axis.opposite ? 0 : axisMargin), axis.top, axis.width, axis.height);
- // Next scrollbar should reserve space for margin (if set)
- if (axis.opposite) {
- scrollbarsOffsets[0] += axisMargin;
- }
- offsetsIndex = 0;
- }
- scrollbarsOffsets[offsetsIndex] += scrollbar.size +
- scrollbar.options.margin;
- if (isNaN(scrollMin) ||
- isNaN(scrollMax) ||
- !defined(axis.min) ||
- !defined(axis.max) ||
- axis.min === axis.max // #10733
- ) {
- // default action: when extremes are the same or there is
- // not extremes on the axis, but scrollbar exists, make it
- // full size
- scrollbar.setRange(0, 1);
- }
- else {
- from =
- (axis.min - scrollMin) / (scrollMax - scrollMin);
- to =
- (axis.max - scrollMin) / (scrollMax - scrollMin);
- if ((axis.horiz && !axis.reversed) ||
- (!axis.horiz && axis.reversed)) {
- scrollbar.setRange(from, to);
- }
- else {
- // inverse vertical axis
- scrollbar.setRange(1 - to, 1 - from);
- }
- }
- }
- });
- // Make space for a scrollbar:
- addEvent(AxisClass, 'afterGetOffset', function () {
- var axis = this, index = axis.horiz ? 2 : 1, scrollbar = axis.scrollbar;
- if (scrollbar) {
- axis.chart.scrollbarsOffsets = [0, 0]; // reset scrollbars offsets
- axis.chart.axisOffset[index] +=
- scrollbar.size + scrollbar.options.margin;
- }
- });
- };
- return ScrollbarAxis;
- }());
- return ScrollbarAxis;
- });
- _registerModule(_modules, 'parts/Scrollbar.js', [_modules['parts/Axis.js'], _modules['parts/Globals.js'], _modules['parts/ScrollbarAxis.js'], _modules['parts/Utilities.js'], _modules['parts/Options.js']], function (Axis, H, ScrollbarAxis, U, O) {
- /* *
- *
- * (c) 2010-2020 Torstein Honsi
- *
- * License: www.highcharts.com/license
- *
- * !!!!!!! SOURCE GETS TRANSPILED BY TYPESCRIPT. EDIT TS FILE ONLY. !!!!!!!
- *
- * */
- var addEvent = U.addEvent, correctFloat = U.correctFloat, defined = U.defined, destroyObjectProperties = U.destroyObjectProperties, fireEvent = U.fireEvent, merge = U.merge, pick = U.pick, removeEvent = U.removeEvent;
- var defaultOptions = O.defaultOptions;
- var hasTouch = H.hasTouch, isTouchDevice = H.isTouchDevice;
- /**
- * When we have vertical scrollbar, rifles and arrow in buttons should be
- * rotated. The same method is used in Navigator's handles, to rotate them.
- *
- * @function Highcharts.swapXY
- *
- * @param {Highcharts.SVGPathArray} path
- * Path to be rotated.
- *
- * @param {boolean} [vertical]
- * If vertical scrollbar, swap x-y values.
- *
- * @return {Highcharts.SVGPathArray}
- * Rotated path.
- *
- * @requires modules/stock
- */
- var swapXY = H.swapXY = function (path, vertical) {
- if (vertical) {
- path.forEach(function (seg) {
- var len = seg.length;
- var temp;
- for (var i = 0; i < len; i += 2) {
- temp = seg[i + 1];
- if (typeof temp === 'number') {
- seg[i + 1] = seg[i + 2];
- seg[i + 2] = temp;
- }
- }
- });
- }
- return path;
- };
- /* eslint-disable no-invalid-this, valid-jsdoc */
- /**
- * A reusable scrollbar, internally used in Highstock's navigator and optionally
- * on individual axes.
- *
- * @private
- * @class
- * @name Highcharts.Scrollbar
- * @param {Highcharts.SVGRenderer} renderer
- * @param {Highcharts.ScrollbarOptions} options
- * @param {Highcharts.Chart} chart
- */
- var Scrollbar = /** @class */ (function () {
- /* *
- *
- * Constructors
- *
- * */
- function Scrollbar(renderer, options, chart) {
- /* *
- *
- * Properties
- *
- * */
- this._events = [];
- this.chartX = 0;
- this.chartY = 0;
- this.from = 0;
- this.group = void 0;
- this.scrollbar = void 0;
- this.scrollbarButtons = [];
- this.scrollbarGroup = void 0;
- this.scrollbarLeft = 0;
- this.scrollbarRifles = void 0;
- this.scrollbarStrokeWidth = 1;
- this.scrollbarTop = 0;
- this.size = 0;
- this.to = 0;
- this.track = void 0;
- this.trackBorderWidth = 1;
- this.userOptions = {};
- this.x = 0;
- this.y = 0;
- this.chart = chart;
- this.options = options;
- this.renderer = chart.renderer;
- this.init(renderer, options, chart);
- }
- /* *
- *
- * Functions
- *
- * */
- /**
- * Set up the mouse and touch events for the Scrollbar
- *
- * @private
- * @function Highcharts.Scrollbar#addEvents
- * @return {void}
- */
- Scrollbar.prototype.addEvents = function () {
- var buttonsOrder = this.options.inverted ? [1, 0] : [0, 1], buttons = this.scrollbarButtons, bar = this.scrollbarGroup.element, track = this.track.element, mouseDownHandler = this.mouseDownHandler.bind(this), mouseMoveHandler = this.mouseMoveHandler.bind(this), mouseUpHandler = this.mouseUpHandler.bind(this), _events;
- // Mouse events
- _events = [
- [buttons[buttonsOrder[0]].element, 'click', this.buttonToMinClick.bind(this)],
- [buttons[buttonsOrder[1]].element, 'click', this.buttonToMaxClick.bind(this)],
- [track, 'click', this.trackClick.bind(this)],
- [bar, 'mousedown', mouseDownHandler],
- [bar.ownerDocument, 'mousemove', mouseMoveHandler],
- [bar.ownerDocument, 'mouseup', mouseUpHandler]
- ];
- // Touch events
- if (hasTouch) {
- _events.push([bar, 'touchstart', mouseDownHandler], [bar.ownerDocument, 'touchmove', mouseMoveHandler], [bar.ownerDocument, 'touchend', mouseUpHandler]);
- }
- // Add them all
- _events.forEach(function (args) {
- addEvent.apply(null, args);
- });
- this._events = _events;
- };
- Scrollbar.prototype.buttonToMaxClick = function (e) {
- var scroller = this;
- var range = (scroller.to - scroller.from) * pick(scroller.options.step, 0.2);
- scroller.updatePosition(scroller.from + range, scroller.to + range);
- fireEvent(scroller, 'changed', {
- from: scroller.from,
- to: scroller.to,
- trigger: 'scrollbar',
- DOMEvent: e
- });
- };
- Scrollbar.prototype.buttonToMinClick = function (e) {
- var scroller = this;
- var range = correctFloat(scroller.to - scroller.from) *
- pick(scroller.options.step, 0.2);
- scroller.updatePosition(correctFloat(scroller.from - range), correctFloat(scroller.to - range));
- fireEvent(scroller, 'changed', {
- from: scroller.from,
- to: scroller.to,
- trigger: 'scrollbar',
- DOMEvent: e
- });
- };
- /**
- * Get normalized (0-1) cursor position over the scrollbar
- *
- * @private
- * @function Highcharts.Scrollbar#cursorToScrollbarPosition
- *
- * @param {*} normalizedEvent
- * normalized event, with chartX and chartY values
- *
- * @return {Highcharts.Dictionary<number>}
- * Local position {chartX, chartY}
- */
- Scrollbar.prototype.cursorToScrollbarPosition = function (normalizedEvent) {
- var scroller = this, options = scroller.options, minWidthDifference = options.minWidth > scroller.calculatedWidth ?
- options.minWidth :
- 0; // minWidth distorts translation
- return {
- chartX: (normalizedEvent.chartX - scroller.x -
- scroller.xOffset) /
- (scroller.barWidth - minWidthDifference),
- chartY: (normalizedEvent.chartY - scroller.y -
- scroller.yOffset) /
- (scroller.barWidth - minWidthDifference)
- };
- };
- /**
- * Destroys allocated elements.
- *
- * @private
- * @function Highcharts.Scrollbar#destroy
- * @return {void}
- */
- Scrollbar.prototype.destroy = function () {
- var scroller = this.chart.scroller;
- // Disconnect events added in addEvents
- this.removeEvents();
- // Destroy properties
- [
- 'track',
- 'scrollbarRifles',
- 'scrollbar',
- 'scrollbarGroup',
- 'group'
- ].forEach(function (prop) {
- if (this[prop] && this[prop].destroy) {
- this[prop] = this[prop].destroy();
- }
- }, this);
- // #6421, chart may have more scrollbars
- if (scroller && this === scroller.scrollbar) {
- scroller.scrollbar = null;
- // Destroy elements in collection
- destroyObjectProperties(scroller.scrollbarButtons);
- }
- };
- /**
- * Draw the scrollbar buttons with arrows
- *
- * @private
- * @function Highcharts.Scrollbar#drawScrollbarButton
- * @param {number} index
- * 0 is left, 1 is right
- * @return {void}
- */
- Scrollbar.prototype.drawScrollbarButton = function (index) {
- var scroller = this, renderer = scroller.renderer, scrollbarButtons = scroller.scrollbarButtons, options = scroller.options, size = scroller.size, group, tempElem;
- group = renderer.g().add(scroller.group);
- scrollbarButtons.push(group);
- // Create a rectangle for the scrollbar button
- tempElem = renderer.rect()
- .addClass('highcharts-scrollbar-button')
- .add(group);
- // Presentational attributes
- if (!this.chart.styledMode) {
- tempElem.attr({
- stroke: options.buttonBorderColor,
- 'stroke-width': options.buttonBorderWidth,
- fill: options.buttonBackgroundColor
- });
- }
- // Place the rectangle based on the rendered stroke width
- tempElem.attr(tempElem.crisp({
- x: -0.5,
- y: -0.5,
- width: size + 1,
- height: size + 1,
- r: options.buttonBorderRadius
- }, tempElem.strokeWidth()));
- // Button arrow
- tempElem = renderer
- .path(swapXY([[
- 'M',
- size / 2 + (index ? -1 : 1),
- size / 2 - 3
- ], [
- 'L',
- size / 2 + (index ? -1 : 1),
- size / 2 + 3
- ], [
- 'L',
- size / 2 + (index ? 2 : -2),
- size / 2
- ]], options.vertical))
- .addClass('highcharts-scrollbar-arrow')
- .add(scrollbarButtons[index]);
- if (!this.chart.styledMode) {
- tempElem.attr({
- fill: options.buttonArrowColor
- });
- }
- };
- /**
- * @private
- * @function Highcharts.Scrollbar#init
- * @param {Highcharts.SVGRenderer} renderer
- * @param {Highcharts.ScrollbarOptions} options
- * @param {Highcharts.Chart} chart
- */
- Scrollbar.prototype.init = function (renderer, options, chart) {
- this.scrollbarButtons = [];
- this.renderer = renderer;
- this.userOptions = options;
- this.options = merge(Scrollbar.defaultOptions, options);
- this.chart = chart;
- // backward compatibility
- this.size = pick(this.options.size, this.options.height);
- // Init
- if (options.enabled) {
- this.render();
- this.addEvents();
- }
- };
- Scrollbar.prototype.mouseDownHandler = function (e) {
- var scroller = this;
- var normalizedEvent = scroller.chart.pointer.normalize(e), mousePosition = scroller.cursorToScrollbarPosition(normalizedEvent);
- scroller.chartX = mousePosition.chartX;
- scroller.chartY = mousePosition.chartY;
- scroller.initPositions = [scroller.from, scroller.to];
- scroller.grabbedCenter = true;
- };
- /**
- * Event handler for the mouse move event.
- * @private
- */
- Scrollbar.prototype.mouseMoveHandler = function (e) {
- var scroller = this;
- var normalizedEvent = scroller.chart.pointer.normalize(e), options = scroller.options, direction = options.vertical ? 'chartY' : 'chartX', initPositions = scroller.initPositions || [], scrollPosition, chartPosition, change;
- // In iOS, a mousemove event with e.pageX === 0 is fired when
- // holding the finger down in the center of the scrollbar. This
- // should be ignored.
- if (scroller.grabbedCenter &&
- // #4696, scrollbar failed on Android
- (!e.touches || e.touches[0][direction] !== 0)) {
- chartPosition = scroller.cursorToScrollbarPosition(normalizedEvent)[direction];
- scrollPosition = scroller[direction];
- change = chartPosition - scrollPosition;
- scroller.hasDragged = true;
- scroller.updatePosition(initPositions[0] + change, initPositions[1] + change);
- if (scroller.hasDragged) {
- fireEvent(scroller, 'changed', {
- from: scroller.from,
- to: scroller.to,
- trigger: 'scrollbar',
- DOMType: e.type,
- DOMEvent: e
- });
- }
- }
- };
- /**
- * Event handler for the mouse up event.
- * @private
- */
- Scrollbar.prototype.mouseUpHandler = function (e) {
- var scroller = this;
- if (scroller.hasDragged) {
- fireEvent(scroller, 'changed', {
- from: scroller.from,
- to: scroller.to,
- trigger: 'scrollbar',
- DOMType: e.type,
- DOMEvent: e
- });
- }
- scroller.grabbedCenter =
- scroller.hasDragged =
- scroller.chartX =
- scroller.chartY = null;
- };
- /**
- * Position the scrollbar, method called from a parent with defined
- * dimensions.
- *
- * @private
- * @function Highcharts.Scrollbar#position
- * @param {number} x
- * x-position on the chart
- * @param {number} y
- * y-position on the chart
- * @param {number} width
- * width of the scrollbar
- * @param {number} height
- * height of the scorllbar
- * @return {void}
- */
- Scrollbar.prototype.position = function (x, y, width, height) {
- var scroller = this, options = scroller.options, vertical = options.vertical, xOffset = height, yOffset = 0, method = scroller.rendered ? 'animate' : 'attr';
- scroller.x = x;
- scroller.y = y + this.trackBorderWidth;
- scroller.width = width; // width with buttons
- scroller.height = height;
- scroller.xOffset = xOffset;
- scroller.yOffset = yOffset;
- // If Scrollbar is a vertical type, swap options:
- if (vertical) {
- scroller.width = scroller.yOffset = width = yOffset = scroller.size;
- scroller.xOffset = xOffset = 0;
- scroller.barWidth = height - width * 2; // width without buttons
- scroller.x = x = x + scroller.options.margin;
- }
- else {
- scroller.height = scroller.xOffset = height = xOffset =
- scroller.size;
- scroller.barWidth = width - height * 2; // width without buttons
- scroller.y = scroller.y + scroller.options.margin;
- }
- // Set general position for a group:
- scroller.group[method]({
- translateX: x,
- translateY: scroller.y
- });
- // Resize background/track:
- scroller.track[method]({
- width: width,
- height: height
- });
- // Move right/bottom button ot it's place:
- scroller.scrollbarButtons[1][method]({
- translateX: vertical ? 0 : width - xOffset,
- translateY: vertical ? height - yOffset : 0
- });
- };
- /**
- * Removes the event handlers attached previously with addEvents.
- *
- * @private
- * @function Highcharts.Scrollbar#removeEvents
- * @return {void}
- */
- Scrollbar.prototype.removeEvents = function () {
- this._events.forEach(function (args) {
- removeEvent.apply(null, args);
- });
- this._events.length = 0;
- };
- /**
- * Render scrollbar with all required items.
- *
- * @private
- * @function Highcharts.Scrollbar#render
- */
- Scrollbar.prototype.render = function () {
- var scroller = this, renderer = scroller.renderer, options = scroller.options, size = scroller.size, styledMode = this.chart.styledMode, group;
- // Draw the scrollbar group
- scroller.group = group = renderer.g('scrollbar').attr({
- zIndex: options.zIndex,
- translateY: -99999
- }).add();
- // Draw the scrollbar track:
- scroller.track = renderer.rect()
- .addClass('highcharts-scrollbar-track')
- .attr({
- x: 0,
- r: options.trackBorderRadius || 0,
- height: size,
- width: size
- }).add(group);
- if (!styledMode) {
- scroller.track.attr({
- fill: options.trackBackgroundColor,
- stroke: options.trackBorderColor,
- 'stroke-width': options.trackBorderWidth
- });
- }
- this.trackBorderWidth = scroller.track.strokeWidth();
- scroller.track.attr({
- y: -this.trackBorderWidth % 2 / 2
- });
- // Draw the scrollbar itself
- scroller.scrollbarGroup = renderer.g().add(group);
- scroller.scrollbar = renderer.rect()
- .addClass('highcharts-scrollbar-thumb')
- .attr({
- height: size,
- width: size,
- r: options.barBorderRadius || 0
- }).add(scroller.scrollbarGroup);
- scroller.scrollbarRifles = renderer
- .path(swapXY([
- ['M', -3, size / 4],
- ['L', -3, 2 * size / 3],
- ['M', 0, size / 4],
- ['L', 0, 2 * size / 3],
- ['M', 3, size / 4],
- ['L', 3, 2 * size / 3]
- ], options.vertical))
- .addClass('highcharts-scrollbar-rifles')
- .add(scroller.scrollbarGroup);
- if (!styledMode) {
- scroller.scrollbar.attr({
- fill: options.barBackgroundColor,
- stroke: options.barBorderColor,
- 'stroke-width': options.barBorderWidth
- });
- scroller.scrollbarRifles.attr({
- stroke: options.rifleColor,
- 'stroke-width': 1
- });
- }
- scroller.scrollbarStrokeWidth = scroller.scrollbar.strokeWidth();
- scroller.scrollbarGroup.translate(-scroller.scrollbarStrokeWidth % 2 / 2, -scroller.scrollbarStrokeWidth % 2 / 2);
- // Draw the buttons:
- scroller.drawScrollbarButton(0);
- scroller.drawScrollbarButton(1);
- };
- /**
- * Set scrollbar size, with a given scale.
- *
- * @private
- * @function Highcharts.Scrollbar#setRange
- * @param {number} from
- * scale (0-1) where bar should start
- * @param {number} to
- * scale (0-1) where bar should end
- * @return {void}
- */
- Scrollbar.prototype.setRange = function (from, to) {
- var scroller = this, options = scroller.options, vertical = options.vertical, minWidth = options.minWidth, fullWidth = scroller.barWidth, fromPX, toPX, newPos, newSize, newRiflesPos, method = (this.rendered &&
- !this.hasDragged &&
- !(this.chart.navigator && this.chart.navigator.hasDragged)) ? 'animate' : 'attr';
- if (!defined(fullWidth)) {
- return;
- }
- from = Math.max(from, 0);
- fromPX = Math.ceil(fullWidth * from);
- toPX = fullWidth * Math.min(to, 1);
- scroller.calculatedWidth = newSize = correctFloat(toPX - fromPX);
- // We need to recalculate position, if minWidth is used
- if (newSize < minWidth) {
- fromPX = (fullWidth - minWidth + newSize) * from;
- newSize = minWidth;
- }
- newPos = Math.floor(fromPX + scroller.xOffset + scroller.yOffset);
- newRiflesPos = newSize / 2 - 0.5; // -0.5 -> rifle line width / 2
- // Store current position:
- scroller.from = from;
- scroller.to = to;
- if (!vertical) {
- scroller.scrollbarGroup[method]({
- translateX: newPos
- });
- scroller.scrollbar[method]({
- width: newSize
- });
- scroller.scrollbarRifles[method]({
- translateX: newRiflesPos
- });
- scroller.scrollbarLeft = newPos;
- scroller.scrollbarTop = 0;
- }
- else {
- scroller.scrollbarGroup[method]({
- translateY: newPos
- });
- scroller.scrollbar[method]({
- height: newSize
- });
- scroller.scrollbarRifles[method]({
- translateY: newRiflesPos
- });
- scroller.scrollbarTop = newPos;
- scroller.scrollbarLeft = 0;
- }
- if (newSize <= 12) {
- scroller.scrollbarRifles.hide();
- }
- else {
- scroller.scrollbarRifles.show(true);
- }
- // Show or hide the scrollbar based on the showFull setting
- if (options.showFull === false) {
- if (from <= 0 && to >= 1) {
- scroller.group.hide();
- }
- else {
- scroller.group.show();
- }
- }
- scroller.rendered = true;
- };
- Scrollbar.prototype.trackClick = function (e) {
- var scroller = this;
- var normalizedEvent = scroller.chart.pointer.normalize(e), range = scroller.to - scroller.from, top = scroller.y + scroller.scrollbarTop, left = scroller.x + scroller.scrollbarLeft;
- if ((scroller.options.vertical && normalizedEvent.chartY > top) ||
- (!scroller.options.vertical && normalizedEvent.chartX > left)) {
- // On the top or on the left side of the track:
- scroller.updatePosition(scroller.from + range, scroller.to + range);
- }
- else {
- // On the bottom or the right side of the track:
- scroller.updatePosition(scroller.from - range, scroller.to - range);
- }
- fireEvent(scroller, 'changed', {
- from: scroller.from,
- to: scroller.to,
- trigger: 'scrollbar',
- DOMEvent: e
- });
- };
- /**
- * Update the scrollbar with new options
- *
- * @private
- * @function Highcharts.Scrollbar#update
- * @param {Highcharts.ScrollbarOptions} options
- * @return {void}
- */
- Scrollbar.prototype.update = function (options) {
- this.destroy();
- this.init(this.chart.renderer, merge(true, this.options, options), this.chart);
- };
- /**
- * Update position option in the Scrollbar, with normalized 0-1 scale
- *
- * @private
- * @function Highcharts.Scrollbar#updatePosition
- * @param {number} from
- * @param {number} to
- * @return {void}
- */
- Scrollbar.prototype.updatePosition = function (from, to) {
- if (to > 1) {
- from = correctFloat(1 - correctFloat(to - from));
- to = 1;
- }
- if (from < 0) {
- to = correctFloat(to - from);
- from = 0;
- }
- this.from = from;
- this.to = to;
- };
- /* *
- *
- * Static Properties
- *
- * */
- /**
- *
- * The scrollbar is a means of panning over the X axis of a stock chart.
- * Scrollbars can also be applied to other types of axes.
- *
- * Another approach to scrollable charts is the [chart.scrollablePlotArea](
- * https://api.highcharts.com/highcharts/chart.scrollablePlotArea) option that
- * is especially suitable for simpler cartesian charts on mobile.
- *
- * In styled mode, all the presentational options for the
- * scrollbar are replaced by the classes `.highcharts-scrollbar-thumb`,
- * `.highcharts-scrollbar-arrow`, `.highcharts-scrollbar-button`,
- * `.highcharts-scrollbar-rifles` and `.highcharts-scrollbar-track`.
- *
- * @sample stock/yaxis/inverted-bar-scrollbar/
- * A scrollbar on a simple bar chart
- *
- * @product highstock gantt
- * @optionparent scrollbar
- *
- * @private
- */
- Scrollbar.defaultOptions = {
- /**
- * The height of the scrollbar. The height also applies to the width
- * of the scroll arrows so that they are always squares. Defaults to
- * 20 for touch devices and 14 for mouse devices.
- *
- * @sample stock/scrollbar/height/
- * A 30px scrollbar
- *
- * @type {number}
- * @default 20/14
- */
- height: isTouchDevice ? 20 : 14,
- /**
- * The border rounding radius of the bar.
- *
- * @sample stock/scrollbar/style/
- * Scrollbar styling
- */
- barBorderRadius: 0,
- /**
- * The corner radius of the scrollbar buttons.
- *
- * @sample stock/scrollbar/style/
- * Scrollbar styling
- */
- buttonBorderRadius: 0,
- /**
- * Enable or disable the scrollbar.
- *
- * @sample stock/scrollbar/enabled/
- * Disable the scrollbar, only use navigator
- *
- * @type {boolean}
- * @default true
- * @apioption scrollbar.enabled
- */
- /**
- * Whether to redraw the main chart as the scrollbar or the navigator
- * zoomed window is moved. Defaults to `true` for modern browsers and
- * `false` for legacy IE browsers as well as mobile devices.
- *
- * @sample stock/scrollbar/liveredraw
- * Setting live redraw to false
- *
- * @type {boolean}
- * @since 1.3
- */
- liveRedraw: void 0,
- /**
- * The margin between the scrollbar and its axis when the scrollbar is
- * applied directly to an axis.
- */
- margin: 10,
- /**
- * The minimum width of the scrollbar.
- *
- * @since 1.2.5
- */
- minWidth: 6,
- /**
- * Whether to show or hide the scrollbar when the scrolled content is
- * zoomed out to it full extent.
- *
- * @type {boolean}
- * @default true
- * @apioption scrollbar.showFull
- */
- step: 0.2,
- /**
- * The z index of the scrollbar group.
- */
- zIndex: 3,
- /**
- * The background color of the scrollbar itself.
- *
- * @sample stock/scrollbar/style/
- * Scrollbar styling
- *
- * @type {Highcharts.ColorString|Highcharts.GradientColorObject|Highcharts.PatternObject}
- */
- barBackgroundColor: '#cccccc',
- /**
- * The width of the bar's border.
- *
- * @sample stock/scrollbar/style/
- * Scrollbar styling
- */
- barBorderWidth: 1,
- /**
- * The color of the scrollbar's border.
- *
- * @type {Highcharts.ColorString|Highcharts.GradientColorObject|Highcharts.PatternObject}
- */
- barBorderColor: '#cccccc',
- /**
- * The color of the small arrow inside the scrollbar buttons.
- *
- * @sample stock/scrollbar/style/
- * Scrollbar styling
- *
- * @type {Highcharts.ColorString|Highcharts.GradientColorObject|Highcharts.PatternObject}
- */
- buttonArrowColor: '#333333',
- /**
- * The color of scrollbar buttons.
- *
- * @sample stock/scrollbar/style/
- * Scrollbar styling
- *
- * @type {Highcharts.ColorString|Highcharts.GradientColorObject|Highcharts.PatternObject}
- */
- buttonBackgroundColor: '#e6e6e6',
- /**
- * The color of the border of the scrollbar buttons.
- *
- * @sample stock/scrollbar/style/
- * Scrollbar styling
- *
- * @type {Highcharts.ColorString|Highcharts.GradientColorObject|Highcharts.PatternObject}
- */
- buttonBorderColor: '#cccccc',
- /**
- * The border width of the scrollbar buttons.
- *
- * @sample stock/scrollbar/style/
- * Scrollbar styling
- */
- buttonBorderWidth: 1,
- /**
- * The color of the small rifles in the middle of the scrollbar.
- *
- * @type {Highcharts.ColorString|Highcharts.GradientColorObject|Highcharts.PatternObject}
- */
- rifleColor: '#333333',
- /**
- * The color of the track background.
- *
- * @sample stock/scrollbar/style/
- * Scrollbar styling
- *
- * @type {Highcharts.ColorString|Highcharts.GradientColorObject|Highcharts.PatternObject}
- */
- trackBackgroundColor: '#f2f2f2',
- /**
- * The color of the border of the scrollbar track.
- *
- * @sample stock/scrollbar/style/
- * Scrollbar styling
- *
- * @type {Highcharts.ColorString|Highcharts.GradientColorObject|Highcharts.PatternObject}
- */
- trackBorderColor: '#f2f2f2',
- /**
- * The corner radius of the border of the scrollbar track.
- *
- * @sample stock/scrollbar/style/
- * Scrollbar styling
- *
- * @type {number}
- * @default 0
- * @apioption scrollbar.trackBorderRadius
- */
- /**
- * The width of the border of the scrollbar track.
- *
- * @sample stock/scrollbar/style/
- * Scrollbar styling
- */
- trackBorderWidth: 1
- };
- return Scrollbar;
- }());
- if (!H.Scrollbar) {
- defaultOptions.scrollbar = merge(true, Scrollbar.defaultOptions, defaultOptions.scrollbar);
- H.Scrollbar = Scrollbar;
- ScrollbarAxis.compose(Axis, Scrollbar);
- }
- return H.Scrollbar;
- });
- _registerModule(_modules, 'parts/Navigator.js', [_modules['parts/Axis.js'], _modules['parts/Chart.js'], _modules['parts/Color.js'], _modules['parts/Globals.js'], _modules['parts/NavigatorAxis.js'], _modules['parts/Options.js'], _modules['parts/Scrollbar.js'], _modules['parts/Utilities.js']], function (Axis, Chart, Color, H, NavigatorAxis, O, Scrollbar, U) {
- /* *
- *
- * (c) 2010-2020 Torstein Honsi
- *
- * License: www.highcharts.com/license
- *
- * !!!!!!! SOURCE GETS TRANSPILED BY TYPESCRIPT. EDIT TS FILE ONLY. !!!!!!!
- *
- * */
- var color = Color.parse;
- var defaultOptions = O.defaultOptions;
- var addEvent = U.addEvent, clamp = U.clamp, correctFloat = U.correctFloat, defined = U.defined, destroyObjectProperties = U.destroyObjectProperties, erase = U.erase, extend = U.extend, find = U.find, isArray = U.isArray, isNumber = U.isNumber, merge = U.merge, pick = U.pick, removeEvent = U.removeEvent, splat = U.splat;
- var hasTouch = H.hasTouch, isTouchDevice = H.isTouchDevice, Series = H.Series, seriesTypes = H.seriesTypes, defaultSeriesType,
- // Finding the min or max of a set of variables where we don't know if they
- // are defined, is a pattern that is repeated several places in Highcharts.
- // Consider making this a global utility method.
- numExt = function (extreme) {
- var args = [];
- for (var _i = 1; _i < arguments.length; _i++) {
- args[_i - 1] = arguments[_i];
- }
- var numbers = [].filter.call(args, isNumber);
- if (numbers.length) {
- return Math[extreme].apply(0, numbers);
- }
- };
- defaultSeriesType = typeof seriesTypes.areaspline === 'undefined' ?
- 'line' :
- 'areaspline';
- extend(defaultOptions, {
- /**
- * Maximum range which can be set using the navigator's handles.
- * Opposite of [xAxis.minRange](#xAxis.minRange).
- *
- * @sample {highstock} stock/navigator/maxrange/
- * Defined max and min range
- *
- * @type {number}
- * @since 6.0.0
- * @product highstock gantt
- * @apioption xAxis.maxRange
- */
- /**
- * The navigator is a small series below the main series, displaying
- * a view of the entire data set. It provides tools to zoom in and
- * out on parts of the data as well as panning across the dataset.
- *
- * @product highstock gantt
- * @optionparent navigator
- */
- navigator: {
- /**
- * Whether the navigator and scrollbar should adapt to updated data
- * in the base X axis. When loading data async, as in the demo below,
- * this should be `false`. Otherwise new data will trigger navigator
- * redraw, which will cause unwanted looping. In the demo below, the
- * data in the navigator is set only once. On navigating, only the main
- * chart content is updated.
- *
- * @sample {highstock} stock/demo/lazy-loading/
- * Set to false with async data loading
- *
- * @type {boolean}
- * @default true
- * @apioption navigator.adaptToUpdatedData
- */
- /**
- * An integer identifying the index to use for the base series, or a
- * string representing the id of the series.
- *
- * **Note**: As of Highcharts 5.0, this is now a deprecated option.
- * Prefer [series.showInNavigator](#plotOptions.series.showInNavigator).
- *
- * @see [series.showInNavigator](#plotOptions.series.showInNavigator)
- *
- * @deprecated
- * @type {number|string}
- * @default 0
- * @apioption navigator.baseSeries
- */
- /**
- * Enable or disable the navigator.
- *
- * @sample {highstock} stock/navigator/enabled/
- * Disable the navigator
- *
- * @type {boolean}
- * @default true
- * @apioption navigator.enabled
- */
- /**
- * When the chart is inverted, whether to draw the navigator on the
- * opposite side.
- *
- * @type {boolean}
- * @default false
- * @since 5.0.8
- * @apioption navigator.opposite
- */
- /**
- * The height of the navigator.
- *
- * @sample {highstock} stock/navigator/height/
- * A higher navigator
- */
- height: 40,
- /**
- * The distance from the nearest element, the X axis or X axis labels.
- *
- * @sample {highstock} stock/navigator/margin/
- * A margin of 2 draws the navigator closer to the X axis labels
- */
- margin: 25,
- /**
- * Whether the mask should be inside the range marking the zoomed
- * range, or outside. In Highstock 1.x it was always `false`.
- *
- * @sample {highstock} stock/navigator/maskinside-false/
- * False, mask outside
- *
- * @since 2.0
- */
- maskInside: true,
- /**
- * Options for the handles for dragging the zoomed area.
- *
- * @sample {highstock} stock/navigator/handles/
- * Colored handles
- */
- handles: {
- /**
- * Width for handles.
- *
- * @sample {highstock} stock/navigator/styled-handles/
- * Styled handles
- *
- * @since 6.0.0
- */
- width: 7,
- /**
- * Height for handles.
- *
- * @sample {highstock} stock/navigator/styled-handles/
- * Styled handles
- *
- * @since 6.0.0
- */
- height: 15,
- /**
- * Array to define shapes of handles. 0-index for left, 1-index for
- * right.
- *
- * Additionally, the URL to a graphic can be given on this form:
- * `url(graphic.png)`. Note that for the image to be applied to
- * exported charts, its URL needs to be accessible by the export
- * server.
- *
- * Custom callbacks for symbol path generation can also be added to
- * `Highcharts.SVGRenderer.prototype.symbols`. The callback is then
- * used by its method name, as shown in the demo.
- *
- * @sample {highstock} stock/navigator/styled-handles/
- * Styled handles
- *
- * @type {Array<string>}
- * @default ["navigator-handle", "navigator-handle"]
- * @since 6.0.0
- */
- symbols: ['navigator-handle', 'navigator-handle'],
- /**
- * Allows to enable/disable handles.
- *
- * @since 6.0.0
- */
- enabled: true,
- /**
- * The width for the handle border and the stripes inside.
- *
- * @sample {highstock} stock/navigator/styled-handles/
- * Styled handles
- *
- * @since 6.0.0
- * @apioption navigator.handles.lineWidth
- */
- lineWidth: 1,
- /**
- * The fill for the handle.
- *
- * @type {Highcharts.ColorString|Highcharts.GradientColorObject|Highcharts.PatternObject}
- */
- backgroundColor: '#f2f2f2',
- /**
- * The stroke for the handle border and the stripes inside.
- *
- * @type {Highcharts.ColorString|Highcharts.GradientColorObject|Highcharts.PatternObject}
- */
- borderColor: '#999999'
- },
- /**
- * The color of the mask covering the areas of the navigator series
- * that are currently not visible in the main series. The default
- * color is bluish with an opacity of 0.3 to see the series below.
- *
- * @see In styled mode, the mask is styled with the
- * `.highcharts-navigator-mask` and
- * `.highcharts-navigator-mask-inside` classes.
- *
- * @sample {highstock} stock/navigator/maskfill/
- * Blue, semi transparent mask
- *
- * @type {Highcharts.ColorString|Highcharts.GradientColorObject|Highcharts.PatternObject}
- * @default rgba(102,133,194,0.3)
- */
- maskFill: color('#6685c2').setOpacity(0.3).get(),
- /**
- * The color of the line marking the currently zoomed area in the
- * navigator.
- *
- * @sample {highstock} stock/navigator/outline/
- * 2px blue outline
- *
- * @type {Highcharts.ColorString|Highcharts.GradientColorObject|Highcharts.PatternObject}
- * @default #cccccc
- */
- outlineColor: '#cccccc',
- /**
- * The width of the line marking the currently zoomed area in the
- * navigator.
- *
- * @see In styled mode, the outline stroke width is set with the
- * `.highcharts-navigator-outline` class.
- *
- * @sample {highstock} stock/navigator/outline/
- * 2px blue outline
- *
- * @type {number}
- */
- outlineWidth: 1,
- /**
- * Options for the navigator series. Available options are the same
- * as any series, documented at [plotOptions](#plotOptions.series)
- * and [series](#series).
- *
- * Unless data is explicitly defined on navigator.series, the data
- * is borrowed from the first series in the chart.
- *
- * Default series options for the navigator series are:
- * ```js
- * series: {
- * type: 'areaspline',
- * fillOpacity: 0.05,
- * dataGrouping: {
- * smoothed: true
- * },
- * lineWidth: 1,
- * marker: {
- * enabled: false
- * }
- * }
- * ```
- *
- * @see In styled mode, the navigator series is styled with the
- * `.highcharts-navigator-series` class.
- *
- * @sample {highstock} stock/navigator/series-data/
- * Using a separate data set for the navigator
- * @sample {highstock} stock/navigator/series/
- * A green navigator series
- *
- * @type {*|Array<*>|Highcharts.SeriesOptionsType|Array<Highcharts.SeriesOptionsType>}
- */
- series: {
- /**
- * The type of the navigator series. Defaults to `areaspline` if
- * defined, otherwise `line`.
- *
- * Heads up:
- * In column-type navigator, zooming is limited to at least one
- * point with its `pointRange`.
- *
- * @sample {highstock} stock/navigator/column/
- * Column type navigator
- *
- * @type {string}
- * @default areaspline
- */
- type: defaultSeriesType,
- /**
- * The fill opacity of the navigator series.
- */
- fillOpacity: 0.05,
- /**
- * The pixel line width of the navigator series.
- */
- lineWidth: 1,
- /**
- * @ignore-option
- */
- compare: null,
- /**
- * Unless data is explicitly defined, the data is borrowed from the
- * first series in the chart.
- *
- * @type {Array<number|Array<number|string|null>|object|null>}
- * @product highstock
- * @apioption navigator.series.data
- */
- /**
- * Data grouping options for the navigator series.
- *
- * @extends plotOptions.series.dataGrouping
- */
- dataGrouping: {
- approximation: 'average',
- enabled: true,
- groupPixelWidth: 2,
- smoothed: true,
- // Day and week differs from plotOptions.series.dataGrouping
- units: [
- ['millisecond', [1, 2, 5, 10, 20, 25, 50, 100, 200, 500]],
- ['second', [1, 2, 5, 10, 15, 30]],
- ['minute', [1, 2, 5, 10, 15, 30]],
- ['hour', [1, 2, 3, 4, 6, 8, 12]],
- ['day', [1, 2, 3, 4]],
- ['week', [1, 2, 3]],
- ['month', [1, 3, 6]],
- ['year', null]
- ]
- },
- /**
- * Data label options for the navigator series. Data labels are
- * disabled by default on the navigator series.
- *
- * @extends plotOptions.series.dataLabels
- */
- dataLabels: {
- enabled: false,
- zIndex: 2 // #1839
- },
- id: 'highcharts-navigator-series',
- className: 'highcharts-navigator-series',
- /**
- * Sets the fill color of the navigator series.
- *
- * @type {Highcharts.ColorString|Highcharts.GradientColorObject|Highcharts.PatternObject}
- * @apioption navigator.series.color
- */
- /**
- * Line color for the navigator series. Allows setting the color
- * while disallowing the default candlestick setting.
- *
- * @type {Highcharts.ColorString|null}
- */
- lineColor: null,
- marker: {
- enabled: false
- },
- /**
- * Since Highstock v8, default value is the same as default
- * `pointRange` defined for a specific type (e.g. `null` for
- * column type).
- *
- * In Highstock version < 8, defaults to 0.
- *
- * @extends plotOptions.series.pointRange
- * @type {number|null}
- * @apioption navigator.series.pointRange
- */
- /**
- * The threshold option. Setting it to 0 will make the default
- * navigator area series draw its area from the 0 value and up.
- *
- * @type {number|null}
- */
- threshold: null
- },
- /**
- * Options for the navigator X axis. Default series options for the
- * navigator xAxis are:
- * ```js
- * xAxis: {
- * tickWidth: 0,
- * lineWidth: 0,
- * gridLineWidth: 1,
- * tickPixelInterval: 200,
- * labels: {
- * align: 'left',
- * style: {
- * color: '#888'
- * },
- * x: 3,
- * y: -4
- * }
- * }
- * ```
- *
- * @extends xAxis
- * @excluding linkedTo, maxZoom, minRange, opposite, range, scrollbar,
- * showEmpty, maxRange
- */
- xAxis: {
- /**
- * Additional range on the right side of the xAxis. Works similar to
- * xAxis.maxPadding, but value is set in milliseconds.
- * Can be set for both, main xAxis and navigator's xAxis.
- *
- * @since 6.0.0
- */
- overscroll: 0,
- className: 'highcharts-navigator-xaxis',
- tickLength: 0,
- lineWidth: 0,
- gridLineColor: '#e6e6e6',
- gridLineWidth: 1,
- tickPixelInterval: 200,
- labels: {
- align: 'left',
- /**
- * @type {Highcharts.CSSObject}
- */
- style: {
- /** @ignore */
- color: '#999999'
- },
- x: 3,
- y: -4
- },
- crosshair: false
- },
- /**
- * Options for the navigator Y axis. Default series options for the
- * navigator yAxis are:
- * ```js
- * yAxis: {
- * gridLineWidth: 0,
- * startOnTick: false,
- * endOnTick: false,
- * minPadding: 0.1,
- * maxPadding: 0.1,
- * labels: {
- * enabled: false
- * },
- * title: {
- * text: null
- * },
- * tickWidth: 0
- * }
- * ```
- *
- * @extends yAxis
- * @excluding height, linkedTo, maxZoom, minRange, ordinal, range,
- * showEmpty, scrollbar, top, units, maxRange, minLength,
- * maxLength, resize
- */
- yAxis: {
- className: 'highcharts-navigator-yaxis',
- gridLineWidth: 0,
- startOnTick: false,
- endOnTick: false,
- minPadding: 0.1,
- maxPadding: 0.1,
- labels: {
- enabled: false
- },
- crosshair: false,
- title: {
- text: null
- },
- tickLength: 0,
- tickWidth: 0
- }
- }
- });
- /* eslint-disable no-invalid-this, valid-jsdoc */
- /**
- * Draw one of the handles on the side of the zoomed range in the navigator
- *
- * @private
- * @function Highcharts.Renderer#symbols.navigator-handle
- * @param {number} x
- * @param {number} y
- * @param {number} w
- * @param {number} h
- * @param {Highcharts.NavigatorHandlesOptions} options
- * @return {Highcharts.SVGPathArray}
- * Path to be used in a handle
- */
- H.Renderer.prototype.symbols['navigator-handle'] = function (x, y, w, h, options) {
- var halfWidth = (options && options.width || 0) / 2, markerPosition = Math.round(halfWidth / 3) + 0.5, height = options && options.height || 0;
- return [
- ['M', -halfWidth - 1, 0.5],
- ['L', halfWidth, 0.5],
- ['L', halfWidth, height + 0.5],
- ['L', -halfWidth - 1, height + 0.5],
- ['L', -halfWidth - 1, 0.5],
- ['M', -markerPosition, 4],
- ['L', -markerPosition, height - 3],
- ['M', markerPosition - 1, 4],
- ['L', markerPosition - 1, height - 3]
- ];
- };
- /**
- * The Navigator class
- *
- * @private
- * @class
- * @name Highcharts.Navigator
- *
- * @param {Highcharts.Chart} chart
- * Chart object
- */
- var Navigator = /** @class */ (function () {
- function Navigator(chart) {
- this.baseSeries = void 0;
- this.chart = void 0;
- this.handles = void 0;
- this.height = void 0;
- this.left = void 0;
- this.navigatorEnabled = void 0;
- this.navigatorGroup = void 0;
- this.navigatorOptions = void 0;
- this.navigatorSeries = void 0;
- this.navigatorSize = void 0;
- this.opposite = void 0;
- this.outline = void 0;
- this.outlineHeight = void 0;
- this.range = void 0;
- this.rendered = void 0;
- this.shades = void 0;
- this.size = void 0;
- this.top = void 0;
- this.xAxis = void 0;
- this.yAxis = void 0;
- this.zoomedMax = void 0;
- this.zoomedMin = void 0;
- this.init(chart);
- }
- /**
- * Draw one of the handles on the side of the zoomed range in the navigator
- *
- * @private
- * @function Highcharts.Navigator#drawHandle
- *
- * @param {number} x
- * The x center for the handle
- *
- * @param {number} index
- * 0 for left and 1 for right
- *
- * @param {boolean|undefined} inverted
- * flag for chart.inverted
- *
- * @param {string} verb
- * use 'animate' or 'attr'
- */
- Navigator.prototype.drawHandle = function (x, index, inverted, verb) {
- var navigator = this, height = navigator.navigatorOptions.handles.height;
- // Place it
- navigator.handles[index][verb](inverted ? {
- translateX: Math.round(navigator.left + navigator.height / 2),
- translateY: Math.round(navigator.top + parseInt(x, 10) + 0.5 - height)
- } : {
- translateX: Math.round(navigator.left + parseInt(x, 10)),
- translateY: Math.round(navigator.top + navigator.height / 2 - height / 2 - 1)
- });
- };
- /**
- * Render outline around the zoomed range
- *
- * @private
- * @function Highcharts.Navigator#drawOutline
- *
- * @param {number} zoomedMin
- * in pixels position where zoomed range starts
- *
- * @param {number} zoomedMax
- * in pixels position where zoomed range ends
- *
- * @param {boolean|undefined} inverted
- * flag if chart is inverted
- *
- * @param {string} verb
- * use 'animate' or 'attr'
- */
- Navigator.prototype.drawOutline = function (zoomedMin, zoomedMax, inverted, verb) {
- var navigator = this, maskInside = navigator.navigatorOptions.maskInside, outlineWidth = navigator.outline.strokeWidth(), halfOutline = outlineWidth / 2, outlineCorrection = (outlineWidth % 2) / 2, // #5800
- outlineHeight = navigator.outlineHeight, scrollbarHeight = navigator.scrollbarHeight || 0, navigatorSize = navigator.size, left = navigator.left - scrollbarHeight, navigatorTop = navigator.top, verticalMin, path;
- if (inverted) {
- left -= halfOutline;
- verticalMin = navigatorTop + zoomedMax + outlineCorrection;
- zoomedMax = navigatorTop + zoomedMin + outlineCorrection;
- path = [
- ['M', left + outlineHeight, navigatorTop - scrollbarHeight - outlineCorrection],
- ['L', left + outlineHeight, verticalMin],
- ['L', left, verticalMin],
- ['L', left, zoomedMax],
- ['L', left + outlineHeight, zoomedMax],
- ['L', left + outlineHeight, navigatorTop + navigatorSize + scrollbarHeight]
- ];
- if (maskInside) {
- path.push(['M', left + outlineHeight, verticalMin - halfOutline], // upper left of zoomed range
- ['L', left + outlineHeight, zoomedMax + halfOutline] // upper right of z.r.
- );
- }
- }
- else {
- zoomedMin += left + scrollbarHeight - outlineCorrection;
- zoomedMax += left + scrollbarHeight - outlineCorrection;
- navigatorTop += halfOutline;
- path = [
- ['M', left, navigatorTop],
- ['L', zoomedMin, navigatorTop],
- ['L', zoomedMin, navigatorTop + outlineHeight],
- ['L', zoomedMax, navigatorTop + outlineHeight],
- ['L', zoomedMax, navigatorTop],
- ['L', left + navigatorSize + scrollbarHeight * 2, navigatorTop] // right
- ];
- if (maskInside) {
- path.push(['M', zoomedMin - halfOutline, navigatorTop], // upper left of zoomed range
- ['L', zoomedMax + halfOutline, navigatorTop] // upper right of z.r.
- );
- }
- }
- navigator.outline[verb]({
- d: path
- });
- };
- /**
- * Render outline around the zoomed range
- *
- * @private
- * @function Highcharts.Navigator#drawMasks
- *
- * @param {number} zoomedMin
- * in pixels position where zoomed range starts
- *
- * @param {number} zoomedMax
- * in pixels position where zoomed range ends
- *
- * @param {boolean|undefined} inverted
- * flag if chart is inverted
- *
- * @param {string} verb
- * use 'animate' or 'attr'
- */
- Navigator.prototype.drawMasks = function (zoomedMin, zoomedMax, inverted, verb) {
- var navigator = this, left = navigator.left, top = navigator.top, navigatorHeight = navigator.height, height, width, x, y;
- // Determine rectangle position & size
- // According to (non)inverted position:
- if (inverted) {
- x = [left, left, left];
- y = [top, top + zoomedMin, top + zoomedMax];
- width = [navigatorHeight, navigatorHeight, navigatorHeight];
- height = [
- zoomedMin,
- zoomedMax - zoomedMin,
- navigator.size - zoomedMax
- ];
- }
- else {
- x = [left, left + zoomedMin, left + zoomedMax];
- y = [top, top, top];
- width = [
- zoomedMin,
- zoomedMax - zoomedMin,
- navigator.size - zoomedMax
- ];
- height = [navigatorHeight, navigatorHeight, navigatorHeight];
- }
- navigator.shades.forEach(function (shade, i) {
- shade[verb]({
- x: x[i],
- y: y[i],
- width: width[i],
- height: height[i]
- });
- });
- };
- /**
- * Generate DOM elements for a navigator:
- *
- * - main navigator group
- *
- * - all shades
- *
- * - outline
- *
- * - handles
- *
- * @private
- * @function Highcharts.Navigator#renderElements
- */
- Navigator.prototype.renderElements = function () {
- var navigator = this, navigatorOptions = navigator.navigatorOptions, maskInside = navigatorOptions.maskInside, chart = navigator.chart, inverted = chart.inverted, renderer = chart.renderer, navigatorGroup, mouseCursor = {
- cursor: inverted ? 'ns-resize' : 'ew-resize'
- };
- // Create the main navigator group
- navigator.navigatorGroup = navigatorGroup = renderer.g('navigator')
- .attr({
- zIndex: 8,
- visibility: 'hidden'
- })
- .add();
- // Create masks, each mask will get events and fill:
- [
- !maskInside,
- maskInside,
- !maskInside
- ].forEach(function (hasMask, index) {
- navigator.shades[index] = renderer.rect()
- .addClass('highcharts-navigator-mask' +
- (index === 1 ? '-inside' : '-outside'))
- .add(navigatorGroup);
- if (!chart.styledMode) {
- navigator.shades[index]
- .attr({
- fill: hasMask ?
- navigatorOptions.maskFill :
- 'rgba(0,0,0,0)'
- })
- .css((index === 1) && mouseCursor);
- }
- });
- // Create the outline:
- navigator.outline = renderer.path()
- .addClass('highcharts-navigator-outline')
- .add(navigatorGroup);
- if (!chart.styledMode) {
- navigator.outline.attr({
- 'stroke-width': navigatorOptions.outlineWidth,
- stroke: navigatorOptions.outlineColor
- });
- }
- // Create the handlers:
- if (navigatorOptions.handles.enabled) {
- [0, 1].forEach(function (index) {
- navigatorOptions.handles.inverted = chart.inverted;
- navigator.handles[index] = renderer.symbol(navigatorOptions.handles.symbols[index], -navigatorOptions.handles.width / 2 - 1, 0, navigatorOptions.handles.width, navigatorOptions.handles.height, navigatorOptions.handles);
- // zIndex = 6 for right handle, 7 for left.
- // Can't be 10, because of the tooltip in inverted chart #2908
- navigator.handles[index].attr({ zIndex: 7 - index })
- .addClass('highcharts-navigator-handle ' +
- 'highcharts-navigator-handle-' +
- ['left', 'right'][index]).add(navigatorGroup);
- if (!chart.styledMode) {
- var handlesOptions = navigatorOptions.handles;
- navigator.handles[index]
- .attr({
- fill: handlesOptions.backgroundColor,
- stroke: handlesOptions.borderColor,
- 'stroke-width': handlesOptions.lineWidth
- })
- .css(mouseCursor);
- }
- });
- }
- };
- /**
- * Update navigator
- *
- * @private
- * @function Highcharts.Navigator#update
- *
- * @param {Highcharts.NavigatorOptions} options
- * Options to merge in when updating navigator
- */
- Navigator.prototype.update = function (options) {
- // Remove references to old navigator series in base series
- (this.series || []).forEach(function (series) {
- if (series.baseSeries) {
- delete series.baseSeries.navigatorSeries;
- }
- });
- // Destroy and rebuild navigator
- this.destroy();
- var chartOptions = this.chart.options;
- merge(true, chartOptions.navigator, this.options, options);
- this.init(this.chart);
- };
- /**
- * Render the navigator
- *
- * @private
- * @function Highcharts.Navigator#render
- * @param {number} min
- * X axis value minimum
- * @param {number} max
- * X axis value maximum
- * @param {number} [pxMin]
- * Pixel value minimum
- * @param {number} [pxMax]
- * Pixel value maximum
- * @return {void}
- */
- Navigator.prototype.render = function (min, max, pxMin, pxMax) {
- var navigator = this, chart = navigator.chart, navigatorWidth, scrollbarLeft, scrollbarTop, scrollbarHeight = navigator.scrollbarHeight, navigatorSize, xAxis = navigator.xAxis, pointRange = xAxis.pointRange || 0, scrollbarXAxis = xAxis.navigatorAxis.fake ? chart.xAxis[0] : xAxis, navigatorEnabled = navigator.navigatorEnabled, zoomedMin, zoomedMax, rendered = navigator.rendered, inverted = chart.inverted, verb, newMin, newMax, currentRange, minRange = chart.xAxis[0].minRange, maxRange = chart.xAxis[0].options.maxRange;
- // Don't redraw while moving the handles (#4703).
- if (this.hasDragged && !defined(pxMin)) {
- return;
- }
- min = correctFloat(min - pointRange / 2);
- max = correctFloat(max + pointRange / 2);
- // Don't render the navigator until we have data (#486, #4202, #5172).
- if (!isNumber(min) || !isNumber(max)) {
- // However, if navigator was already rendered, we may need to resize
- // it. For example hidden series, but visible navigator (#6022).
- if (rendered) {
- pxMin = 0;
- pxMax = pick(xAxis.width, scrollbarXAxis.width);
- }
- else {
- return;
- }
- }
- navigator.left = pick(xAxis.left,
- // in case of scrollbar only, without navigator
- chart.plotLeft + scrollbarHeight +
- (inverted ? chart.plotWidth : 0));
- navigator.size = zoomedMax = navigatorSize = pick(xAxis.len, (inverted ? chart.plotHeight : chart.plotWidth) -
- 2 * scrollbarHeight);
- if (inverted) {
- navigatorWidth = scrollbarHeight;
- }
- else {
- navigatorWidth = navigatorSize + 2 * scrollbarHeight;
- }
- // Get the pixel position of the handles
- pxMin = pick(pxMin, xAxis.toPixels(min, true));
- pxMax = pick(pxMax, xAxis.toPixels(max, true));
- // Verify (#1851, #2238)
- if (!isNumber(pxMin) || Math.abs(pxMin) === Infinity) {
- pxMin = 0;
- pxMax = navigatorWidth;
- }
- // Are we below the minRange? (#2618, #6191)
- newMin = xAxis.toValue(pxMin, true);
- newMax = xAxis.toValue(pxMax, true);
- currentRange = Math.abs(correctFloat(newMax - newMin));
- if (currentRange < minRange) {
- if (this.grabbedLeft) {
- pxMin = xAxis.toPixels(newMax - minRange - pointRange, true);
- }
- else if (this.grabbedRight) {
- pxMax = xAxis.toPixels(newMin + minRange + pointRange, true);
- }
- }
- else if (defined(maxRange) &&
- correctFloat(currentRange - pointRange) > maxRange) {
- if (this.grabbedLeft) {
- pxMin = xAxis.toPixels(newMax - maxRange - pointRange, true);
- }
- else if (this.grabbedRight) {
- pxMax = xAxis.toPixels(newMin + maxRange + pointRange, true);
- }
- }
- // Handles are allowed to cross, but never exceed the plot area
- navigator.zoomedMax = clamp(Math.max(pxMin, pxMax), 0, zoomedMax);
- navigator.zoomedMin = clamp(navigator.fixedWidth ?
- navigator.zoomedMax - navigator.fixedWidth :
- Math.min(pxMin, pxMax), 0, zoomedMax);
- navigator.range = navigator.zoomedMax - navigator.zoomedMin;
- zoomedMax = Math.round(navigator.zoomedMax);
- zoomedMin = Math.round(navigator.zoomedMin);
- if (navigatorEnabled) {
- navigator.navigatorGroup.attr({
- visibility: 'visible'
- });
- // Place elements
- verb = rendered && !navigator.hasDragged ? 'animate' : 'attr';
- navigator.drawMasks(zoomedMin, zoomedMax, inverted, verb);
- navigator.drawOutline(zoomedMin, zoomedMax, inverted, verb);
- if (navigator.navigatorOptions.handles.enabled) {
- navigator.drawHandle(zoomedMin, 0, inverted, verb);
- navigator.drawHandle(zoomedMax, 1, inverted, verb);
- }
- }
- if (navigator.scrollbar) {
- if (inverted) {
- scrollbarTop = navigator.top - scrollbarHeight;
- scrollbarLeft = navigator.left - scrollbarHeight +
- (navigatorEnabled || !scrollbarXAxis.opposite ? 0 :
- // Multiple axes has offsets:
- (scrollbarXAxis.titleOffset || 0) +
- // Self margin from the axis.title
- scrollbarXAxis.axisTitleMargin);
- scrollbarHeight = navigatorSize + 2 * scrollbarHeight;
- }
- else {
- scrollbarTop = navigator.top + (navigatorEnabled ?
- navigator.height :
- -scrollbarHeight);
- scrollbarLeft = navigator.left - scrollbarHeight;
- }
- // Reposition scrollbar
- navigator.scrollbar.position(scrollbarLeft, scrollbarTop, navigatorWidth, scrollbarHeight);
- // Keep scale 0-1
- navigator.scrollbar.setRange(
- // Use real value, not rounded because range can be very small
- // (#1716)
- navigator.zoomedMin / (navigatorSize || 1), navigator.zoomedMax / (navigatorSize || 1));
- }
- navigator.rendered = true;
- };
- /**
- * Set up the mouse and touch events for the navigator
- *
- * @private
- * @function Highcharts.Navigator#addMouseEvents
- */
- Navigator.prototype.addMouseEvents = function () {
- var navigator = this, chart = navigator.chart, container = chart.container, eventsToUnbind = [], mouseMoveHandler, mouseUpHandler;
- /**
- * Create mouse events' handlers.
- * Make them as separate functions to enable wrapping them:
- */
- navigator.mouseMoveHandler = mouseMoveHandler = function (e) {
- navigator.onMouseMove(e);
- };
- navigator.mouseUpHandler = mouseUpHandler = function (e) {
- navigator.onMouseUp(e);
- };
- // Add shades and handles mousedown events
- eventsToUnbind = navigator.getPartsEvents('mousedown');
- // Add mouse move and mouseup events. These are bind to doc/container,
- // because Navigator.grabbedSomething flags are stored in mousedown
- // events
- eventsToUnbind.push(addEvent(chart.renderTo, 'mousemove', mouseMoveHandler), addEvent(container.ownerDocument, 'mouseup', mouseUpHandler));
- // Touch events
- if (hasTouch) {
- eventsToUnbind.push(addEvent(chart.renderTo, 'touchmove', mouseMoveHandler), addEvent(container.ownerDocument, 'touchend', mouseUpHandler));
- eventsToUnbind.concat(navigator.getPartsEvents('touchstart'));
- }
- navigator.eventsToUnbind = eventsToUnbind;
- // Data events
- if (navigator.series && navigator.series[0]) {
- eventsToUnbind.push(addEvent(navigator.series[0].xAxis, 'foundExtremes', function () {
- chart.navigator.modifyNavigatorAxisExtremes();
- }));
- }
- };
- /**
- * Generate events for handles and masks
- *
- * @private
- * @function Highcharts.Navigator#getPartsEvents
- *
- * @param {string} eventName
- * Event name handler, 'mousedown' or 'touchstart'
- *
- * @return {Array<Function>}
- * An array of functions to remove navigator functions from the
- * events again.
- */
- Navigator.prototype.getPartsEvents = function (eventName) {
- var navigator = this, events = [];
- ['shades', 'handles'].forEach(function (name) {
- navigator[name].forEach(function (navigatorItem, index) {
- events.push(addEvent(navigatorItem.element, eventName, function (e) {
- navigator[name + 'Mousedown'](e, index);
- }));
- });
- });
- return events;
- };
- /**
- * Mousedown on a shaded mask, either:
- *
- * - will be stored for future drag&drop
- *
- * - will directly shift to a new range
- *
- * @private
- * @function Highcharts.Navigator#shadesMousedown
- *
- * @param {Highcharts.PointerEventObject} e
- * Mouse event
- *
- * @param {number} index
- * Index of a mask in Navigator.shades array
- */
- Navigator.prototype.shadesMousedown = function (e, index) {
- e = this.chart.pointer.normalize(e);
- var navigator = this, chart = navigator.chart, xAxis = navigator.xAxis, zoomedMin = navigator.zoomedMin, navigatorPosition = navigator.left, navigatorSize = navigator.size, range = navigator.range, chartX = e.chartX, fixedMax, fixedMin, ext, left;
- // For inverted chart, swap some options:
- if (chart.inverted) {
- chartX = e.chartY;
- navigatorPosition = navigator.top;
- }
- if (index === 1) {
- // Store information for drag&drop
- navigator.grabbedCenter = chartX;
- navigator.fixedWidth = range;
- navigator.dragOffset = chartX - zoomedMin;
- }
- else {
- // Shift the range by clicking on shaded areas
- left = chartX - navigatorPosition - range / 2;
- if (index === 0) {
- left = Math.max(0, left);
- }
- else if (index === 2 && left + range >= navigatorSize) {
- left = navigatorSize - range;
- if (navigator.reversedExtremes) {
- // #7713
- left -= range;
- fixedMin = navigator.getUnionExtremes().dataMin;
- }
- else {
- // #2293, #3543
- fixedMax = navigator.getUnionExtremes().dataMax;
- }
- }
- if (left !== zoomedMin) { // it has actually moved
- navigator.fixedWidth = range; // #1370
- ext = xAxis.navigatorAxis.toFixedRange(left, left + range, fixedMin, fixedMax);
- if (defined(ext.min)) { // #7411
- chart.xAxis[0].setExtremes(Math.min(ext.min, ext.max), Math.max(ext.min, ext.max), true, null, // auto animation
- { trigger: 'navigator' });
- }
- }
- }
- };
- /**
- * Mousedown on a handle mask.
- * Will store necessary information for drag&drop.
- *
- * @private
- * @function Highcharts.Navigator#handlesMousedown
- * @param {Highcharts.PointerEventObject} e
- * Mouse event
- * @param {number} index
- * Index of a handle in Navigator.handles array
- * @return {void}
- */
- Navigator.prototype.handlesMousedown = function (e, index) {
- e = this.chart.pointer.normalize(e);
- var navigator = this, chart = navigator.chart, baseXAxis = chart.xAxis[0],
- // For reversed axes, min and max are changed,
- // so the other extreme should be stored
- reverse = navigator.reversedExtremes;
- if (index === 0) {
- // Grab the left handle
- navigator.grabbedLeft = true;
- navigator.otherHandlePos = navigator.zoomedMax;
- navigator.fixedExtreme = reverse ? baseXAxis.min : baseXAxis.max;
- }
- else {
- // Grab the right handle
- navigator.grabbedRight = true;
- navigator.otherHandlePos = navigator.zoomedMin;
- navigator.fixedExtreme = reverse ? baseXAxis.max : baseXAxis.min;
- }
- chart.fixedRange = null;
- };
- /**
- * Mouse move event based on x/y mouse position.
- *
- * @private
- * @function Highcharts.Navigator#onMouseMove
- *
- * @param {Highcharts.PointerEventObject} e
- * Mouse event
- */
- Navigator.prototype.onMouseMove = function (e) {
- var navigator = this, chart = navigator.chart, left = navigator.left, navigatorSize = navigator.navigatorSize, range = navigator.range, dragOffset = navigator.dragOffset, inverted = chart.inverted, chartX;
- // In iOS, a mousemove event with e.pageX === 0 is fired when holding
- // the finger down in the center of the scrollbar. This should be
- // ignored.
- if (!e.touches || e.touches[0].pageX !== 0) { // #4696
- e = chart.pointer.normalize(e);
- chartX = e.chartX;
- // Swap some options for inverted chart
- if (inverted) {
- left = navigator.top;
- chartX = e.chartY;
- }
- // Drag left handle or top handle
- if (navigator.grabbedLeft) {
- navigator.hasDragged = true;
- navigator.render(0, 0, chartX - left, navigator.otherHandlePos);
- // Drag right handle or bottom handle
- }
- else if (navigator.grabbedRight) {
- navigator.hasDragged = true;
- navigator.render(0, 0, navigator.otherHandlePos, chartX - left);
- // Drag scrollbar or open area in navigator
- }
- else if (navigator.grabbedCenter) {
- navigator.hasDragged = true;
- if (chartX < dragOffset) { // outside left
- chartX = dragOffset;
- // outside right
- }
- else if (chartX >
- navigatorSize + dragOffset - range) {
- chartX = navigatorSize + dragOffset - range;
- }
- navigator.render(0, 0, chartX - dragOffset, chartX - dragOffset + range);
- }
- if (navigator.hasDragged &&
- navigator.scrollbar &&
- pick(navigator.scrollbar.options.liveRedraw,
- // By default, don't run live redraw on VML, on touch
- // devices or if the chart is in boost.
- H.svg && !isTouchDevice && !this.chart.isBoosting)) {
- e.DOMType = e.type; // DOMType is for IE8
- setTimeout(function () {
- navigator.onMouseUp(e);
- }, 0);
- }
- }
- };
- /**
- * Mouse up event based on x/y mouse position.
- *
- * @private
- * @function Highcharts.Navigator#onMouseUp
- * @param {Highcharts.PointerEventObject} e
- * Mouse event
- * @return {void}
- */
- Navigator.prototype.onMouseUp = function (e) {
- var navigator = this, chart = navigator.chart, xAxis = navigator.xAxis, scrollbar = navigator.scrollbar, DOMEvent = e.DOMEvent || e, inverted = chart.inverted, verb = navigator.rendered && !navigator.hasDragged ?
- 'animate' : 'attr', zoomedMax = Math.round(navigator.zoomedMax), zoomedMin = Math.round(navigator.zoomedMin), unionExtremes, fixedMin, fixedMax, ext;
- if (
- // MouseUp is called for both, navigator and scrollbar (that order),
- // which causes calling afterSetExtremes twice. Prevent first call
- // by checking if scrollbar is going to set new extremes (#6334)
- (navigator.hasDragged && (!scrollbar || !scrollbar.hasDragged)) ||
- e.trigger === 'scrollbar') {
- unionExtremes = navigator.getUnionExtremes();
- // When dragging one handle, make sure the other one doesn't change
- if (navigator.zoomedMin === navigator.otherHandlePos) {
- fixedMin = navigator.fixedExtreme;
- }
- else if (navigator.zoomedMax === navigator.otherHandlePos) {
- fixedMax = navigator.fixedExtreme;
- }
- // Snap to right edge (#4076)
- if (navigator.zoomedMax === navigator.size) {
- fixedMax = navigator.reversedExtremes ?
- unionExtremes.dataMin :
- unionExtremes.dataMax;
- }
- // Snap to left edge (#7576)
- if (navigator.zoomedMin === 0) {
- fixedMin = navigator.reversedExtremes ?
- unionExtremes.dataMax :
- unionExtremes.dataMin;
- }
- ext = xAxis.navigatorAxis.toFixedRange(navigator.zoomedMin, navigator.zoomedMax, fixedMin, fixedMax);
- if (defined(ext.min)) {
- chart.xAxis[0].setExtremes(Math.min(ext.min, ext.max), Math.max(ext.min, ext.max), true,
- // Run animation when clicking buttons, scrollbar track etc,
- // but not when dragging handles or scrollbar
- navigator.hasDragged ? false : null, {
- trigger: 'navigator',
- triggerOp: 'navigator-drag',
- DOMEvent: DOMEvent // #1838
- });
- }
- }
- if (e.DOMType !== 'mousemove' &&
- e.DOMType !== 'touchmove') {
- navigator.grabbedLeft = navigator.grabbedRight =
- navigator.grabbedCenter = navigator.fixedWidth =
- navigator.fixedExtreme = navigator.otherHandlePos =
- navigator.hasDragged = navigator.dragOffset = null;
- }
- // Update position of navigator shades, outline and handles (#12573)
- if (navigator.navigatorEnabled) {
- if (navigator.shades) {
- navigator.drawMasks(zoomedMin, zoomedMax, inverted, verb);
- }
- if (navigator.outline) {
- navigator.drawOutline(zoomedMin, zoomedMax, inverted, verb);
- }
- if (navigator.navigatorOptions.handles.enabled &&
- Object.keys(navigator.handles).length ===
- navigator.handles.length) {
- navigator.drawHandle(zoomedMin, 0, inverted, verb);
- navigator.drawHandle(zoomedMax, 1, inverted, verb);
- }
- }
- };
- /**
- * Removes the event handlers attached previously with addEvents.
- *
- * @private
- * @function Highcharts.Navigator#removeEvents
- * @return {void}
- */
- Navigator.prototype.removeEvents = function () {
- if (this.eventsToUnbind) {
- this.eventsToUnbind.forEach(function (unbind) {
- unbind();
- });
- this.eventsToUnbind = void 0;
- }
- this.removeBaseSeriesEvents();
- };
- /**
- * Remove data events.
- *
- * @private
- * @function Highcharts.Navigator#removeBaseSeriesEvents
- * @return {void}
- */
- Navigator.prototype.removeBaseSeriesEvents = function () {
- var baseSeries = this.baseSeries || [];
- if (this.navigatorEnabled && baseSeries[0]) {
- if (this.navigatorOptions.adaptToUpdatedData !== false) {
- baseSeries.forEach(function (series) {
- removeEvent(series, 'updatedData', this.updatedDataHandler);
- }, this);
- }
- // We only listen for extremes-events on the first baseSeries
- if (baseSeries[0].xAxis) {
- removeEvent(baseSeries[0].xAxis, 'foundExtremes', this.modifyBaseAxisExtremes);
- }
- }
- };
- /**
- * Initialize the Navigator object
- *
- * @private
- * @function Highcharts.Navigator#init
- *
- * @param {Highcharts.Chart} chart
- */
- Navigator.prototype.init = function (chart) {
- var chartOptions = chart.options, navigatorOptions = chartOptions.navigator, navigatorEnabled = navigatorOptions.enabled, scrollbarOptions = chartOptions.scrollbar, scrollbarEnabled = scrollbarOptions.enabled, height = navigatorEnabled ? navigatorOptions.height : 0, scrollbarHeight = scrollbarEnabled ?
- scrollbarOptions.height :
- 0;
- this.handles = [];
- this.shades = [];
- this.chart = chart;
- this.setBaseSeries();
- this.height = height;
- this.scrollbarHeight = scrollbarHeight;
- this.scrollbarEnabled = scrollbarEnabled;
- this.navigatorEnabled = navigatorEnabled;
- this.navigatorOptions = navigatorOptions;
- this.scrollbarOptions = scrollbarOptions;
- this.outlineHeight = height + scrollbarHeight;
- this.opposite = pick(navigatorOptions.opposite, Boolean(!navigatorEnabled && chart.inverted)); // #6262
- var navigator = this, baseSeries = navigator.baseSeries, xAxisIndex = chart.xAxis.length, yAxisIndex = chart.yAxis.length, baseXaxis = baseSeries && baseSeries[0] && baseSeries[0].xAxis ||
- chart.xAxis[0] || { options: {} };
- chart.isDirtyBox = true;
- if (navigator.navigatorEnabled) {
- // an x axis is required for scrollbar also
- navigator.xAxis = new Axis(chart, merge({
- // inherit base xAxis' break and ordinal options
- breaks: baseXaxis.options.breaks,
- ordinal: baseXaxis.options.ordinal
- }, navigatorOptions.xAxis, {
- id: 'navigator-x-axis',
- yAxis: 'navigator-y-axis',
- isX: true,
- type: 'datetime',
- index: xAxisIndex,
- isInternal: true,
- offset: 0,
- keepOrdinalPadding: true,
- startOnTick: false,
- endOnTick: false,
- minPadding: 0,
- maxPadding: 0,
- zoomEnabled: false
- }, chart.inverted ? {
- offsets: [scrollbarHeight, 0, -scrollbarHeight, 0],
- width: height
- } : {
- offsets: [0, -scrollbarHeight, 0, scrollbarHeight],
- height: height
- }));
- navigator.yAxis = new Axis(chart, merge(navigatorOptions.yAxis, {
- id: 'navigator-y-axis',
- alignTicks: false,
- offset: 0,
- index: yAxisIndex,
- isInternal: true,
- zoomEnabled: false
- }, chart.inverted ? {
- width: height
- } : {
- height: height
- }));
- // If we have a base series, initialize the navigator series
- if (baseSeries || navigatorOptions.series.data) {
- navigator.updateNavigatorSeries(false);
- // If not, set up an event to listen for added series
- }
- else if (chart.series.length === 0) {
- navigator.unbindRedraw = addEvent(chart, 'beforeRedraw', function () {
- // We've got one, now add it as base
- if (chart.series.length > 0 && !navigator.series) {
- navigator.setBaseSeries();
- navigator.unbindRedraw(); // reset
- }
- });
- }
- navigator.reversedExtremes = (chart.inverted && !navigator.xAxis.reversed) || (!chart.inverted && navigator.xAxis.reversed);
- // Render items, so we can bind events to them:
- navigator.renderElements();
- // Add mouse events
- navigator.addMouseEvents();
- // in case of scrollbar only, fake an x axis to get translation
- }
- else {
- navigator.xAxis = {
- chart: chart,
- navigatorAxis: {
- fake: true
- },
- translate: function (value, reverse) {
- var axis = chart.xAxis[0], ext = axis.getExtremes(), scrollTrackWidth = axis.len - 2 * scrollbarHeight, min = numExt('min', axis.options.min, ext.dataMin), valueRange = numExt('max', axis.options.max, ext.dataMax) - min;
- return reverse ?
- // from pixel to value
- (value * valueRange / scrollTrackWidth) + min :
- // from value to pixel
- scrollTrackWidth * (value - min) / valueRange;
- },
- toPixels: function (value) {
- return this.translate(value);
- },
- toValue: function (value) {
- return this.translate(value, true);
- }
- };
- navigator.xAxis.navigatorAxis.axis = navigator.xAxis;
- navigator.xAxis.navigatorAxis.toFixedRange = (NavigatorAxis.AdditionsClass.prototype.toFixedRange.bind(navigator.xAxis.navigatorAxis));
- }
- // Initialize the scrollbar
- if (chart.options.scrollbar.enabled) {
- chart.scrollbar = navigator.scrollbar = new Scrollbar(chart.renderer, merge(chart.options.scrollbar, {
- margin: navigator.navigatorEnabled ? 0 : 10,
- vertical: chart.inverted
- }), chart);
- addEvent(navigator.scrollbar, 'changed', function (e) {
- var range = navigator.size, to = range * this.to, from = range * this.from;
- navigator.hasDragged = navigator.scrollbar.hasDragged;
- navigator.render(0, 0, from, to);
- if (chart.options.scrollbar.liveRedraw ||
- (e.DOMType !== 'mousemove' &&
- e.DOMType !== 'touchmove')) {
- setTimeout(function () {
- navigator.onMouseUp(e);
- });
- }
- });
- }
- // Add data events
- navigator.addBaseSeriesEvents();
- // Add redraw events
- navigator.addChartEvents();
- };
- /**
- * Get the union data extremes of the chart - the outer data extremes of the
- * base X axis and the navigator axis.
- *
- * @private
- * @function Highcharts.Navigator#getUnionExtremes
- * @param {boolean} [returnFalseOnNoBaseSeries]
- * as the param says.
- * @return {Highcharts.Dictionary<(number|undefined)>|undefined}
- */
- Navigator.prototype.getUnionExtremes = function (returnFalseOnNoBaseSeries) {
- var baseAxis = this.chart.xAxis[0], navAxis = this.xAxis, navAxisOptions = navAxis.options, baseAxisOptions = baseAxis.options, ret;
- if (!returnFalseOnNoBaseSeries || baseAxis.dataMin !== null) {
- ret = {
- dataMin: pick(// #4053
- navAxisOptions && navAxisOptions.min, numExt('min', baseAxisOptions.min, baseAxis.dataMin, navAxis.dataMin, navAxis.min)),
- dataMax: pick(navAxisOptions && navAxisOptions.max, numExt('max', baseAxisOptions.max, baseAxis.dataMax, navAxis.dataMax, navAxis.max))
- };
- }
- return ret;
- };
- /**
- * Set the base series and update the navigator series from this. With a bit
- * of modification we should be able to make this an API method to be called
- * from the outside
- *
- * @private
- * @function Highcharts.Navigator#setBaseSeries
- * @param {Highcharts.SeriesOptionsType} [baseSeriesOptions]
- * Additional series options for a navigator
- * @param {boolean} [redraw]
- * Whether to redraw after update.
- * @return {void}
- */
- Navigator.prototype.setBaseSeries = function (baseSeriesOptions, redraw) {
- var chart = this.chart, baseSeries = this.baseSeries = [];
- baseSeriesOptions = (baseSeriesOptions ||
- chart.options && chart.options.navigator.baseSeries ||
- (chart.series.length ?
- // Find the first non-navigator series (#8430)
- find(chart.series, function (s) {
- return !s.options.isInternal;
- }).index :
- 0));
- // Iterate through series and add the ones that should be shown in
- // navigator.
- (chart.series || []).forEach(function (series, i) {
- if (
- // Don't include existing nav series
- !series.options.isInternal &&
- (series.options.showInNavigator ||
- (i === baseSeriesOptions ||
- series.options.id === baseSeriesOptions) &&
- series.options.showInNavigator !== false)) {
- baseSeries.push(series);
- }
- });
- // When run after render, this.xAxis already exists
- if (this.xAxis && !this.xAxis.navigatorAxis.fake) {
- this.updateNavigatorSeries(true, redraw);
- }
- };
- /**
- * Update series in the navigator from baseSeries, adding new if does not
- * exist.
- *
- * @private
- * @function Highcharts.Navigator.updateNavigatorSeries
- * @param {boolean} addEvents
- * @param {boolean} [redraw]
- * @return {void}
- */
- Navigator.prototype.updateNavigatorSeries = function (addEvents, redraw) {
- var navigator = this, chart = navigator.chart, baseSeries = navigator.baseSeries, baseOptions, mergedNavSeriesOptions, chartNavigatorSeriesOptions = navigator.navigatorOptions.series, baseNavigatorOptions, navSeriesMixin = {
- enableMouseTracking: false,
- index: null,
- linkedTo: null,
- group: 'nav',
- padXAxis: false,
- xAxis: 'navigator-x-axis',
- yAxis: 'navigator-y-axis',
- showInLegend: false,
- stacking: void 0,
- isInternal: true,
- states: {
- inactive: {
- opacity: 1
- }
- }
- },
- // Remove navigator series that are no longer in the baseSeries
- navigatorSeries = navigator.series =
- (navigator.series || []).filter(function (navSeries) {
- var base = navSeries.baseSeries;
- if (baseSeries.indexOf(base) < 0) { // Not in array
- // If there is still a base series connected to this
- // series, remove event handler and reference.
- if (base) {
- removeEvent(base, 'updatedData', navigator.updatedDataHandler);
- delete base.navigatorSeries;
- }
- // Kill the nav series. It may already have been
- // destroyed (#8715).
- if (navSeries.chart) {
- navSeries.destroy();
- }
- return false;
- }
- return true;
- });
- // Go through each base series and merge the options to create new
- // series
- if (baseSeries && baseSeries.length) {
- baseSeries.forEach(function eachBaseSeries(base) {
- var linkedNavSeries = base.navigatorSeries, userNavOptions = extend(
- // Grab color and visibility from base as default
- {
- color: base.color,
- visible: base.visible
- }, !isArray(chartNavigatorSeriesOptions) ?
- chartNavigatorSeriesOptions :
- defaultOptions.navigator.series);
- // Don't update if the series exists in nav and we have disabled
- // adaptToUpdatedData.
- if (linkedNavSeries &&
- navigator.navigatorOptions.adaptToUpdatedData === false) {
- return;
- }
- navSeriesMixin.name = 'Navigator ' + baseSeries.length;
- baseOptions = base.options || {};
- baseNavigatorOptions = baseOptions.navigatorOptions || {};
- mergedNavSeriesOptions = merge(baseOptions, navSeriesMixin, userNavOptions, baseNavigatorOptions);
- // Once nav series type is resolved, pick correct pointRange
- mergedNavSeriesOptions.pointRange = pick(
- // Stricte set pointRange in options
- userNavOptions.pointRange, baseNavigatorOptions.pointRange,
- // Fallback to default values, e.g. `null` for column
- defaultOptions.plotOptions[mergedNavSeriesOptions.type || 'line'].pointRange);
- // Merge data separately. Do a slice to avoid mutating the
- // navigator options from base series (#4923).
- var navigatorSeriesData = baseNavigatorOptions.data || userNavOptions.data;
- navigator.hasNavigatorData =
- navigator.hasNavigatorData || !!navigatorSeriesData;
- mergedNavSeriesOptions.data =
- navigatorSeriesData ||
- baseOptions.data && baseOptions.data.slice(0);
- // Update or add the series
- if (linkedNavSeries && linkedNavSeries.options) {
- linkedNavSeries.update(mergedNavSeriesOptions, redraw);
- }
- else {
- base.navigatorSeries = chart.initSeries(mergedNavSeriesOptions);
- base.navigatorSeries.baseSeries = base; // Store ref
- navigatorSeries.push(base.navigatorSeries);
- }
- });
- }
- // If user has defined data (and no base series) or explicitly defined
- // navigator.series as an array, we create these series on top of any
- // base series.
- if (chartNavigatorSeriesOptions.data &&
- !(baseSeries && baseSeries.length) ||
- isArray(chartNavigatorSeriesOptions)) {
- navigator.hasNavigatorData = false;
- // Allow navigator.series to be an array
- chartNavigatorSeriesOptions =
- splat(chartNavigatorSeriesOptions);
- chartNavigatorSeriesOptions.forEach(function (userSeriesOptions, i) {
- navSeriesMixin.name =
- 'Navigator ' + (navigatorSeries.length + 1);
- mergedNavSeriesOptions = merge(defaultOptions.navigator.series, {
- // Since we don't have a base series to pull color from,
- // try to fake it by using color from series with same
- // index. Otherwise pull from the colors array. We need
- // an explicit color as otherwise updates will increment
- // color counter and we'll get a new color for each
- // update of the nav series.
- color: chart.series[i] &&
- !chart.series[i].options.isInternal &&
- chart.series[i].color ||
- chart.options.colors[i] ||
- chart.options.colors[0]
- }, navSeriesMixin, userSeriesOptions);
- mergedNavSeriesOptions.data = userSeriesOptions.data;
- if (mergedNavSeriesOptions.data) {
- navigator.hasNavigatorData = true;
- navigatorSeries.push(chart.initSeries(mergedNavSeriesOptions));
- }
- });
- }
- if (addEvents) {
- this.addBaseSeriesEvents();
- }
- };
- /**
- * Add data events.
- * For example when main series is updated we need to recalculate extremes
- *
- * @private
- * @function Highcharts.Navigator#addBaseSeriesEvent
- * @return {void}
- */
- Navigator.prototype.addBaseSeriesEvents = function () {
- var navigator = this, baseSeries = navigator.baseSeries || [];
- // Bind modified extremes event to first base's xAxis only.
- // In event of > 1 base-xAxes, the navigator will ignore those.
- // Adding this multiple times to the same axis is no problem, as
- // duplicates should be discarded by the browser.
- if (baseSeries[0] && baseSeries[0].xAxis) {
- addEvent(baseSeries[0].xAxis, 'foundExtremes', this.modifyBaseAxisExtremes);
- }
- baseSeries.forEach(function (base) {
- // Link base series show/hide to navigator series visibility
- addEvent(base, 'show', function () {
- if (this.navigatorSeries) {
- this.navigatorSeries.setVisible(true, false);
- }
- });
- addEvent(base, 'hide', function () {
- if (this.navigatorSeries) {
- this.navigatorSeries.setVisible(false, false);
- }
- });
- // Respond to updated data in the base series, unless explicitily
- // not adapting to data changes.
- if (this.navigatorOptions.adaptToUpdatedData !== false) {
- if (base.xAxis) {
- addEvent(base, 'updatedData', this.updatedDataHandler);
- }
- }
- // Handle series removal
- addEvent(base, 'remove', function () {
- if (this.navigatorSeries) {
- erase(navigator.series, this.navigatorSeries);
- if (defined(this.navigatorSeries.options)) {
- this.navigatorSeries.remove(false);
- }
- delete this.navigatorSeries;
- }
- });
- }, this);
- };
- /**
- * Get minimum from all base series connected to the navigator
- * @private
- * @param {number} currentSeriesMin
- * Minium from the current series
- * @return {number} Minimum from all series
- */
- Navigator.prototype.getBaseSeriesMin = function (currentSeriesMin) {
- return this.baseSeries.reduce(function (min, series) {
- // (#10193)
- return Math.min(min, series.xData ? series.xData[0] : min);
- }, currentSeriesMin);
- };
- /**
- * Set the navigator x axis extremes to reflect the total. The navigator
- * extremes should always be the extremes of the union of all series in the
- * chart as well as the navigator series.
- *
- * @private
- * @function Highcharts.Navigator#modifyNavigatorAxisExtremes
- */
- Navigator.prototype.modifyNavigatorAxisExtremes = function () {
- var xAxis = this.xAxis, unionExtremes;
- if (typeof xAxis.getExtremes !== 'undefined') {
- unionExtremes = this.getUnionExtremes(true);
- if (unionExtremes &&
- (unionExtremes.dataMin !== xAxis.min ||
- unionExtremes.dataMax !== xAxis.max)) {
- xAxis.min = unionExtremes.dataMin;
- xAxis.max = unionExtremes.dataMax;
- }
- }
- };
- /**
- * Hook to modify the base axis extremes with information from the Navigator
- *
- * @private
- * @function Highcharts.Navigator#modifyBaseAxisExtremes
- */
- Navigator.prototype.modifyBaseAxisExtremes = function () {
- var baseXAxis = this, navigator = baseXAxis.chart.navigator, baseExtremes = baseXAxis.getExtremes(), baseMin = baseExtremes.min, baseMax = baseExtremes.max, baseDataMin = baseExtremes.dataMin, baseDataMax = baseExtremes.dataMax, range = baseMax - baseMin, stickToMin = navigator.stickToMin, stickToMax = navigator.stickToMax, overscroll = pick(baseXAxis.options.overscroll, 0), newMax, newMin, navigatorSeries = navigator.series && navigator.series[0], hasSetExtremes = !!baseXAxis.setExtremes,
- // When the extremes have been set by range selector button, don't
- // stick to min or max. The range selector buttons will handle the
- // extremes. (#5489)
- unmutable = baseXAxis.eventArgs &&
- baseXAxis.eventArgs.trigger === 'rangeSelectorButton';
- if (!unmutable) {
- // If the zoomed range is already at the min, move it to the right
- // as new data comes in
- if (stickToMin) {
- newMin = baseDataMin;
- newMax = newMin + range;
- }
- // If the zoomed range is already at the max, move it to the right
- // as new data comes in
- if (stickToMax) {
- newMax = baseDataMax + overscroll;
- // If stickToMin is true, the new min value is set above
- if (!stickToMin) {
- newMin = Math.max(baseDataMin, // don't go below data extremes (#13184)
- newMax - range, navigator.getBaseSeriesMin(navigatorSeries && navigatorSeries.xData ?
- navigatorSeries.xData[0] :
- -Number.MAX_VALUE));
- }
- }
- // Update the extremes
- if (hasSetExtremes && (stickToMin || stickToMax)) {
- if (isNumber(newMin)) {
- baseXAxis.min = baseXAxis.userMin = newMin;
- baseXAxis.max = baseXAxis.userMax = newMax;
- }
- }
- }
- // Reset
- navigator.stickToMin =
- navigator.stickToMax = null;
- };
- /**
- * Handler for updated data on the base series. When data is modified, the
- * navigator series must reflect it. This is called from the Chart.redraw
- * function before axis and series extremes are computed.
- *
- * @private
- * @function Highcharts.Navigator#updateDataHandler
- */
- Navigator.prototype.updatedDataHandler = function () {
- var navigator = this.chart.navigator, baseSeries = this, navigatorSeries = this.navigatorSeries, xDataMin = navigator.getBaseSeriesMin(baseSeries.xData[0]);
- // If the scrollbar is scrolled all the way to the right, keep right as
- // new data comes in.
- navigator.stickToMax = navigator.reversedExtremes ?
- Math.round(navigator.zoomedMin) === 0 :
- Math.round(navigator.zoomedMax) >= Math.round(navigator.size);
- // Detect whether the zoomed area should stick to the minimum or
- // maximum. If the current axis minimum falls outside the new updated
- // dataset, we must adjust.
- navigator.stickToMin = isNumber(baseSeries.xAxis.min) &&
- (baseSeries.xAxis.min <= xDataMin) &&
- (!this.chart.fixedRange || !navigator.stickToMax);
- // Set the navigator series data to the new data of the base series
- if (navigatorSeries && !navigator.hasNavigatorData) {
- navigatorSeries.options.pointStart = baseSeries.xData[0];
- navigatorSeries.setData(baseSeries.options.data, false, null, false); // #5414
- }
- };
- /**
- * Add chart events, like redrawing navigator, when chart requires that.
- *
- * @private
- * @function Highcharts.Navigator#addChartEvents
- * @return {void}
- */
- Navigator.prototype.addChartEvents = function () {
- if (!this.eventsToUnbind) {
- this.eventsToUnbind = [];
- }
- this.eventsToUnbind.push(
- // Move the scrollbar after redraw, like after data updata even if
- // axes don't redraw
- addEvent(this.chart, 'redraw', function () {
- var navigator = this.navigator, xAxis = navigator && (navigator.baseSeries &&
- navigator.baseSeries[0] &&
- navigator.baseSeries[0].xAxis ||
- this.xAxis[0]); // #5709, #13114
- if (xAxis) {
- navigator.render(xAxis.min, xAxis.max);
- }
- }),
- // Make room for the navigator, can be placed around the chart:
- addEvent(this.chart, 'getMargins', function () {
- var chart = this, navigator = chart.navigator, marginName = navigator.opposite ?
- 'plotTop' : 'marginBottom';
- if (chart.inverted) {
- marginName = navigator.opposite ?
- 'marginRight' : 'plotLeft';
- }
- chart[marginName] =
- (chart[marginName] || 0) + (navigator.navigatorEnabled || !chart.inverted ?
- navigator.outlineHeight :
- 0) + navigator.navigatorOptions.margin;
- }));
- };
- /**
- * Destroys allocated elements.
- *
- * @private
- * @function Highcharts.Navigator#destroy
- */
- Navigator.prototype.destroy = function () {
- // Disconnect events added in addEvents
- this.removeEvents();
- if (this.xAxis) {
- erase(this.chart.xAxis, this.xAxis);
- erase(this.chart.axes, this.xAxis);
- }
- if (this.yAxis) {
- erase(this.chart.yAxis, this.yAxis);
- erase(this.chart.axes, this.yAxis);
- }
- // Destroy series
- (this.series || []).forEach(function (s) {
- if (s.destroy) {
- s.destroy();
- }
- });
- // Destroy properties
- [
- 'series', 'xAxis', 'yAxis', 'shades', 'outline', 'scrollbarTrack',
- 'scrollbarRifles', 'scrollbarGroup', 'scrollbar', 'navigatorGroup',
- 'rendered'
- ].forEach(function (prop) {
- if (this[prop] && this[prop].destroy) {
- this[prop].destroy();
- }
- this[prop] = null;
- }, this);
- // Destroy elements in collection
- [this.handles].forEach(function (coll) {
- destroyObjectProperties(coll);
- }, this);
- };
- return Navigator;
- }());
- // End of prototype
- if (!H.Navigator) {
- H.Navigator = Navigator;
- NavigatorAxis.compose(Axis);
- // For Stock charts. For x only zooming, do not to create the zoom button
- // because X axis zooming is already allowed by the Navigator and Range
- // selector. (#9285)
- addEvent(Chart, 'beforeShowResetZoom', function () {
- var chartOptions = this.options, navigator = chartOptions.navigator, rangeSelector = chartOptions.rangeSelector;
- if (((navigator && navigator.enabled) ||
- (rangeSelector && rangeSelector.enabled)) &&
- ((!isTouchDevice && chartOptions.chart.zoomType === 'x') ||
- (isTouchDevice && chartOptions.chart.pinchType === 'x'))) {
- return false;
- }
- });
- // Initialize navigator for stock charts
- addEvent(Chart, 'beforeRender', function () {
- var options = this.options;
- if (options.navigator.enabled ||
- options.scrollbar.enabled) {
- this.scroller = this.navigator = new Navigator(this);
- }
- });
- // For stock charts, extend the Chart.setChartSize method so that we can set
- // the final top position of the navigator once the height of the chart,
- // including the legend, is determined. #367. We can't use Chart.getMargins,
- // because labels offsets are not calculated yet.
- addEvent(Chart, 'afterSetChartSize', function () {
- var legend = this.legend, navigator = this.navigator, scrollbarHeight, legendOptions, xAxis, yAxis;
- if (navigator) {
- legendOptions = legend && legend.options;
- xAxis = navigator.xAxis;
- yAxis = navigator.yAxis;
- scrollbarHeight = navigator.scrollbarHeight;
- // Compute the top position
- if (this.inverted) {
- navigator.left = navigator.opposite ?
- this.chartWidth - scrollbarHeight -
- navigator.height :
- this.spacing[3] + scrollbarHeight;
- navigator.top = this.plotTop + scrollbarHeight;
- }
- else {
- navigator.left = this.plotLeft + scrollbarHeight;
- navigator.top = navigator.navigatorOptions.top ||
- this.chartHeight -
- navigator.height -
- scrollbarHeight -
- this.spacing[2] -
- (this.rangeSelector && this.extraBottomMargin ?
- this.rangeSelector.getHeight() :
- 0) -
- ((legendOptions &&
- legendOptions.verticalAlign === 'bottom' &&
- legendOptions.layout !== 'proximate' && // #13392
- legendOptions.enabled &&
- !legendOptions.floating) ?
- legend.legendHeight +
- pick(legendOptions.margin, 10) :
- 0) -
- (this.titleOffset ? this.titleOffset[2] : 0);
- }
- if (xAxis && yAxis) { // false if navigator is disabled (#904)
- if (this.inverted) {
- xAxis.options.left = yAxis.options.left = navigator.left;
- }
- else {
- xAxis.options.top = yAxis.options.top = navigator.top;
- }
- xAxis.setAxisSize();
- yAxis.setAxisSize();
- }
- }
- });
- // Merge options, if no scrolling exists yet
- addEvent(Chart, 'update', function (e) {
- var navigatorOptions = (e.options.navigator || {}), scrollbarOptions = (e.options.scrollbar || {});
- if (!this.navigator && !this.scroller &&
- (navigatorOptions.enabled || scrollbarOptions.enabled)) {
- merge(true, this.options.navigator, navigatorOptions);
- merge(true, this.options.scrollbar, scrollbarOptions);
- delete e.options.navigator;
- delete e.options.scrollbar;
- }
- });
- // Initialize navigator, if no scrolling exists yet
- addEvent(Chart, 'afterUpdate', function (event) {
- if (!this.navigator && !this.scroller &&
- (this.options.navigator.enabled ||
- this.options.scrollbar.enabled)) {
- this.scroller = this.navigator = new Navigator(this);
- if (pick(event.redraw, true)) {
- this.redraw(event.animation); // #7067
- }
- }
- });
- // Handle adding new series
- addEvent(Chart, 'afterAddSeries', function () {
- if (this.navigator) {
- // Recompute which series should be shown in navigator, and add them
- this.navigator.setBaseSeries(null, false);
- }
- });
- // Handle updating series
- addEvent(Series, 'afterUpdate', function () {
- if (this.chart.navigator && !this.options.isInternal) {
- this.chart.navigator.setBaseSeries(null, false);
- }
- });
- Chart.prototype.callbacks.push(function (chart) {
- var extremes, navigator = chart.navigator;
- // Initialize the navigator
- if (navigator && chart.xAxis[0]) {
- extremes = chart.xAxis[0].getExtremes();
- navigator.render(extremes.min, extremes.max);
- }
- });
- }
- H.Navigator = Navigator;
- return H.Navigator;
- });
- _registerModule(_modules, 'parts/OrdinalAxis.js', [_modules['parts/Axis.js'], _modules['parts/Globals.js'], _modules['parts/Utilities.js']], function (Axis, H, U) {
- /* *
- *
- * (c) 2010-2020 Torstein Honsi
- *
- * License: www.highcharts.com/license
- *
- * !!!!!!! SOURCE GETS TRANSPILED BY TYPESCRIPT. EDIT TS FILE ONLY. !!!!!!!
- *
- * */
- var addEvent = U.addEvent, css = U.css, defined = U.defined, pick = U.pick, timeUnits = U.timeUnits;
- // Has a dependency on Navigator due to the use of Axis.toFixedRange
- var Chart = H.Chart, Series = H.Series;
- /**
- * Extends the axis with ordinal support.
- * @private
- */
- var OrdinalAxis;
- (function (OrdinalAxis) {
- /* *
- *
- * Classes
- *
- * */
- /**
- * @private
- */
- var Composition = /** @class */ (function () {
- /* *
- *
- * Constructors
- *
- * */
- /**
- * @private
- */
- function Composition(axis) {
- this.index = {};
- this.axis = axis;
- }
- /* *
- *
- * Functions
- *
- * */
- /**
- * Calculate the ordinal positions before tick positions are calculated.
- *
- * @private
- */
- Composition.prototype.beforeSetTickPositions = function () {
- var axis = this.axis, ordinal = axis.ordinal, len, ordinalPositions = [], uniqueOrdinalPositions, useOrdinal = false, dist, extremes = axis.getExtremes(), min = extremes.min, max = extremes.max, minIndex, maxIndex, slope, hasBreaks = axis.isXAxis && !!axis.options.breaks, isOrdinal = axis.options.ordinal, overscrollPointsRange = Number.MAX_VALUE, ignoreHiddenSeries = axis.chart.options.chart.ignoreHiddenSeries, i, hasBoostedSeries;
- // Apply the ordinal logic
- if (isOrdinal || hasBreaks) { // #4167 YAxis is never ordinal ?
- axis.series.forEach(function (series, i) {
- uniqueOrdinalPositions = [];
- if ((!ignoreHiddenSeries || series.visible !== false) &&
- (series.takeOrdinalPosition !== false || hasBreaks)) {
- // concatenate the processed X data into the existing
- // positions, or the empty array
- ordinalPositions = ordinalPositions.concat(series.processedXData);
- len = ordinalPositions.length;
- // remove duplicates (#1588)
- ordinalPositions.sort(function (a, b) {
- // without a custom function it is sorted as strings
- return a - b;
- });
- overscrollPointsRange = Math.min(overscrollPointsRange, pick(
- // Check for a single-point series:
- series.closestPointRange, overscrollPointsRange));
- if (len) {
- i = 0;
- while (i < len - 1) {
- if (ordinalPositions[i] !== ordinalPositions[i + 1]) {
- uniqueOrdinalPositions.push(ordinalPositions[i + 1]);
- }
- i++;
- }
- // Check first item:
- if (uniqueOrdinalPositions[0] !== ordinalPositions[0]) {
- uniqueOrdinalPositions.unshift(ordinalPositions[0]);
- }
- ordinalPositions = uniqueOrdinalPositions;
- }
- }
- if (series.isSeriesBoosting) {
- hasBoostedSeries = true;
- }
- });
- if (hasBoostedSeries) {
- ordinalPositions.length = 0;
- }
- // cache the length
- len = ordinalPositions.length;
- // Check if we really need the overhead of mapping axis data
- // against the ordinal positions. If the series consist of
- // evenly spaced data any way, we don't need any ordinal logic.
- if (len > 2) { // two points have equal distance by default
- dist = ordinalPositions[1] - ordinalPositions[0];
- i = len - 1;
- while (i-- && !useOrdinal) {
- if (ordinalPositions[i + 1] - ordinalPositions[i] !== dist) {
- useOrdinal = true;
- }
- }
- // When zooming in on a week, prevent axis padding for
- // weekends even though the data within the week is evenly
- // spaced.
- if (!axis.options.keepOrdinalPadding &&
- (ordinalPositions[0] - min > dist ||
- max - ordinalPositions[ordinalPositions.length - 1] >
- dist)) {
- useOrdinal = true;
- }
- }
- else if (axis.options.overscroll) {
- if (len === 2) {
- // Exactly two points, distance for overscroll is fixed:
- overscrollPointsRange =
- ordinalPositions[1] - ordinalPositions[0];
- }
- else if (len === 1) {
- // We have just one point, closest distance is unknown.
- // Assume then it is last point and overscrolled range:
- overscrollPointsRange = axis.options.overscroll;
- ordinalPositions = [
- ordinalPositions[0],
- ordinalPositions[0] + overscrollPointsRange
- ];
- }
- else {
- // In case of zooming in on overscrolled range, stick to
- // the old range:
- overscrollPointsRange = ordinal.overscrollPointsRange;
- }
- }
- // Record the slope and offset to compute the linear values from
- // the array index. Since the ordinal positions may exceed the
- // current range, get the start and end positions within it
- // (#719, #665b)
- if (useOrdinal) {
- if (axis.options.overscroll) {
- ordinal.overscrollPointsRange = overscrollPointsRange;
- ordinalPositions = ordinalPositions.concat(ordinal.getOverscrollPositions());
- }
- // Register
- ordinal.positions = ordinalPositions;
- // This relies on the ordinalPositions being set. Use
- // Math.max and Math.min to prevent padding on either sides
- // of the data.
- minIndex = axis.ordinal2lin(// #5979
- Math.max(min, ordinalPositions[0]), true);
- maxIndex = Math.max(axis.ordinal2lin(Math.min(max, ordinalPositions[ordinalPositions.length - 1]), true), 1); // #3339
- // Set the slope and offset of the values compared to the
- // indices in the ordinal positions
- ordinal.slope = slope = (max - min) / (maxIndex - minIndex);
- ordinal.offset = min - (minIndex * slope);
- }
- else {
- ordinal.overscrollPointsRange = pick(axis.closestPointRange, ordinal.overscrollPointsRange);
- ordinal.positions = axis.ordinal.slope = ordinal.offset =
- void 0;
- }
- }
- axis.isOrdinal = isOrdinal && useOrdinal; // #3818, #4196, #4926
- ordinal.groupIntervalFactor = null; // reset for next run
- };
- /**
- * Get the ordinal positions for the entire data set. This is necessary
- * in chart panning because we need to find out what points or data
- * groups are available outside the visible range. When a panning
- * operation starts, if an index for the given grouping does not exists,
- * it is created and cached. This index is deleted on updated data, so
- * it will be regenerated the next time a panning operation starts.
- *
- * @private
- */
- Composition.prototype.getExtendedPositions = function () {
- var ordinal = this, axis = ordinal.axis, axisProto = axis.constructor.prototype, chart = axis.chart, grouping = axis.series[0].currentDataGrouping, ordinalIndex = ordinal.index, key = grouping ?
- grouping.count + grouping.unitName :
- 'raw', overscroll = axis.options.overscroll, extremes = axis.getExtremes(), fakeAxis, fakeSeries;
- // If this is the first time, or the ordinal index is deleted by
- // updatedData,
- // create it.
- if (!ordinalIndex) {
- ordinalIndex = ordinal.index = {};
- }
- if (!ordinalIndex[key]) {
- // Create a fake axis object where the extended ordinal
- // positions are emulated
- fakeAxis = {
- series: [],
- chart: chart,
- getExtremes: function () {
- return {
- min: extremes.dataMin,
- max: extremes.dataMax + overscroll
- };
- },
- options: {
- ordinal: true
- },
- ordinal: {},
- ordinal2lin: axisProto.ordinal2lin,
- val2lin: axisProto.val2lin // #2590
- };
- fakeAxis.ordinal.axis = fakeAxis;
- // Add the fake series to hold the full data, then apply
- // processData to it
- axis.series.forEach(function (series) {
- fakeSeries = {
- xAxis: fakeAxis,
- xData: series.xData.slice(),
- chart: chart,
- destroyGroupedData: H.noop,
- getProcessedData: H.Series.prototype.getProcessedData
- };
- fakeSeries.xData = fakeSeries.xData.concat(ordinal.getOverscrollPositions());
- fakeSeries.options = {
- dataGrouping: grouping ? {
- enabled: true,
- forced: true,
- // doesn't matter which, use the fastest
- approximation: 'open',
- units: [[
- grouping.unitName,
- [grouping.count]
- ]]
- } : {
- enabled: false
- }
- };
- series.processData.apply(fakeSeries);
- fakeAxis.series.push(fakeSeries);
- });
- // Run beforeSetTickPositions to compute the ordinalPositions
- axis.ordinal.beforeSetTickPositions.apply({ axis: fakeAxis });
- // Cache it
- ordinalIndex[key] = fakeAxis.ordinal.positions;
- }
- return ordinalIndex[key];
- };
- /**
- * Find the factor to estimate how wide the plot area would have been if
- * ordinal gaps were included. This value is used to compute an imagined
- * plot width in order to establish the data grouping interval.
- *
- * A real world case is the intraday-candlestick example. Without this
- * logic, it would show the correct data grouping when viewing a range
- * within each day, but once moving the range to include the gap between
- * two days, the interval would include the cut-away night hours and the
- * data grouping would be wrong. So the below method tries to compensate
- * by identifying the most common point interval, in this case days.
- *
- * An opposite case is presented in issue #718. We have a long array of
- * daily data, then one point is appended one hour after the last point.
- * We expect the data grouping not to change.
- *
- * In the future, if we find cases where this estimation doesn't work
- * optimally, we might need to add a second pass to the data grouping
- * logic, where we do another run with a greater interval if the number
- * of data groups is more than a certain fraction of the desired group
- * count.
- *
- * @private
- */
- Composition.prototype.getGroupIntervalFactor = function (xMin, xMax, series) {
- var ordinal = this, axis = ordinal.axis, i, processedXData = series.processedXData, len = processedXData.length, distances = [], median, groupIntervalFactor = ordinal.groupIntervalFactor;
- // Only do this computation for the first series, let the other
- // inherit it (#2416)
- if (!groupIntervalFactor) {
- // Register all the distances in an array
- for (i = 0; i < len - 1; i++) {
- distances[i] =
- processedXData[i + 1] - processedXData[i];
- }
- // Sort them and find the median
- distances.sort(function (a, b) {
- return a - b;
- });
- median = distances[Math.floor(len / 2)];
- // Compensate for series that don't extend through the entire
- // axis extent. #1675.
- xMin = Math.max(xMin, processedXData[0]);
- xMax = Math.min(xMax, processedXData[len - 1]);
- ordinal.groupIntervalFactor = groupIntervalFactor =
- (len * median) / (xMax - xMin);
- }
- // Return the factor needed for data grouping
- return groupIntervalFactor;
- };
- /**
- * Get ticks for an ordinal axis within a range where points don't
- * exist. It is required when overscroll is enabled. We can't base on
- * points, because we may not have any, so we use approximated
- * pointRange and generate these ticks between Axis.dataMax,
- * Axis.dataMax + Axis.overscroll evenly spaced. Used in panning and
- * navigator scrolling.
- *
- * @private
- */
- Composition.prototype.getOverscrollPositions = function () {
- var ordinal = this, axis = ordinal.axis, extraRange = axis.options.overscroll, distance = ordinal.overscrollPointsRange, positions = [], max = axis.dataMax;
- if (defined(distance)) {
- // Max + pointRange because we need to scroll to the last
- positions.push(max);
- while (max <= axis.dataMax + extraRange) {
- max += distance;
- positions.push(max);
- }
- }
- return positions;
- };
- /**
- * Make the tick intervals closer because the ordinal gaps make the
- * ticks spread out or cluster.
- *
- * @private
- */
- Composition.prototype.postProcessTickInterval = function (tickInterval) {
- // Problem: https://jsfiddle.net/highcharts/FQm4E/1/
- // This is a case where this algorithm doesn't work optimally. In
- // this case, the tick labels are spread out per week, but all the
- // gaps reside within weeks. So we have a situation where the labels
- // are courser than the ordinal gaps, and thus the tick interval
- // should not be altered.
- var ordinal = this, axis = ordinal.axis, ordinalSlope = ordinal.slope, ret;
- if (ordinalSlope) {
- if (!axis.options.breaks) {
- ret = tickInterval / (ordinalSlope / axis.closestPointRange);
- }
- else {
- ret = axis.closestPointRange || tickInterval; // #7275
- }
- }
- else {
- ret = tickInterval;
- }
- return ret;
- };
- return Composition;
- }());
- OrdinalAxis.Composition = Composition;
- /* *
- *
- * Functions
- *
- * */
- /**
- * Extends the axis with ordinal support.
- *
- * @private
- *
- * @param AxisClass
- * Axis class to extend.
- *
- * @param ChartClass
- * Chart class to use.
- *
- * @param SeriesClass
- * Series class to use.
- */
- function compose(AxisClass, ChartClass, SeriesClass) {
- AxisClass.keepProps.push('ordinal');
- var axisProto = AxisClass.prototype;
- /**
- * In an ordinal axis, there might be areas with dense consentrations of
- * points, then large gaps between some. Creating equally distributed
- * ticks over this entire range may lead to a huge number of ticks that
- * will later be removed. So instead, break the positions up in
- * segments, find the tick positions for each segment then concatenize
- * them. This method is used from both data grouping logic and X axis
- * tick position logic.
- *
- * @private
- */
- AxisClass.prototype.getTimeTicks = function (normalizedInterval, min, max, startOfWeek, positions, closestDistance, findHigherRanks) {
- if (positions === void 0) { positions = []; }
- if (closestDistance === void 0) { closestDistance = 0; }
- var start = 0, end, segmentPositions, higherRanks = {}, hasCrossedHigherRank, info, posLength, outsideMax, groupPositions = [], lastGroupPosition = -Number.MAX_VALUE, tickPixelIntervalOption = this.options.tickPixelInterval, time = this.chart.time,
- // Record all the start positions of a segment, to use when
- // deciding what's a gap in the data.
- segmentStarts = [];
- // The positions are not always defined, for example for ordinal
- // positions when data has regular interval (#1557, #2090)
- if ((!this.options.ordinal && !this.options.breaks) ||
- !positions ||
- positions.length < 3 ||
- typeof min === 'undefined') {
- return time.getTimeTicks.apply(time, arguments);
- }
- // Analyze the positions array to split it into segments on gaps
- // larger than 5 times the closest distance. The closest distance is
- // already found at this point, so we reuse that instead of
- // computing it again.
- posLength = positions.length;
- for (end = 0; end < posLength; end++) {
- outsideMax = end && positions[end - 1] > max;
- if (positions[end] < min) { // Set the last position before min
- start = end;
- }
- if (end === posLength - 1 ||
- positions[end + 1] - positions[end] > closestDistance * 5 ||
- outsideMax) {
- // For each segment, calculate the tick positions from the
- // getTimeTicks utility function. The interval will be the
- // same regardless of how long the segment is.
- if (positions[end] > lastGroupPosition) { // #1475
- segmentPositions = time.getTimeTicks(normalizedInterval, positions[start], positions[end], startOfWeek);
- // Prevent duplicate groups, for example for multiple
- // segments within one larger time frame (#1475)
- while (segmentPositions.length &&
- segmentPositions[0] <= lastGroupPosition) {
- segmentPositions.shift();
- }
- if (segmentPositions.length) {
- lastGroupPosition =
- segmentPositions[segmentPositions.length - 1];
- }
- segmentStarts.push(groupPositions.length);
- groupPositions = groupPositions.concat(segmentPositions);
- }
- // Set start of next segment
- start = end + 1;
- }
- if (outsideMax) {
- break;
- }
- }
- // Get the grouping info from the last of the segments. The info is
- // the same for all segments.
- info = segmentPositions.info;
- // Optionally identify ticks with higher rank, for example when the
- // ticks have crossed midnight.
- if (findHigherRanks && info.unitRange <= timeUnits.hour) {
- end = groupPositions.length - 1;
- // Compare points two by two
- for (start = 1; start < end; start++) {
- if (time.dateFormat('%d', groupPositions[start]) !==
- time.dateFormat('%d', groupPositions[start - 1])) {
- higherRanks[groupPositions[start]] = 'day';
- hasCrossedHigherRank = true;
- }
- }
- // If the complete array has crossed midnight, we want to mark
- // the first positions also as higher rank
- if (hasCrossedHigherRank) {
- higherRanks[groupPositions[0]] = 'day';
- }
- info.higherRanks = higherRanks;
- }
- // Save the info
- info.segmentStarts = segmentStarts;
- groupPositions.info = info;
- // Don't show ticks within a gap in the ordinal axis, where the
- // space between two points is greater than a portion of the tick
- // pixel interval
- if (findHigherRanks && defined(tickPixelIntervalOption)) {
- var length = groupPositions.length, i = length, itemToRemove, translated, translatedArr = [], lastTranslated, medianDistance, distance, distances = [];
- // Find median pixel distance in order to keep a reasonably even
- // distance between ticks (#748)
- while (i--) {
- translated = this.translate(groupPositions[i]);
- if (lastTranslated) {
- distances[i] = lastTranslated - translated;
- }
- translatedArr[i] = lastTranslated = translated;
- }
- distances.sort();
- medianDistance = distances[Math.floor(distances.length / 2)];
- if (medianDistance < tickPixelIntervalOption * 0.6) {
- medianDistance = null;
- }
- // Now loop over again and remove ticks where needed
- i = groupPositions[length - 1] > max ? length - 1 : length; // #817
- lastTranslated = void 0;
- while (i--) {
- translated = translatedArr[i];
- distance = Math.abs(lastTranslated - translated);
- // #4175 - when axis is reversed, the distance, is negative
- // but tickPixelIntervalOption positive, so we need to
- // compare the same values
- // Remove ticks that are closer than 0.6 times the pixel
- // interval from the one to the right, but not if it is
- // close to the median distance (#748).
- if (lastTranslated &&
- distance < tickPixelIntervalOption * 0.8 &&
- (medianDistance === null || distance < medianDistance * 0.8)) {
- // Is this a higher ranked position with a normal
- // position to the right?
- if (higherRanks[groupPositions[i]] &&
- !higherRanks[groupPositions[i + 1]]) {
- // Yes: remove the lower ranked neighbour to the
- // right
- itemToRemove = i + 1;
- lastTranslated = translated; // #709
- }
- else {
- // No: remove this one
- itemToRemove = i;
- }
- groupPositions.splice(itemToRemove, 1);
- }
- else {
- lastTranslated = translated;
- }
- }
- }
- return groupPositions;
- };
- /**
- * Translate from linear (internal) to axis value.
- *
- * @private
- * @function Highcharts.Axis#lin2val
- *
- * @param {number} val
- * The linear abstracted value.
- *
- * @param {boolean} [fromIndex]
- * Translate from an index in the ordinal positions rather than a
- * value.
- *
- * @return {number}
- */
- axisProto.lin2val = function (val, fromIndex) {
- var axis = this, ordinal = axis.ordinal, ordinalPositions = ordinal.positions, ret;
- // the visible range contains only equally spaced values
- if (!ordinalPositions) {
- ret = val;
- }
- else {
- var ordinalSlope = ordinal.slope, ordinalOffset = ordinal.offset, i = ordinalPositions.length - 1, linearEquivalentLeft, linearEquivalentRight, distance;
- // Handle the case where we translate from the index directly,
- // used only when panning an ordinal axis
- if (fromIndex) {
- if (val < 0) { // out of range, in effect panning to the left
- val = ordinalPositions[0];
- }
- else if (val > i) { // out of range, panning to the right
- val = ordinalPositions[i];
- }
- else { // split it up
- i = Math.floor(val);
- distance = val - i; // the decimal
- }
- // Loop down along the ordinal positions. When the linear
- // equivalent of i matches an ordinal position, interpolate
- // between the left and right values.
- }
- else {
- while (i--) {
- linearEquivalentLeft =
- (ordinalSlope * i) + ordinalOffset;
- if (val >= linearEquivalentLeft) {
- linearEquivalentRight =
- (ordinalSlope *
- (i + 1)) +
- ordinalOffset;
- // something between 0 and 1
- distance = (val - linearEquivalentLeft) /
- (linearEquivalentRight - linearEquivalentLeft);
- break;
- }
- }
- }
- // If the index is within the range of the ordinal positions,
- // return the associated or interpolated value. If not, just
- // return the value.
- return (typeof distance !== 'undefined' &&
- typeof ordinalPositions[i] !== 'undefined' ?
- ordinalPositions[i] + (distance ?
- distance *
- (ordinalPositions[i + 1] - ordinalPositions[i]) :
- 0) :
- val);
- }
- return ret;
- };
- /**
- * Translate from a linear axis value to the corresponding ordinal axis
- * position. If there are no gaps in the ordinal axis this will be the
- * same. The translated value is the value that the point would have if
- * the axis were linear, using the same min and max.
- *
- * @private
- * @function Highcharts.Axis#val2lin
- *
- * @param {number} val
- * The axis value.
- *
- * @param {boolean} [toIndex]
- * Whether to return the index in the ordinalPositions or the new value.
- *
- * @return {number}
- */
- axisProto.val2lin = function (val, toIndex) {
- var axis = this, ordinal = axis.ordinal, ordinalPositions = ordinal.positions, ret;
- if (!ordinalPositions) {
- ret = val;
- }
- else {
- var ordinalLength = ordinalPositions.length, i, distance, ordinalIndex;
- // first look for an exact match in the ordinalpositions array
- i = ordinalLength;
- while (i--) {
- if (ordinalPositions[i] === val) {
- ordinalIndex = i;
- break;
- }
- }
- // if that failed, find the intermediate position between the
- // two nearest values
- i = ordinalLength - 1;
- while (i--) {
- if (val > ordinalPositions[i] || i === 0) { // interpolate
- // something between 0 and 1
- distance = (val - ordinalPositions[i]) /
- (ordinalPositions[i + 1] - ordinalPositions[i]);
- ordinalIndex = i + distance;
- break;
- }
- }
- ret = toIndex ?
- ordinalIndex :
- ordinal.slope *
- (ordinalIndex || 0) +
- ordinal.offset;
- }
- return ret;
- };
- // Record this to prevent overwriting by broken-axis module (#5979)
- axisProto.ordinal2lin = axisProto.val2lin;
- /* eslint-disable no-invalid-this */
- addEvent(AxisClass, 'afterInit', function () {
- var axis = this;
- if (!axis.ordinal) {
- axis.ordinal = new OrdinalAxis.Composition(axis);
- }
- });
- addEvent(AxisClass, 'foundExtremes', function () {
- var axis = this;
- if (axis.isXAxis &&
- defined(axis.options.overscroll) &&
- axis.max === axis.dataMax &&
- (
- // Panning is an execption. We don't want to apply
- // overscroll when panning over the dataMax
- !axis.chart.mouseIsDown ||
- axis.isInternal) && (
- // Scrollbar buttons are the other execption:
- !axis.eventArgs ||
- axis.eventArgs && axis.eventArgs.trigger !== 'navigator')) {
- axis.max += axis.options.overscroll;
- // Live data and buttons require translation for the min:
- if (!axis.isInternal && defined(axis.userMin)) {
- axis.min += axis.options.overscroll;
- }
- }
- });
- // For ordinal axis, that loads data async, redraw axis after data is
- // loaded. If we don't do that, axis will have the same extremes as
- // previously, but ordinal positions won't be calculated. See #10290
- addEvent(AxisClass, 'afterSetScale', function () {
- var axis = this;
- if (axis.horiz && !axis.isDirty) {
- axis.isDirty = axis.isOrdinal &&
- axis.chart.navigator &&
- !axis.chart.navigator.adaptToUpdatedData;
- }
- });
- addEvent(AxisClass, 'initialAxisTranslation', function () {
- var axis = this;
- if (axis.ordinal) {
- axis.ordinal.beforeSetTickPositions();
- axis.tickInterval = axis.ordinal.postProcessTickInterval(axis.tickInterval);
- }
- });
- // Extending the Chart.pan method for ordinal axes
- addEvent(ChartClass, 'pan', function (e) {
- var chart = this, xAxis = chart.xAxis[0], overscroll = xAxis.options.overscroll, chartX = e.originalEvent.chartX, panning = chart.options.chart &&
- chart.options.chart.panning, runBase = false;
- if (panning &&
- panning.type !== 'y' &&
- xAxis.options.ordinal &&
- xAxis.series.length) {
- var mouseDownX = chart.mouseDownX, extremes = xAxis.getExtremes(), dataMax = extremes.dataMax, min = extremes.min, max = extremes.max, trimmedRange, hoverPoints = chart.hoverPoints, closestPointRange = (xAxis.closestPointRange ||
- (xAxis.ordinal && xAxis.ordinal.overscrollPointsRange)), pointPixelWidth = (xAxis.translationSlope *
- (xAxis.ordinal.slope || closestPointRange)),
- // how many ordinal units did we move?
- movedUnits = (mouseDownX - chartX) / pointPixelWidth,
- // get index of all the chart's points
- extendedAxis = { ordinal: { positions: xAxis.ordinal.getExtendedPositions() } }, ordinalPositions, searchAxisLeft, lin2val = xAxis.lin2val, val2lin = xAxis.val2lin, searchAxisRight;
- // we have an ordinal axis, but the data is equally spaced
- if (!extendedAxis.ordinal.positions) {
- runBase = true;
- }
- else if (Math.abs(movedUnits) > 1) {
- // Remove active points for shared tooltip
- if (hoverPoints) {
- hoverPoints.forEach(function (point) {
- point.setState();
- });
- }
- if (movedUnits < 0) {
- searchAxisLeft = extendedAxis;
- searchAxisRight = xAxis.ordinal.positions ? xAxis : extendedAxis;
- }
- else {
- searchAxisLeft = xAxis.ordinal.positions ? xAxis : extendedAxis;
- searchAxisRight = extendedAxis;
- }
- // In grouped data series, the last ordinal position
- // represents the grouped data, which is to the left of the
- // real data max. If we don't compensate for this, we will
- // be allowed to pan grouped data series passed the right of
- // the plot area.
- ordinalPositions = searchAxisRight.ordinal.positions;
- if (dataMax >
- ordinalPositions[ordinalPositions.length - 1]) {
- ordinalPositions.push(dataMax);
- }
- // Get the new min and max values by getting the ordinal
- // index for the current extreme, then add the moved units
- // and translate back to values. This happens on the
- // extended ordinal positions if the new position is out of
- // range, else it happens on the current x axis which is
- // smaller and faster.
- chart.fixedRange = max - min;
- trimmedRange = xAxis.navigatorAxis.toFixedRange(null, null, lin2val.apply(searchAxisLeft, [
- val2lin.apply(searchAxisLeft, [min, true]) + movedUnits,
- true // translate from index
- ]), lin2val.apply(searchAxisRight, [
- val2lin.apply(searchAxisRight, [max, true]) + movedUnits,
- true // translate from index
- ]));
- // Apply it if it is within the available data range
- if (trimmedRange.min >= Math.min(extremes.dataMin, min) &&
- trimmedRange.max <= Math.max(dataMax, max) + overscroll) {
- xAxis.setExtremes(trimmedRange.min, trimmedRange.max, true, false, { trigger: 'pan' });
- }
- chart.mouseDownX = chartX; // set new reference for next run
- css(chart.container, { cursor: 'move' });
- }
- }
- else {
- runBase = true;
- }
- // revert to the linear chart.pan version
- if (runBase || (panning && /y/.test(panning.type))) {
- if (overscroll) {
- xAxis.max = xAxis.dataMax + overscroll;
- }
- }
- else {
- e.preventDefault();
- }
- });
- addEvent(SeriesClass, 'updatedData', function () {
- var xAxis = this.xAxis;
- // Destroy the extended ordinal index on updated data
- if (xAxis && xAxis.options.ordinal) {
- delete xAxis.ordinal.index;
- }
- });
- /* eslint-enable no-invalid-this */
- }
- OrdinalAxis.compose = compose;
- })(OrdinalAxis || (OrdinalAxis = {}));
- OrdinalAxis.compose(Axis, Chart, Series); // @todo move to StockChart, remove from master
- return OrdinalAxis;
- });
- _registerModule(_modules, 'modules/broken-axis.src.js', [_modules['parts/Axis.js'], _modules['parts/Globals.js'], _modules['parts/Utilities.js'], _modules['parts/Stacking.js']], function (Axis, H, U, StackItem) {
- /* *
- *
- * (c) 2009-2020 Torstein Honsi
- *
- * License: www.highcharts.com/license
- *
- * !!!!!!! SOURCE GETS TRANSPILED BY TYPESCRIPT. EDIT TS FILE ONLY. !!!!!!!
- *
- * */
- var addEvent = U.addEvent, find = U.find, fireEvent = U.fireEvent, isArray = U.isArray, isNumber = U.isNumber, pick = U.pick;
- var Series = H.Series;
- /* eslint-disable valid-jsdoc */
- /**
- * Provides support for broken axes.
- * @private
- * @class
- */
- var BrokenAxisAdditions = /** @class */ (function () {
- /* *
- *
- * Constructors
- *
- * */
- function BrokenAxisAdditions(axis) {
- this.hasBreaks = false;
- this.axis = axis;
- }
- /* *
- *
- * Static Functions
- *
- * */
- /**
- * @private
- */
- BrokenAxisAdditions.isInBreak = function (brk, val) {
- var ret, repeat = brk.repeat || Infinity, from = brk.from, length = brk.to - brk.from, test = (val >= from ?
- (val - from) % repeat :
- repeat - ((from - val) % repeat));
- if (!brk.inclusive) {
- ret = test < length && test !== 0;
- }
- else {
- ret = test <= length;
- }
- return ret;
- };
- /**
- * @private
- */
- BrokenAxisAdditions.lin2Val = function (val) {
- var axis = this;
- var brokenAxis = axis.brokenAxis;
- var breakArray = brokenAxis && brokenAxis.breakArray;
- if (!breakArray) {
- return val;
- }
- var nval = val, brk, i;
- for (i = 0; i < breakArray.length; i++) {
- brk = breakArray[i];
- if (brk.from >= nval) {
- break;
- }
- else if (brk.to < nval) {
- nval += brk.len;
- }
- else if (BrokenAxisAdditions.isInBreak(brk, nval)) {
- nval += brk.len;
- }
- }
- return nval;
- };
- /**
- * @private
- */
- BrokenAxisAdditions.val2Lin = function (val) {
- var axis = this;
- var brokenAxis = axis.brokenAxis;
- var breakArray = brokenAxis && brokenAxis.breakArray;
- if (!breakArray) {
- return val;
- }
- var nval = val, brk, i;
- for (i = 0; i < breakArray.length; i++) {
- brk = breakArray[i];
- if (brk.to <= val) {
- nval -= brk.len;
- }
- else if (brk.from >= val) {
- break;
- }
- else if (BrokenAxisAdditions.isInBreak(brk, val)) {
- nval -= (val - brk.from);
- break;
- }
- }
- return nval;
- };
- /* *
- *
- * Functions
- *
- * */
- /**
- * Returns the first break found where the x is larger then break.from and
- * smaller then break.to.
- *
- * @param {number} x
- * The number which should be within a break.
- *
- * @param {Array<Highcharts.XAxisBreaksOptions>} breaks
- * The array of breaks to search within.
- *
- * @return {Highcharts.XAxisBreaksOptions|undefined}
- * Returns the first break found that matches, returns false if no break is
- * found.
- */
- BrokenAxisAdditions.prototype.findBreakAt = function (x, breaks) {
- return find(breaks, function (b) {
- return b.from < x && x < b.to;
- });
- };
- /**
- * @private
- */
- BrokenAxisAdditions.prototype.isInAnyBreak = function (val, testKeep) {
- var brokenAxis = this;
- var axis = brokenAxis.axis;
- var breaks = axis.options.breaks, i = breaks && breaks.length, inbrk, keep, ret;
- if (i) {
- while (i--) {
- if (BrokenAxisAdditions.isInBreak(breaks[i], val)) {
- inbrk = true;
- if (!keep) {
- keep = pick(breaks[i].showPoints, !axis.isXAxis);
- }
- }
- }
- if (inbrk && testKeep) {
- ret = inbrk && !keep;
- }
- else {
- ret = inbrk;
- }
- }
- return ret;
- };
- /**
- * Dynamically set or unset breaks in an axis. This function in lighter than
- * usin Axis.update, and it also preserves animation.
- *
- * @private
- * @function Highcharts.Axis#setBreaks
- *
- * @param {Array<Highcharts.XAxisBreaksOptions>} [breaks]
- * The breaks to add. When `undefined` it removes existing breaks.
- *
- * @param {boolean} [redraw=true]
- * Whether to redraw the chart immediately.
- *
- * @return {void}
- */
- BrokenAxisAdditions.prototype.setBreaks = function (breaks, redraw) {
- var brokenAxis = this;
- var axis = brokenAxis.axis;
- var hasBreaks = (isArray(breaks) && !!breaks.length);
- axis.isDirty = brokenAxis.hasBreaks !== hasBreaks;
- brokenAxis.hasBreaks = hasBreaks;
- axis.options.breaks = axis.userOptions.breaks = breaks;
- axis.forceRedraw = true; // Force recalculation in setScale
- // Recalculate series related to the axis.
- axis.series.forEach(function (series) {
- series.isDirty = true;
- });
- if (!hasBreaks && axis.val2lin === BrokenAxisAdditions.val2Lin) {
- // Revert to prototype functions
- delete axis.val2lin;
- delete axis.lin2val;
- }
- if (hasBreaks) {
- axis.userOptions.ordinal = false;
- axis.lin2val = BrokenAxisAdditions.lin2Val;
- axis.val2lin = BrokenAxisAdditions.val2Lin;
- axis.setExtremes = function (newMin, newMax, redraw, animation, eventArguments) {
- // If trying to set extremes inside a break, extend min to
- // after, and max to before the break ( #3857 )
- if (brokenAxis.hasBreaks) {
- var axisBreak, breaks = this.options.breaks;
- while ((axisBreak = brokenAxis.findBreakAt(newMin, breaks))) {
- newMin = axisBreak.to;
- }
- while ((axisBreak = brokenAxis.findBreakAt(newMax, breaks))) {
- newMax = axisBreak.from;
- }
- // If both min and max is within the same break.
- if (newMax < newMin) {
- newMax = newMin;
- }
- }
- Axis.prototype.setExtremes.call(this, newMin, newMax, redraw, animation, eventArguments);
- };
- axis.setAxisTranslation = function (saveOld) {
- Axis.prototype.setAxisTranslation.call(this, saveOld);
- brokenAxis.unitLength = null;
- if (brokenAxis.hasBreaks) {
- var breaks = axis.options.breaks || [],
- // Temporary one:
- breakArrayT = [], breakArray = [], length = 0, inBrk, repeat, min = axis.userMin || axis.min, max = axis.userMax || axis.max, pointRangePadding = pick(axis.pointRangePadding, 0), start, i;
- // Min & max check (#4247)
- breaks.forEach(function (brk) {
- repeat = brk.repeat || Infinity;
- if (BrokenAxisAdditions.isInBreak(brk, min)) {
- min +=
- (brk.to % repeat) -
- (min % repeat);
- }
- if (BrokenAxisAdditions.isInBreak(brk, max)) {
- max -=
- (max % repeat) -
- (brk.from % repeat);
- }
- });
- // Construct an array holding all breaks in the axis
- breaks.forEach(function (brk) {
- start = brk.from;
- repeat = brk.repeat || Infinity;
- while (start - repeat > min) {
- start -= repeat;
- }
- while (start < min) {
- start += repeat;
- }
- for (i = start; i < max; i += repeat) {
- breakArrayT.push({
- value: i,
- move: 'in'
- });
- breakArrayT.push({
- value: i + (brk.to - brk.from),
- move: 'out',
- size: brk.breakSize
- });
- }
- });
- breakArrayT.sort(function (a, b) {
- return ((a.value === b.value) ?
- ((a.move === 'in' ? 0 : 1) -
- (b.move === 'in' ? 0 : 1)) :
- a.value - b.value);
- });
- // Simplify the breaks
- inBrk = 0;
- start = min;
- breakArrayT.forEach(function (brk) {
- inBrk += (brk.move === 'in' ? 1 : -1);
- if (inBrk === 1 && brk.move === 'in') {
- start = brk.value;
- }
- if (inBrk === 0) {
- breakArray.push({
- from: start,
- to: brk.value,
- len: brk.value - start - (brk.size || 0)
- });
- length += brk.value - start - (brk.size || 0);
- }
- });
- /**
- * HC <= 8 backwards compatibility, used by demo samples.
- * @deprecated
- * @private
- * @requires modules/broken-axis
- */
- axis.breakArray = brokenAxis.breakArray = breakArray;
- // Used with staticScale, and below the actual axis length,
- // when breaks are substracted.
- brokenAxis.unitLength = max - min - length + pointRangePadding;
- fireEvent(axis, 'afterBreaks');
- if (axis.staticScale) {
- axis.transA = axis.staticScale;
- }
- else if (brokenAxis.unitLength) {
- axis.transA *=
- (max - axis.min + pointRangePadding) /
- brokenAxis.unitLength;
- }
- if (pointRangePadding) {
- axis.minPixelPadding =
- axis.transA * axis.minPointOffset;
- }
- axis.min = min;
- axis.max = max;
- }
- };
- }
- if (pick(redraw, true)) {
- axis.chart.redraw();
- }
- };
- return BrokenAxisAdditions;
- }());
- /**
- * Axis with support of broken data rows.
- * @private
- * @class
- */
- var BrokenAxis = /** @class */ (function () {
- function BrokenAxis() {
- }
- /**
- * Adds support for broken axes.
- * @private
- */
- BrokenAxis.compose = function (AxisClass, SeriesClass) {
- AxisClass.keepProps.push('brokenAxis');
- var seriesProto = Series.prototype;
- /**
- * @private
- */
- seriesProto.drawBreaks = function (axis, keys) {
- var series = this, points = series.points, breaks, threshold, eventName, y;
- if (axis && // #5950
- axis.brokenAxis &&
- axis.brokenAxis.hasBreaks) {
- var brokenAxis_1 = axis.brokenAxis;
- keys.forEach(function (key) {
- breaks = brokenAxis_1 && brokenAxis_1.breakArray || [];
- threshold = axis.isXAxis ?
- axis.min :
- pick(series.options.threshold, axis.min);
- points.forEach(function (point) {
- y = pick(point['stack' + key.toUpperCase()], point[key]);
- breaks.forEach(function (brk) {
- if (isNumber(threshold) && isNumber(y)) {
- eventName = false;
- if ((threshold < brk.from && y > brk.to) ||
- (threshold > brk.from && y < brk.from)) {
- eventName = 'pointBreak';
- }
- else if ((threshold < brk.from && y > brk.from && y < brk.to) ||
- (threshold > brk.from && y > brk.to && y < brk.from)) {
- eventName = 'pointInBreak';
- }
- if (eventName) {
- fireEvent(axis, eventName, { point: point, brk: brk });
- }
- }
- });
- });
- });
- }
- };
- /**
- * Extend getGraphPath by identifying gaps in the data so that we can
- * draw a gap in the line or area. This was moved from ordinal axis
- * module to broken axis module as of #5045.
- *
- * @private
- * @function Highcharts.Series#gappedPath
- *
- * @return {Highcharts.SVGPathArray}
- * Gapped path
- */
- seriesProto.gappedPath = function () {
- var currentDataGrouping = this.currentDataGrouping, groupingSize = currentDataGrouping && currentDataGrouping.gapSize, gapSize = this.options.gapSize, points = this.points.slice(), i = points.length - 1, yAxis = this.yAxis, stack;
- /**
- * Defines when to display a gap in the graph, together with the
- * [gapUnit](plotOptions.series.gapUnit) option.
- *
- * In case when `dataGrouping` is enabled, points can be grouped
- * into a larger time span. This can make the grouped points to have
- * a greater distance than the absolute value of `gapSize` property,
- * which will result in disappearing graph completely. To prevent
- * this situation the mentioned distance between grouped points is
- * used instead of previously defined `gapSize`.
- *
- * In practice, this option is most often used to visualize gaps in
- * time series. In a stock chart, intraday data is available for
- * daytime hours, while gaps will appear in nights and weekends.
- *
- * @see [gapUnit](plotOptions.series.gapUnit)
- * @see [xAxis.breaks](#xAxis.breaks)
- *
- * @sample {highstock} stock/plotoptions/series-gapsize/
- * Setting the gap size to 2 introduces gaps for weekends
- * in daily datasets.
- *
- * @type {number}
- * @default 0
- * @product highstock
- * @requires modules/broken-axis
- * @apioption plotOptions.series.gapSize
- */
- /**
- * Together with [gapSize](plotOptions.series.gapSize), this option
- * defines where to draw gaps in the graph.
- *
- * When the `gapUnit` is `"relative"` (default), a gap size of 5
- * means that if the distance between two points is greater than
- * 5 times that of the two closest points, the graph will be broken.
- *
- * When the `gapUnit` is `"value"`, the gap is based on absolute
- * axis values, which on a datetime axis is milliseconds. This also
- * applies to the navigator series that inherits gap options from
- * the base series.
- *
- * @see [gapSize](plotOptions.series.gapSize)
- *
- * @type {string}
- * @default relative
- * @since 5.0.13
- * @product highstock
- * @validvalue ["relative", "value"]
- * @requires modules/broken-axis
- * @apioption plotOptions.series.gapUnit
- */
- if (gapSize && i > 0) { // #5008
- // Gap unit is relative
- if (this.options.gapUnit !== 'value') {
- gapSize *= this.basePointRange;
- }
- // Setting a new gapSize in case dataGrouping is enabled (#7686)
- if (groupingSize &&
- groupingSize > gapSize &&
- // Except when DG is forced (e.g. from other series)
- // and has lower granularity than actual points (#11351)
- groupingSize >= this.basePointRange) {
- gapSize = groupingSize;
- }
- // extension for ordinal breaks
- var current = void 0, next = void 0;
- while (i--) {
- // Reassign next if it is not visible
- if (!(next && next.visible !== false)) {
- next = points[i + 1];
- }
- current = points[i];
- // Skip iteration if one of the points is not visible
- if (next.visible === false || current.visible === false) {
- continue;
- }
- if (next.x - current.x > gapSize) {
- var xRange = (current.x + next.x) / 2;
- points.splice(// insert after this one
- i + 1, 0, {
- isNull: true,
- x: xRange
- });
- // For stacked chart generate empty stack items, #6546
- if (yAxis.stacking && this.options.stacking) {
- stack = yAxis.stacking.stacks[this.stackKey][xRange] =
- new StackItem(yAxis, yAxis.options
- .stackLabels, false, xRange, this.stack);
- stack.total = 0;
- }
- }
- // Assign current to next for the upcoming iteration
- next = current;
- }
- }
- // Call base method
- return this.getGraphPath(points);
- };
- /* eslint-disable no-invalid-this */
- addEvent(AxisClass, 'init', function () {
- var axis = this;
- if (!axis.brokenAxis) {
- axis.brokenAxis = new BrokenAxisAdditions(axis);
- }
- });
- addEvent(AxisClass, 'afterInit', function () {
- if (typeof this.brokenAxis !== 'undefined') {
- this.brokenAxis.setBreaks(this.options.breaks, false);
- }
- });
- addEvent(AxisClass, 'afterSetTickPositions', function () {
- var axis = this;
- var brokenAxis = axis.brokenAxis;
- if (brokenAxis &&
- brokenAxis.hasBreaks) {
- var tickPositions = this.tickPositions, info = this.tickPositions.info, newPositions = [], i;
- for (i = 0; i < tickPositions.length; i++) {
- if (!brokenAxis.isInAnyBreak(tickPositions[i])) {
- newPositions.push(tickPositions[i]);
- }
- }
- this.tickPositions = newPositions;
- this.tickPositions.info = info;
- }
- });
- // Force Axis to be not-ordinal when breaks are defined
- addEvent(AxisClass, 'afterSetOptions', function () {
- if (this.brokenAxis && this.brokenAxis.hasBreaks) {
- this.options.ordinal = false;
- }
- });
- addEvent(SeriesClass, 'afterGeneratePoints', function () {
- var _a = this, isDirty = _a.isDirty, connectNulls = _a.options.connectNulls, points = _a.points, xAxis = _a.xAxis, yAxis = _a.yAxis;
- // Set, or reset visibility of the points. Axis.setBreaks marks the
- // series as isDirty
- if (isDirty) {
- var i = points.length;
- while (i--) {
- var point = points[i];
- // Respect nulls inside the break (#4275)
- var nullGap = point.y === null && connectNulls === false;
- var isPointInBreak = (!nullGap && ((xAxis &&
- xAxis.brokenAxis &&
- xAxis.brokenAxis.isInAnyBreak(point.x, true)) || (yAxis &&
- yAxis.brokenAxis &&
- yAxis.brokenAxis.isInAnyBreak(point.y, true))));
- // Set point.visible if in any break.
- // If not in break, reset visible to original value.
- point.visible = isPointInBreak ?
- false :
- point.options.visible !== false;
- }
- }
- });
- addEvent(SeriesClass, 'afterRender', function drawPointsWrapped() {
- this.drawBreaks(this.xAxis, ['x']);
- this.drawBreaks(this.yAxis, pick(this.pointArrayMap, ['y']));
- });
- };
- return BrokenAxis;
- }());
- BrokenAxis.compose(Axis, Series); // @todo remove automatism
- return BrokenAxis;
- });
- _registerModule(_modules, 'masters/modules/broken-axis.src.js', [], function () {
- });
- _registerModule(_modules, 'parts/DataGrouping.js', [_modules['parts/DateTimeAxis.js'], _modules['parts/Globals.js'], _modules['parts/Options.js'], _modules['parts/Point.js'], _modules['parts/Tooltip.js'], _modules['parts/Utilities.js']], function (DateTimeAxis, H, O, Point, Tooltip, U) {
- /* *
- *
- * (c) 2010-2020 Torstein Honsi
- *
- * License: www.highcharts.com/license
- *
- * !!!!!!! SOURCE GETS TRANSPILED BY TYPESCRIPT. EDIT TS FILE ONLY. !!!!!!!
- *
- * */
- /**
- * @typedef {"average"|"averages"|"open"|"high"|"low"|"close"|"sum"} Highcharts.DataGroupingApproximationValue
- */
- /**
- * @interface Highcharts.DataGroupingInfoObject
- */ /**
- * @name Highcharts.DataGroupingInfoObject#length
- * @type {number}
- */ /**
- * @name Highcharts.DataGroupingInfoObject#options
- * @type {Highcharts.SeriesOptionsType|undefined}
- */ /**
- * @name Highcharts.DataGroupingInfoObject#start
- * @type {number}
- */
- ''; // detach doclets above
- var defaultOptions = O.defaultOptions;
- var addEvent = U.addEvent, arrayMax = U.arrayMax, arrayMin = U.arrayMin, correctFloat = U.correctFloat, defined = U.defined, error = U.error, extend = U.extend, format = U.format, isNumber = U.isNumber, merge = U.merge, pick = U.pick;
- var Axis = H.Axis, Series = H.Series;
- /* ************************************************************************** *
- * Start data grouping module *
- * ************************************************************************** */
- /* eslint-disable no-invalid-this, valid-jsdoc */
- /**
- * Define the available approximation types. The data grouping
- * approximations takes an array or numbers as the first parameter. In case
- * of ohlc, four arrays are sent in as four parameters. Each array consists
- * only of numbers. In case null values belong to the group, the property
- * .hasNulls will be set to true on the array.
- *
- * @product highstock
- *
- * @private
- * @name Highcharts.approximations
- * @type {Highcharts.Dictionary<Function>}
- */
- var approximations = H.approximations = {
- sum: function (arr) {
- var len = arr.length, ret;
- // 1. it consists of nulls exclusive
- if (!len && arr.hasNulls) {
- ret = null;
- // 2. it has a length and real values
- }
- else if (len) {
- ret = 0;
- while (len--) {
- ret += arr[len];
- }
- }
- // 3. it has zero length, so just return undefined
- // => doNothing()
- return ret;
- },
- average: function (arr) {
- var len = arr.length, ret = approximations.sum(arr);
- // If we have a number, return it divided by the length. If not,
- // return null or undefined based on what the sum method finds.
- if (isNumber(ret) && len) {
- ret = correctFloat(ret / len);
- }
- return ret;
- },
- // The same as average, but for series with multiple values, like area
- // ranges.
- averages: function () {
- var ret = [];
- [].forEach.call(arguments, function (arr) {
- ret.push(approximations.average(arr));
- });
- // Return undefined when first elem. is undefined and let
- // sum method handle null (#7377)
- return typeof ret[0] === 'undefined' ? void 0 : ret;
- },
- open: function (arr) {
- return arr.length ? arr[0] : (arr.hasNulls ? null : void 0);
- },
- high: function (arr) {
- return arr.length ?
- arrayMax(arr) :
- (arr.hasNulls ? null : void 0);
- },
- low: function (arr) {
- return arr.length ?
- arrayMin(arr) :
- (arr.hasNulls ? null : void 0);
- },
- close: function (arr) {
- return arr.length ?
- arr[arr.length - 1] :
- (arr.hasNulls ? null : void 0);
- },
- // ohlc and range are special cases where a multidimensional array is
- // input and an array is output
- ohlc: function (open, high, low, close) {
- open = approximations.open(open);
- high = approximations.high(high);
- low = approximations.low(low);
- close = approximations.close(close);
- if (isNumber(open) ||
- isNumber(high) ||
- isNumber(low) ||
- isNumber(close)) {
- return [open, high, low, close];
- }
- // else, return is undefined
- },
- range: function (low, high) {
- low = approximations.low(low);
- high = approximations.high(high);
- if (isNumber(low) || isNumber(high)) {
- return [low, high];
- }
- if (low === null && high === null) {
- return null;
- }
- // else, return is undefined
- }
- };
- var groupData = function (xData, yData, groupPositions, approximation) {
- var series = this, data = series.data, dataOptions = series.options && series.options.data, groupedXData = [], groupedYData = [], groupMap = [], dataLength = xData.length, pointX, pointY, groupedY,
- // when grouping the fake extended axis for panning,
- // we don't need to consider y
- handleYData = !!yData, values = [], approximationFn, pointArrayMap = series.pointArrayMap, pointArrayMapLength = pointArrayMap && pointArrayMap.length, extendedPointArrayMap = ['x'].concat(pointArrayMap || ['y']), pos = 0, start = 0, valuesLen, i, j;
- /**
- * @private
- */
- function getApproximation(approx) {
- if (typeof approx === 'function') {
- return approx;
- }
- if (approximations[approx]) {
- return approximations[approx];
- }
- return approximations[(series.getDGApproximation && series.getDGApproximation()) ||
- 'average'];
- }
- approximationFn = getApproximation(approximation);
- // Calculate values array size from pointArrayMap length
- if (pointArrayMapLength) {
- pointArrayMap.forEach(function () {
- values.push([]);
- });
- }
- else {
- values.push([]);
- }
- valuesLen = pointArrayMapLength || 1;
- // Start with the first point within the X axis range (#2696)
- for (i = 0; i <= dataLength; i++) {
- if (xData[i] >= groupPositions[0]) {
- break;
- }
- }
- for (i; i <= dataLength; i++) {
- // when a new group is entered, summarize and initialize
- // the previous group
- while ((typeof groupPositions[pos + 1] !== 'undefined' &&
- xData[i] >= groupPositions[pos + 1]) ||
- i === dataLength) { // get the last group
- // get group x and y
- pointX = groupPositions[pos];
- series.dataGroupInfo = {
- start: series.cropStart + start,
- length: values[0].length
- };
- groupedY = approximationFn.apply(series, values);
- // By default, let options of the first grouped point be passed over
- // to the grouped point. This allows preserving properties like
- // `name` and `color` or custom properties. Implementers can
- // override this from the approximation function, where they can
- // write custom options to `this.dataGroupInfo.options`.
- if (series.pointClass && !defined(series.dataGroupInfo.options)) {
- // Convert numbers and arrays into objects
- series.dataGroupInfo.options = merge(series.pointClass.prototype
- .optionsToObject.call({ series: series }, series.options.data[series.cropStart + start]));
- // Make sure the raw data (x, y, open, high etc) is not copied
- // over and overwriting approximated data.
- extendedPointArrayMap.forEach(function (key) {
- delete series.dataGroupInfo.options[key];
- });
- }
- // push the grouped data
- if (typeof groupedY !== 'undefined') {
- groupedXData.push(pointX);
- groupedYData.push(groupedY);
- groupMap.push(series.dataGroupInfo);
- }
- // reset the aggregate arrays
- start = i;
- for (j = 0; j < valuesLen; j++) {
- values[j].length = 0; // faster than values[j] = []
- values[j].hasNulls = false;
- }
- // Advance on the group positions
- pos += 1;
- // don't loop beyond the last group
- if (i === dataLength) {
- break;
- }
- }
- // break out
- if (i === dataLength) {
- break;
- }
- // for each raw data point, push it to an array that contains all values
- // for this specific group
- if (pointArrayMap) {
- var index = series.cropStart + i, point = (data && data[index]) ||
- series.pointClass.prototype.applyOptions.apply({
- series: series
- }, [dataOptions[index]]), val;
- for (j = 0; j < pointArrayMapLength; j++) {
- val = point[pointArrayMap[j]];
- if (isNumber(val)) {
- values[j].push(val);
- }
- else if (val === null) {
- values[j].hasNulls = true;
- }
- }
- }
- else {
- pointY = handleYData ? yData[i] : null;
- if (isNumber(pointY)) {
- values[0].push(pointY);
- }
- else if (pointY === null) {
- values[0].hasNulls = true;
- }
- }
- }
- return {
- groupedXData: groupedXData,
- groupedYData: groupedYData,
- groupMap: groupMap
- };
- };
- var dataGrouping = {
- approximations: approximations,
- groupData: groupData
- };
- // -----------------------------------------------------------------------------
- // The following code applies to implementation of data grouping on a Series
- var seriesProto = Series.prototype, baseProcessData = seriesProto.processData, baseGeneratePoints = seriesProto.generatePoints,
- /** @ignore */
- commonOptions = {
- // enabled: null, // (true for stock charts, false for basic),
- // forced: undefined,
- groupPixelWidth: 2,
- // the first one is the point or start value, the second is the start
- // value if we're dealing with range, the third one is the end value if
- // dealing with a range
- dateTimeLabelFormats: {
- millisecond: [
- '%A, %b %e, %H:%M:%S.%L',
- '%A, %b %e, %H:%M:%S.%L',
- '-%H:%M:%S.%L'
- ],
- second: [
- '%A, %b %e, %H:%M:%S',
- '%A, %b %e, %H:%M:%S',
- '-%H:%M:%S'
- ],
- minute: [
- '%A, %b %e, %H:%M',
- '%A, %b %e, %H:%M',
- '-%H:%M'
- ],
- hour: [
- '%A, %b %e, %H:%M',
- '%A, %b %e, %H:%M',
- '-%H:%M'
- ],
- day: [
- '%A, %b %e, %Y',
- '%A, %b %e',
- '-%A, %b %e, %Y'
- ],
- week: [
- 'Week from %A, %b %e, %Y',
- '%A, %b %e',
- '-%A, %b %e, %Y'
- ],
- month: [
- '%B %Y',
- '%B',
- '-%B %Y'
- ],
- year: [
- '%Y',
- '%Y',
- '-%Y'
- ]
- }
- // smoothed = false, // enable this for navigator series only
- }, specificOptions = {
- line: {},
- spline: {},
- area: {},
- areaspline: {},
- arearange: {},
- column: {
- groupPixelWidth: 10
- },
- columnrange: {
- groupPixelWidth: 10
- },
- candlestick: {
- groupPixelWidth: 10
- },
- ohlc: {
- groupPixelWidth: 5
- }
- },
- // units are defined in a separate array to allow complete overriding in
- // case of a user option
- defaultDataGroupingUnits = H.defaultDataGroupingUnits = [
- [
- 'millisecond',
- [1, 2, 5, 10, 20, 25, 50, 100, 200, 500] // allowed multiples
- ], [
- 'second',
- [1, 2, 5, 10, 15, 30]
- ], [
- 'minute',
- [1, 2, 5, 10, 15, 30]
- ], [
- 'hour',
- [1, 2, 3, 4, 6, 8, 12]
- ], [
- 'day',
- [1]
- ], [
- 'week',
- [1]
- ], [
- 'month',
- [1, 3, 6]
- ], [
- 'year',
- null
- ]
- ];
- // Set default approximations to the prototypes if present. Properties are
- // inherited down. Can be overridden for individual series types.
- seriesProto.getDGApproximation = function () {
- if (this.is('arearange')) {
- return 'range';
- }
- if (this.is('ohlc')) {
- return 'ohlc';
- }
- if (this.is('column')) {
- return 'sum';
- }
- return 'average';
- };
- /**
- * Takes parallel arrays of x and y data and groups the data into intervals
- * defined by groupPositions, a collection of starting x values for each group.
- *
- * @private
- * @function Highcharts.Series#groupData
- *
- * @param {Array<number>} xData
- *
- * @param {Array<number>|Array<Array<number>>} yData
- *
- * @param {boolean} groupPositions
- *
- * @param {string|Function} approximation
- *
- * @return {void}
- */
- seriesProto.groupData = groupData;
- // Extend the basic processData method, that crops the data to the current zoom
- // range, with data grouping logic.
- seriesProto.processData = function () {
- var series = this, chart = series.chart, options = series.options, dataGroupingOptions = options.dataGrouping, groupingEnabled = series.allowDG !== false && dataGroupingOptions &&
- pick(dataGroupingOptions.enabled, chart.options.isStock), visible = (series.visible || !chart.options.chart.ignoreHiddenSeries), hasGroupedData, skip, lastDataGrouping = this.currentDataGrouping, currentDataGrouping, croppedData, revertRequireSorting = false;
- // Run base method
- series.forceCrop = groupingEnabled; // #334
- series.groupPixelWidth = null; // #2110
- series.hasProcessed = true; // #2692
- // Data needs to be sorted for dataGrouping
- if (groupingEnabled && !series.requireSorting) {
- series.requireSorting = revertRequireSorting = true;
- }
- // Skip if processData returns false or if grouping is disabled (in that
- // order)
- skip = (baseProcessData.apply(series, arguments) === false ||
- !groupingEnabled);
- // Revert original requireSorting value if changed
- if (revertRequireSorting) {
- series.requireSorting = false;
- }
- if (!skip) {
- series.destroyGroupedData();
- var i, processedXData = dataGroupingOptions.groupAll ?
- series.xData :
- series.processedXData, processedYData = dataGroupingOptions.groupAll ?
- series.yData :
- series.processedYData, plotSizeX = chart.plotSizeX, xAxis = series.xAxis, ordinal = xAxis.options.ordinal, groupPixelWidth = series.groupPixelWidth =
- xAxis.getGroupPixelWidth && xAxis.getGroupPixelWidth();
- // Execute grouping if the amount of points is greater than the limit
- // defined in groupPixelWidth
- if (groupPixelWidth) {
- hasGroupedData = true;
- // Force recreation of point instances in series.translate, #5699
- series.isDirty = true;
- series.points = null; // #6709
- var extremes = xAxis.getExtremes(), xMin = extremes.min, xMax = extremes.max, groupIntervalFactor = (ordinal &&
- xAxis.ordinal &&
- xAxis.ordinal.getGroupIntervalFactor(xMin, xMax, series)) || 1, interval = (groupPixelWidth * (xMax - xMin) / plotSizeX) *
- groupIntervalFactor, groupPositions = xAxis.getTimeTicks(DateTimeAxis.AdditionsClass.prototype.normalizeTimeTickInterval(interval, dataGroupingOptions.units ||
- defaultDataGroupingUnits),
- // Processed data may extend beyond axis (#4907)
- Math.min(xMin, processedXData[0]), Math.max(xMax, processedXData[processedXData.length - 1]), xAxis.options.startOfWeek, processedXData, series.closestPointRange), groupedData = seriesProto.groupData.apply(series, [
- processedXData,
- processedYData,
- groupPositions,
- dataGroupingOptions.approximation
- ]), groupedXData = groupedData.groupedXData, groupedYData = groupedData.groupedYData, gapSize = 0;
- // Prevent the smoothed data to spill out left and right, and make
- // sure data is not shifted to the left
- if (dataGroupingOptions.smoothed && groupedXData.length) {
- i = groupedXData.length - 1;
- groupedXData[i] = Math.min(groupedXData[i], xMax);
- while (i-- && i > 0) {
- groupedXData[i] += interval / 2;
- }
- groupedXData[0] = Math.max(groupedXData[0], xMin);
- }
- // Record what data grouping values were used
- for (i = 1; i < groupPositions.length; i++) {
- // The grouped gapSize needs to be the largest distance between
- // the group to capture varying group sizes like months or DST
- // crossing (#10000). Also check that the gap is not at the
- // start of a segment.
- if (!groupPositions.info.segmentStarts ||
- groupPositions.info.segmentStarts.indexOf(i) === -1) {
- gapSize = Math.max(groupPositions[i] - groupPositions[i - 1], gapSize);
- }
- }
- currentDataGrouping = groupPositions.info;
- currentDataGrouping.gapSize = gapSize;
- series.closestPointRange = groupPositions.info.totalRange;
- series.groupMap = groupedData.groupMap;
- // Make sure the X axis extends to show the first group (#2533)
- // But only for visible series (#5493, #6393)
- if (defined(groupedXData[0]) &&
- groupedXData[0] < xAxis.min &&
- visible) {
- if ((!defined(xAxis.options.min) &&
- xAxis.min <= xAxis.dataMin) ||
- xAxis.min === xAxis.dataMin) {
- xAxis.min = Math.min(groupedXData[0], xAxis.min);
- }
- xAxis.dataMin = Math.min(groupedXData[0], xAxis.dataMin);
- }
- // We calculated all group positions but we should render
- // only the ones within the visible range
- if (dataGroupingOptions.groupAll) {
- croppedData = series.cropData(groupedXData, groupedYData, xAxis.min, xAxis.max, 1 // Ordinal xAxis will remove left-most points otherwise
- );
- groupedXData = croppedData.xData;
- groupedYData = croppedData.yData;
- }
- // Set series props
- series.processedXData = groupedXData;
- series.processedYData = groupedYData;
- }
- else {
- series.groupMap = null;
- }
- series.hasGroupedData = hasGroupedData;
- series.currentDataGrouping = currentDataGrouping;
- series.preventGraphAnimation =
- (lastDataGrouping && lastDataGrouping.totalRange) !==
- (currentDataGrouping && currentDataGrouping.totalRange);
- }
- };
- // Destroy the grouped data points. #622, #740
- seriesProto.destroyGroupedData = function () {
- // Clear previous groups
- if (this.groupedData) {
- this.groupedData.forEach(function (point, i) {
- if (point) {
- this.groupedData[i] = point.destroy ?
- point.destroy() : null;
- }
- }, this);
- // Clears all:
- // - `this.groupedData`
- // - `this.points`
- // - `preserve` object in series.update()
- this.groupedData.length = 0;
- }
- };
- // Override the generatePoints method by adding a reference to grouped data
- seriesProto.generatePoints = function () {
- baseGeneratePoints.apply(this);
- // Record grouped data in order to let it be destroyed the next time
- // processData runs
- this.destroyGroupedData(); // #622
- this.groupedData = this.hasGroupedData ? this.points : null;
- };
- // Override point prototype to throw a warning when trying to update grouped
- // points.
- addEvent(Point, 'update', function () {
- if (this.dataGroup) {
- error(24, false, this.series.chart);
- return false;
- }
- });
- // Extend the original method, make the tooltip's header reflect the grouped
- // range.
- addEvent(Tooltip, 'headerFormatter', function (e) {
- var tooltip = this, chart = this.chart, time = chart.time, labelConfig = e.labelConfig, series = labelConfig.series, options = series.options, tooltipOptions = series.tooltipOptions, dataGroupingOptions = options.dataGrouping, xDateFormat = tooltipOptions.xDateFormat, xDateFormatEnd, xAxis = series.xAxis, currentDataGrouping, dateTimeLabelFormats, labelFormats, formattedKey, formatString = tooltipOptions[(e.isFooter ? 'footer' : 'header') + 'Format'];
- // apply only to grouped series
- if (xAxis &&
- xAxis.options.type === 'datetime' &&
- dataGroupingOptions &&
- isNumber(labelConfig.key)) {
- // set variables
- currentDataGrouping = series.currentDataGrouping;
- dateTimeLabelFormats = dataGroupingOptions.dateTimeLabelFormats ||
- // Fallback to commonOptions (#9693)
- commonOptions.dateTimeLabelFormats;
- // if we have grouped data, use the grouping information to get the
- // right format
- if (currentDataGrouping) {
- labelFormats =
- dateTimeLabelFormats[currentDataGrouping.unitName];
- if (currentDataGrouping.count === 1) {
- xDateFormat = labelFormats[0];
- }
- else {
- xDateFormat = labelFormats[1];
- xDateFormatEnd = labelFormats[2];
- }
- // if not grouped, and we don't have set the xDateFormat option, get the
- // best fit, so if the least distance between points is one minute, show
- // it, but if the least distance is one day, skip hours and minutes etc.
- }
- else if (!xDateFormat && dateTimeLabelFormats) {
- xDateFormat = tooltip.getXDateFormat(labelConfig, tooltipOptions, xAxis);
- }
- // now format the key
- formattedKey = time.dateFormat(xDateFormat, labelConfig.key);
- if (xDateFormatEnd) {
- formattedKey += time.dateFormat(xDateFormatEnd, labelConfig.key + currentDataGrouping.totalRange - 1);
- }
- // Replace default header style with class name
- if (series.chart.styledMode) {
- formatString = this.styledModeFormat(formatString);
- }
- // return the replaced format
- e.text = format(formatString, {
- point: extend(labelConfig.point, { key: formattedKey }),
- series: series
- }, chart);
- e.preventDefault();
- }
- });
- // Destroy grouped data on series destroy
- addEvent(Series, 'destroy', seriesProto.destroyGroupedData);
- // Handle default options for data grouping. This must be set at runtime because
- // some series types are defined after this.
- addEvent(Series, 'afterSetOptions', function (e) {
- var options = e.options, type = this.type, plotOptions = this.chart.options.plotOptions, defaultOptions = O.defaultOptions.plotOptions[type].dataGrouping,
- // External series, for example technical indicators should also
- // inherit commonOptions which are not available outside this module
- baseOptions = this.useCommonDataGrouping && commonOptions;
- if (specificOptions[type] || baseOptions) { // #1284
- if (!defaultOptions) {
- defaultOptions = merge(commonOptions, specificOptions[type]);
- }
- options.dataGrouping = merge(baseOptions, defaultOptions, plotOptions.series && plotOptions.series.dataGrouping, // #1228
- // Set by the StockChart constructor:
- plotOptions[type].dataGrouping, this.userOptions.dataGrouping);
- }
- });
- // When resetting the scale reset the hasProccessed flag to avoid taking
- // previous data grouping of neighbour series into accound when determining
- // group pixel width (#2692).
- addEvent(Axis, 'afterSetScale', function () {
- this.series.forEach(function (series) {
- series.hasProcessed = false;
- });
- });
- // Get the data grouping pixel width based on the greatest defined individual
- // width of the axis' series, and if whether one of the axes need grouping.
- Axis.prototype.getGroupPixelWidth = function () {
- var series = this.series, len = series.length, i, groupPixelWidth = 0, doGrouping = false, dataLength, dgOptions;
- // If multiple series are compared on the same x axis, give them the same
- // group pixel width (#334)
- i = len;
- while (i--) {
- dgOptions = series[i].options.dataGrouping;
- if (dgOptions) {
- groupPixelWidth = Math.max(groupPixelWidth,
- // Fallback to commonOptions (#9693)
- pick(dgOptions.groupPixelWidth, commonOptions.groupPixelWidth));
- }
- }
- // If one of the series needs grouping, apply it to all (#1634)
- i = len;
- while (i--) {
- dgOptions = series[i].options.dataGrouping;
- if (dgOptions && series[i].hasProcessed) { // #2692
- dataLength = (series[i].processedXData || series[i].data).length;
- // Execute grouping if the amount of points is greater than the
- // limit defined in groupPixelWidth
- if (series[i].groupPixelWidth ||
- dataLength >
- (this.chart.plotSizeX / groupPixelWidth) ||
- (dataLength && dgOptions.forced)) {
- doGrouping = true;
- }
- }
- }
- return doGrouping ? groupPixelWidth : 0;
- };
- /**
- * Highstock only. Force data grouping on all the axis' series.
- *
- * @product highstock
- *
- * @function Highcharts.Axis#setDataGrouping
- *
- * @param {boolean|Highcharts.DataGroupingOptionsObject} [dataGrouping]
- * A `dataGrouping` configuration. Use `false` to disable data grouping
- * dynamically.
- *
- * @param {boolean} [redraw=true]
- * Whether to redraw the chart or wait for a later call to
- * {@link Chart#redraw}.
- *
- * @return {void}
- */
- Axis.prototype.setDataGrouping = function (dataGrouping, redraw) {
- var axis = this;
- var i;
- redraw = pick(redraw, true);
- if (!dataGrouping) {
- dataGrouping = {
- forced: false,
- units: null
- };
- }
- // Axis is instantiated, update all series
- if (this instanceof Axis) {
- i = this.series.length;
- while (i--) {
- this.series[i].update({
- dataGrouping: dataGrouping
- }, false);
- }
- // Axis not yet instanciated, alter series options
- }
- else {
- this.chart.options.series.forEach(function (seriesOptions) {
- seriesOptions.dataGrouping = dataGrouping;
- }, false);
- }
- // Clear ordinal slope, so we won't accidentaly use the old one (#7827)
- if (axis.ordinal) {
- axis.ordinal.slope = void 0;
- }
- if (redraw) {
- this.chart.redraw();
- }
- };
- H.dataGrouping = dataGrouping;
- /* eslint-enable no-invalid-this, valid-jsdoc */
- /**
- * Data grouping is the concept of sampling the data values into larger
- * blocks in order to ease readability and increase performance of the
- * JavaScript charts. Highstock by default applies data grouping when
- * the points become closer than a certain pixel value, determined by
- * the `groupPixelWidth` option.
- *
- * If data grouping is applied, the grouping information of grouped
- * points can be read from the [Point.dataGroup](
- * /class-reference/Highcharts.Point#dataGroup). If point options other than
- * the data itself are set, for example `name` or `color` or custom properties,
- * the grouping logic doesn't know how to group it. In this case the options of
- * the first point instance are copied over to the group point. This can be
- * altered through a custom `approximation` callback function.
- *
- * @declare Highcharts.DataGroupingOptionsObject
- * @product highstock
- * @requires product:highstock
- * @requires module:modules/datagrouping
- * @apioption plotOptions.series.dataGrouping
- */
- /**
- * The method of approximation inside a group. When for example 30 days
- * are grouped into one month, this determines what value should represent
- * the group. Possible values are "average", "averages", "open", "high",
- * "low", "close" and "sum". For OHLC and candlestick series the approximation
- * is "ohlc" by default, which finds the open, high, low and close values
- * within all the grouped data. For ranges, the approximation is "range",
- * which finds the low and high values. For multi-dimensional data,
- * like ranges and OHLC, "averages" will compute the average for each
- * dimension.
- *
- * Custom aggregate methods can be added by assigning a callback function
- * as the approximation. This function takes a numeric array as the
- * argument and should return a single numeric value or `null`. Note
- * that the numeric array will never contain null values, only true
- * numbers. Instead, if null values are present in the raw data, the
- * numeric array will have an `.hasNulls` property set to `true`. For
- * single-value data sets the data is available in the first argument
- * of the callback function. For OHLC data sets, all the open values
- * are in the first argument, all high values in the second etc.
- *
- * Since v4.2.7, grouping meta data is available in the approximation
- * callback from `this.dataGroupInfo`. It can be used to extract information
- * from the raw data.
- *
- * Defaults to `average` for line-type series, `sum` for columns, `range`
- * for range series and `ohlc` for OHLC and candlestick.
- *
- * @sample {highstock} stock/plotoptions/series-datagrouping-approximation
- * Approximation callback with custom data
- *
- * @type {Highcharts.DataGroupingApproximationValue|Function}
- * @apioption plotOptions.series.dataGrouping.approximation
- */
- /**
- * Datetime formats for the header of the tooltip in a stock chart.
- * The format can vary within a chart depending on the currently selected
- * time range and the current data grouping.
- *
- * The default formats are:
- * ```js
- * {
- * millisecond: [
- * '%A, %b %e, %H:%M:%S.%L', '%A, %b %e, %H:%M:%S.%L', '-%H:%M:%S.%L'
- * ],
- * second: ['%A, %b %e, %H:%M:%S', '%A, %b %e, %H:%M:%S', '-%H:%M:%S'],
- * minute: ['%A, %b %e, %H:%M', '%A, %b %e, %H:%M', '-%H:%M'],
- * hour: ['%A, %b %e, %H:%M', '%A, %b %e, %H:%M', '-%H:%M'],
- * day: ['%A, %b %e, %Y', '%A, %b %e', '-%A, %b %e, %Y'],
- * week: ['Week from %A, %b %e, %Y', '%A, %b %e', '-%A, %b %e, %Y'],
- * month: ['%B %Y', '%B', '-%B %Y'],
- * year: ['%Y', '%Y', '-%Y']
- * }
- * ```
- *
- * For each of these array definitions, the first item is the format
- * used when the active time span is one unit. For instance, if the
- * current data applies to one week, the first item of the week array
- * is used. The second and third items are used when the active time
- * span is more than two units. For instance, if the current data applies
- * to two weeks, the second and third item of the week array are used,
- * and applied to the start and end date of the time span.
- *
- * @type {object}
- * @apioption plotOptions.series.dataGrouping.dateTimeLabelFormats
- */
- /**
- * Enable or disable data grouping.
- *
- * @type {boolean}
- * @default true
- * @apioption plotOptions.series.dataGrouping.enabled
- */
- /**
- * When data grouping is forced, it runs no matter how small the intervals
- * are. This can be handy for example when the sum should be calculated
- * for values appearing at random times within each hour.
- *
- * @type {boolean}
- * @default false
- * @apioption plotOptions.series.dataGrouping.forced
- */
- /**
- * The approximate pixel width of each group. If for example a series
- * with 30 points is displayed over a 600 pixel wide plot area, no grouping
- * is performed. If however the series contains so many points that
- * the spacing is less than the groupPixelWidth, Highcharts will try
- * to group it into appropriate groups so that each is more or less
- * two pixels wide. If multiple series with different group pixel widths
- * are drawn on the same x axis, all series will take the greatest width.
- * For example, line series have 2px default group width, while column
- * series have 10px. If combined, both the line and the column will
- * have 10px by default.
- *
- * @type {number}
- * @default 2
- * @apioption plotOptions.series.dataGrouping.groupPixelWidth
- */
- /**
- * By default only points within the visible range are grouped. Enabling this
- * option will force data grouping to calculate all grouped points for a given
- * dataset. That option prevents for example a column series from calculating
- * a grouped point partially. The effect is similar to
- * [Series.getExtremesFromAll](#plotOptions.series.getExtremesFromAll) but does
- * not affect yAxis extremes.
- *
- * @sample {highstock} stock/plotoptions/series-datagrouping-groupall/
- * Two series with the same data but different groupAll setting
- *
- * @type {boolean}
- * @default false
- * @since 6.1.0
- * @apioption plotOptions.series.dataGrouping.groupAll
- */
- /**
- * Normally, a group is indexed by the start of that group, so for example
- * when 30 daily values are grouped into one month, that month's x value
- * will be the 1st of the month. This apparently shifts the data to
- * the left. When the smoothed option is true, this is compensated for.
- * The data is shifted to the middle of the group, and min and max
- * values are preserved. Internally, this is used in the Navigator series.
- *
- * @type {boolean}
- * @default false
- * @apioption plotOptions.series.dataGrouping.smoothed
- */
- /**
- * An array determining what time intervals the data is allowed to be
- * grouped to. Each array item is an array where the first value is
- * the time unit and the second value another array of allowed multiples.
- *
- * Defaults to:
- * ```js
- * units: [[
- * 'millisecond', // unit name
- * [1, 2, 5, 10, 20, 25, 50, 100, 200, 500] // allowed multiples
- * ], [
- * 'second',
- * [1, 2, 5, 10, 15, 30]
- * ], [
- * 'minute',
- * [1, 2, 5, 10, 15, 30]
- * ], [
- * 'hour',
- * [1, 2, 3, 4, 6, 8, 12]
- * ], [
- * 'day',
- * [1]
- * ], [
- * 'week',
- * [1]
- * ], [
- * 'month',
- * [1, 3, 6]
- * ], [
- * 'year',
- * null
- * ]]
- * ```
- *
- * @type {Array<Array<string,(Array<number>|null)>>}
- * @apioption plotOptions.series.dataGrouping.units
- */
- /**
- * The approximate pixel width of each group. If for example a series
- * with 30 points is displayed over a 600 pixel wide plot area, no grouping
- * is performed. If however the series contains so many points that
- * the spacing is less than the groupPixelWidth, Highcharts will try
- * to group it into appropriate groups so that each is more or less
- * two pixels wide. Defaults to `10`.
- *
- * @sample {highstock} stock/plotoptions/series-datagrouping-grouppixelwidth/
- * Two series with the same data density but different groupPixelWidth
- *
- * @type {number}
- * @default 10
- * @apioption plotOptions.column.dataGrouping.groupPixelWidth
- */
- ''; // required by JSDoc parsing
- return dataGrouping;
- });
- _registerModule(_modules, 'parts/OHLCSeries.js', [_modules['parts/Globals.js'], _modules['parts/Point.js'], _modules['parts/Utilities.js']], function (H, Point, U) {
- /* *
- *
- * (c) 2010-2020 Torstein Honsi
- *
- * License: www.highcharts.com/license
- *
- * !!!!!!! SOURCE GETS TRANSPILED BY TYPESCRIPT. EDIT TS FILE ONLY. !!!!!!!
- *
- * */
- var seriesType = U.seriesType;
- var seriesTypes = H.seriesTypes;
- /**
- * The ohlc series type.
- *
- * @private
- * @class
- * @name Highcharts.seriesTypes.ohlc
- *
- * @augments Highcharts.Series
- */
- seriesType('ohlc', 'column'
- /**
- * An OHLC chart is a style of financial chart used to describe price
- * movements over time. It displays open, high, low and close values per
- * data point.
- *
- * @sample stock/demo/ohlc/
- * OHLC chart
- *
- * @extends plotOptions.column
- * @excluding borderColor, borderRadius, borderWidth, crisp, stacking,
- * stack
- * @product highstock
- * @optionparent plotOptions.ohlc
- */
- , {
- /**
- * The approximate pixel width of each group. If for example a series
- * with 30 points is displayed over a 600 pixel wide plot area, no
- * grouping is performed. If however the series contains so many points
- * that the spacing is less than the groupPixelWidth, Highcharts will
- * try to group it into appropriate groups so that each is more or less
- * two pixels wide. Defaults to `5`.
- *
- * @type {number}
- * @default 5
- * @product highstock
- * @apioption plotOptions.ohlc.dataGrouping.groupPixelWidth
- */
- /**
- * The pixel width of the line/border. Defaults to `1`.
- *
- * @sample {highstock} stock/plotoptions/ohlc-linewidth/
- * A greater line width
- *
- * @type {number}
- * @default 1
- * @product highstock
- *
- * @private
- */
- lineWidth: 1,
- tooltip: {
- pointFormat: '<span style="color:{point.color}">\u25CF</span> ' +
- '<b> {series.name}</b><br/>' +
- 'Open: {point.open}<br/>' +
- 'High: {point.high}<br/>' +
- 'Low: {point.low}<br/>' +
- 'Close: {point.close}<br/>'
- },
- threshold: null,
- states: {
- /**
- * @extends plotOptions.column.states.hover
- * @product highstock
- */
- hover: {
- /**
- * The pixel width of the line representing the OHLC point.
- *
- * @type {number}
- * @default 3
- * @product highstock
- */
- lineWidth: 3
- }
- },
- /**
- * Determines which one of `open`, `high`, `low`, `close` values should
- * be represented as `point.y`, which is later used to set dataLabel
- * position and [compare](#plotOptions.series.compare).
- *
- * @sample {highstock} stock/plotoptions/ohlc-pointvalkey/
- * Possible values
- *
- * @type {string}
- * @default close
- * @validvalue ["open", "high", "low", "close"]
- * @product highstock
- * @apioption plotOptions.ohlc.pointValKey
- */
- /**
- * @default close
- * @apioption plotOptions.ohlc.colorKey
- */
- /**
- * Line color for up points.
- *
- * @type {Highcharts.ColorString|Highcharts.GradientColorObject|Highcharts.PatternObject}
- * @product highstock
- * @apioption plotOptions.ohlc.upColor
- */
- stickyTracking: true
- },
- /**
- * @lends Highcharts.seriesTypes.ohlc
- */
- {
- /* eslint-disable valid-jsdoc */
- directTouch: false,
- pointArrayMap: ['open', 'high', 'low', 'close'],
- toYData: function (point) {
- // return a plain array for speedy calculation
- return [point.open, point.high, point.low, point.close];
- },
- pointValKey: 'close',
- pointAttrToOptions: {
- stroke: 'color',
- 'stroke-width': 'lineWidth'
- },
- /**
- * @private
- * @function Highcarts.seriesTypes.ohlc#init
- * @return {void}
- */
- init: function () {
- seriesTypes.column.prototype.init.apply(this, arguments);
- this.options.stacking = void 0; // #8817
- },
- /**
- * Postprocess mapping between options and SVG attributes
- *
- * @private
- * @function Highcharts.seriesTypes.ohlc#pointAttribs
- * @param {Highcharts.OHLCPoint} point
- * @param {string} state
- * @return {Highcharts.SVGAttributes}
- */
- pointAttribs: function (point, state) {
- var attribs = seriesTypes.column.prototype.pointAttribs.call(this, point, state), options = this.options;
- delete attribs.fill;
- if (!point.options.color &&
- options.upColor &&
- point.open < point.close) {
- attribs.stroke = options.upColor;
- }
- return attribs;
- },
- /**
- * Translate data points from raw values x and y to plotX and plotY
- *
- * @private
- * @function Highcharts.seriesTypes.ohlc#translate
- * @return {void}
- */
- translate: function () {
- var series = this, yAxis = series.yAxis, hasModifyValue = !!series.modifyValue, translated = [
- 'plotOpen',
- 'plotHigh',
- 'plotLow',
- 'plotClose',
- 'yBottom'
- ]; // translate OHLC for
- seriesTypes.column.prototype.translate.apply(series);
- // Do the translation
- series.points.forEach(function (point) {
- [point.open, point.high, point.low, point.close, point.low]
- .forEach(function (value, i) {
- if (value !== null) {
- if (hasModifyValue) {
- value = series.modifyValue(value);
- }
- point[translated[i]] =
- yAxis.toPixels(value, true);
- }
- });
- // Align the tooltip to the high value to avoid covering the
- // point
- point.tooltipPos[1] =
- point.plotHigh + yAxis.pos - series.chart.plotTop;
- });
- },
- /**
- * Draw the data points
- *
- * @private
- * @function Highcharts.seriesTypes.ohlc#drawPoints
- * @return {void}
- */
- drawPoints: function () {
- var series = this, points = series.points, chart = series.chart,
- /**
- * Extend vertical stem to open and close values.
- */
- extendStem = function (path, halfStrokeWidth, openOrClose) {
- var start = path[0];
- var end = path[1];
- // We don't need to worry about crisp - openOrClose value
- // is already crisped and halfStrokeWidth should remove it.
- if (typeof start[2] === 'number') {
- start[2] = Math.max(openOrClose + halfStrokeWidth, start[2]);
- }
- if (typeof end[2] === 'number') {
- end[2] = Math.min(openOrClose - halfStrokeWidth, end[2]);
- }
- };
- points.forEach(function (point) {
- var plotOpen, plotClose, crispCorr, halfWidth, path, graphic = point.graphic, crispX, isNew = !graphic, strokeWidth;
- if (typeof point.plotY !== 'undefined') {
- // Create and/or update the graphic
- if (!graphic) {
- point.graphic = graphic = chart.renderer.path()
- .add(series.group);
- }
- if (!chart.styledMode) {
- graphic.attr(series.pointAttribs(point, (point.selected && 'select'))); // #3897
- }
- // crisp vector coordinates
- strokeWidth = graphic.strokeWidth();
- crispCorr = (strokeWidth % 2) / 2;
- // #2596:
- crispX = Math.round(point.plotX) - crispCorr;
- halfWidth = Math.round(point.shapeArgs.width / 2);
- // the vertical stem
- path = [
- ['M', crispX, Math.round(point.yBottom)],
- ['L', crispX, Math.round(point.plotHigh)]
- ];
- // open
- if (point.open !== null) {
- plotOpen = Math.round(point.plotOpen) + crispCorr;
- path.push(['M', crispX, plotOpen], ['L', crispX - halfWidth, plotOpen]);
- extendStem(path, strokeWidth / 2, plotOpen);
- }
- // close
- if (point.close !== null) {
- plotClose = Math.round(point.plotClose) + crispCorr;
- path.push(['M', crispX, plotClose], ['L', crispX + halfWidth, plotClose]);
- extendStem(path, strokeWidth / 2, plotClose);
- }
- graphic[isNew ? 'attr' : 'animate']({ d: path })
- .addClass(point.getClassName(), true);
- }
- });
- },
- animate: null // Disable animation
- /* eslint-enable valid-jsdoc */
- },
- /**
- * @lends Highcharts.seriesTypes.ohlc.prototype.pointClass.prototype
- */
- {
- /* eslint-disable valid-jsdoc */
- /**
- * Extend the parent method by adding up or down to the class name.
- * @private
- * @function Highcharts.seriesTypes.ohlc#getClassName
- * @return {string}
- */
- getClassName: function () {
- return Point.prototype.getClassName.call(this) +
- (this.open < this.close ?
- ' highcharts-point-up' :
- ' highcharts-point-down');
- }
- /* eslint-enable valid-jsdoc */
- });
- /**
- * A `ohlc` series. If the [type](#series.ohlc.type) option is not
- * specified, it is inherited from [chart.type](#chart.type).
- *
- * @extends series,plotOptions.ohlc
- * @excluding dataParser, dataURL
- * @product highstock
- * @apioption series.ohlc
- */
- /**
- * An array of data points for the series. For the `ohlc` series type,
- * points can be given in the following ways:
- *
- * 1. An array of arrays with 5 or 4 values. In this case, the values correspond
- * to `x,open,high,low,close`. If the first value is a string, it is applied
- * as the name of the point, and the `x` value is inferred. The `x` value can
- * also be omitted, in which case the inner arrays should be of length 4\.
- * Then the `x` value is automatically calculated, either starting at 0 and
- * incremented by 1, or from `pointStart` and `pointInterval` given in the
- * series options.
- * ```js
- * data: [
- * [0, 6, 5, 6, 7],
- * [1, 9, 4, 8, 2],
- * [2, 6, 3, 4, 10]
- * ]
- * ```
- *
- * 2. An array of objects with named values. The following snippet shows only a
- * few settings, see the complete options set below. If the total number of
- * data points exceeds the series'
- * [turboThreshold](#series.ohlc.turboThreshold), this option is not
- * available.
- * ```js
- * data: [{
- * x: 1,
- * open: 3,
- * high: 4,
- * low: 5,
- * close: 2,
- * name: "Point2",
- * color: "#00FF00"
- * }, {
- * x: 1,
- * open: 4,
- * high: 3,
- * low: 6,
- * close: 7,
- * name: "Point1",
- * color: "#FF00FF"
- * }]
- * ```
- *
- * @type {Array<Array<(number|string),number,number,number>|Array<(number|string),number,number,number,number>|*>}
- * @extends series.arearange.data
- * @excluding y, marker
- * @product highstock
- * @apioption series.ohlc.data
- */
- /**
- * The closing value of each data point.
- *
- * @type {number}
- * @product highstock
- * @apioption series.ohlc.data.close
- */
- /**
- * The opening value of each data point.
- *
- * @type {number}
- * @product highstock
- * @apioption series.ohlc.data.open
- */
- ''; // adds doclets above to transpilat
- });
- _registerModule(_modules, 'parts/CandlestickSeries.js', [_modules['parts/Globals.js'], _modules['parts/Options.js'], _modules['parts/Utilities.js']], function (H, O, U) {
- /* *
- *
- * (c) 2010-2020 Torstein Honsi
- *
- * License: www.highcharts.com/license
- *
- * !!!!!!! SOURCE GETS TRANSPILED BY TYPESCRIPT. EDIT TS FILE ONLY. !!!!!!!
- *
- * */
- var defaultOptions = O.defaultOptions;
- var merge = U.merge, seriesType = U.seriesType;
- var seriesTypes = H.seriesTypes;
- /**
- * A candlestick chart is a style of financial chart used to describe price
- * movements over time.
- *
- * @sample stock/demo/candlestick/
- * Candlestick chart
- *
- * @extends plotOptions.ohlc
- * @excluding borderColor,borderRadius,borderWidth
- * @product highstock
- * @optionparent plotOptions.candlestick
- */
- var candlestickOptions = {
- /**
- * The specific line color for up candle sticks. The default is to inherit
- * the general `lineColor` setting.
- *
- * @sample {highstock} stock/plotoptions/candlestick-linecolor/
- * Candlestick line colors
- *
- * @type {Highcharts.ColorString|Highcharts.GradientColorObject|Highcharts.PatternObject}
- * @since 1.3.6
- * @product highstock
- * @apioption plotOptions.candlestick.upLineColor
- */
- /**
- * @type {Highcharts.DataGroupingApproximationValue|Function}
- * @default ohlc
- * @product highstock
- * @apioption plotOptions.candlestick.dataGrouping.approximation
- */
- states: {
- /**
- * @extends plotOptions.column.states.hover
- * @product highstock
- */
- hover: {
- /**
- * The pixel width of the line/border around the candlestick.
- *
- * @product highstock
- */
- lineWidth: 2
- }
- },
- /**
- * @extends plotOptions.ohlc.tooltip
- */
- tooltip: defaultOptions.plotOptions.ohlc.tooltip,
- /**
- * @type {number|null}
- * @product highstock
- */
- threshold: null,
- /**
- * The color of the line/border of the candlestick.
- *
- * In styled mode, the line stroke can be set with the
- * `.highcharts-candlestick-series .highcahrts-point` rule.
- *
- * @see [upLineColor](#plotOptions.candlestick.upLineColor)
- *
- * @sample {highstock} stock/plotoptions/candlestick-linecolor/
- * Candlestick line colors
- *
- * @type {Highcharts.ColorString|Highcharts.GradientColorObject|Highcharts.PatternObject}
- * @default #000000
- * @product highstock
- */
- lineColor: '#000000',
- /**
- * The pixel width of the candlestick line/border. Defaults to `1`.
- *
- *
- * In styled mode, the line stroke width can be set with the
- * `.highcharts-candlestick-series .highcahrts-point` rule.
- *
- * @product highstock
- */
- lineWidth: 1,
- /**
- * The fill color of the candlestick when values are rising.
- *
- * In styled mode, the up color can be set with the
- * `.highcharts-candlestick-series .highcharts-point-up` rule.
- *
- * @sample {highstock} stock/plotoptions/candlestick-color/
- * Custom colors
- * @sample {highstock} highcharts/css/candlestick/
- * Colors in styled mode
- *
- * @type {Highcharts.ColorString|Highcharts.GradientColorObject|Highcharts.PatternObject}
- * @default #ffffff
- * @product highstock
- */
- upColor: '#ffffff',
- /**
- * @product highstock
- */
- stickyTracking: true
- };
- /**
- * The candlestick series type.
- *
- * @private
- * @class
- * @name Highcharts.seriesTypes.candlestick
- *
- * @augments Highcharts.seriesTypes.ohlc
- */
- seriesType('candlestick', 'ohlc', merge(defaultOptions.plotOptions.column, candlestickOptions),
- /**
- * @lends seriesTypes.candlestick
- */
- {
- /* eslint-disable valid-jsdoc */
- /**
- * Postprocess mapping between options and SVG attributes
- *
- * @private
- * @function Highcharts.seriesTypes.candlestick#pointAttribs
- * @param {Highcharts.Point} point
- * @param {string} [state]
- * @return {Highcharts.SVGAttributes}
- */
- pointAttribs: function (point, state) {
- var attribs = seriesTypes.column.prototype.pointAttribs.call(this, point, state), options = this.options, isUp = point.open < point.close, stroke = options.lineColor || this.color, stateOptions;
- attribs['stroke-width'] = options.lineWidth;
- attribs.fill = point.options.color ||
- (isUp ? (options.upColor || this.color) : this.color);
- attribs.stroke = point.options.lineColor ||
- (isUp ? (options.upLineColor || stroke) : stroke);
- // Select or hover states
- if (state) {
- stateOptions = options.states[state];
- attribs.fill = stateOptions.color || attribs.fill;
- attribs.stroke = stateOptions.lineColor || attribs.stroke;
- attribs['stroke-width'] =
- stateOptions.lineWidth || attribs['stroke-width'];
- }
- return attribs;
- },
- /**
- * Draw the data points.
- *
- * @private
- * @function Highcharts.seriesTypes.candlestick#drawPoints
- * @return {void}
- */
- drawPoints: function () {
- var series = this, points = series.points, chart = series.chart, reversedYAxis = series.yAxis.reversed;
- points.forEach(function (point) {
- var graphic = point.graphic, plotOpen, plotClose, topBox, bottomBox, hasTopWhisker, hasBottomWhisker, crispCorr, crispX, path, halfWidth, isNew = !graphic;
- if (typeof point.plotY !== 'undefined') {
- if (!graphic) {
- point.graphic = graphic = chart.renderer.path()
- .add(series.group);
- }
- if (!series.chart.styledMode) {
- graphic
- .attr(series.pointAttribs(point, (point.selected && 'select'))) // #3897
- .shadow(series.options.shadow);
- }
- // Crisp vector coordinates
- crispCorr = (graphic.strokeWidth() % 2) / 2;
- // #2596:
- crispX = Math.round(point.plotX) - crispCorr;
- plotOpen = point.plotOpen;
- plotClose = point.plotClose;
- topBox = Math.min(plotOpen, plotClose);
- bottomBox = Math.max(plotOpen, plotClose);
- halfWidth = Math.round(point.shapeArgs.width / 2);
- hasTopWhisker = reversedYAxis ?
- bottomBox !== point.yBottom :
- Math.round(topBox) !==
- Math.round(point.plotHigh);
- hasBottomWhisker = reversedYAxis ?
- Math.round(topBox) !==
- Math.round(point.plotHigh) :
- bottomBox !== point.yBottom;
- topBox = Math.round(topBox) + crispCorr;
- bottomBox = Math.round(bottomBox) + crispCorr;
- // Create the path. Due to a bug in Chrome 49, the path is
- // first instanciated with no values, then the values
- // pushed. For unknown reasons, instanciating the path array
- // with all the values would lead to a crash when updating
- // frequently (#5193).
- path = [];
- path.push(['M', crispX - halfWidth, bottomBox], ['L', crispX - halfWidth, topBox], ['L', crispX + halfWidth, topBox], ['L', crispX + halfWidth, bottomBox], ['Z'], // Ensure a nice rectangle #2602
- ['M', crispX, topBox], [
- 'L',
- // #460, #2094
- crispX,
- hasTopWhisker ?
- Math.round(reversedYAxis ?
- point.yBottom :
- point.plotHigh) :
- topBox
- ], ['M', crispX, bottomBox], [
- 'L',
- // #460, #2094
- crispX,
- hasBottomWhisker ?
- Math.round(reversedYAxis ?
- point.plotHigh :
- point.yBottom) :
- bottomBox
- ]);
- graphic[isNew ? 'attr' : 'animate']({ d: path })
- .addClass(point.getClassName(), true);
- }
- });
- /* eslint-enable valid-jsdoc */
- }
- });
- /**
- * A `candlestick` series. If the [type](#series.candlestick.type)
- * option is not specified, it is inherited from [chart.type](
- * #chart.type).
- *
- * @type {*}
- * @extends series,plotOptions.candlestick
- * @excluding dataParser, dataURL
- * @product highstock
- * @apioption series.candlestick
- */
- /**
- * An array of data points for the series. For the `candlestick` series
- * type, points can be given in the following ways:
- *
- * 1. An array of arrays with 5 or 4 values. In this case, the values correspond
- * to `x,open,high,low,close`. If the first value is a string, it is applied
- * as the name of the point, and the `x` value is inferred. The `x` value can
- * also be omitted, in which case the inner arrays should be of length 4.
- * Then the `x` value is automatically calculated, either starting at 0 and
- * incremented by 1, or from `pointStart` and `pointInterval` given in the
- * series options.
- * ```js
- * data: [
- * [0, 7, 2, 0, 4],
- * [1, 1, 4, 2, 8],
- * [2, 3, 3, 9, 3]
- * ]
- * ```
- *
- * 2. An array of objects with named values. The following snippet shows only a
- * few settings, see the complete options set below. If the total number of
- * data points exceeds the series'
- * [turboThreshold](#series.candlestick.turboThreshold), this option is not
- * available.
- * ```js
- * data: [{
- * x: 1,
- * open: 9,
- * high: 2,
- * low: 4,
- * close: 6,
- * name: "Point2",
- * color: "#00FF00"
- * }, {
- * x: 1,
- * open: 1,
- * high: 4,
- * low: 7,
- * close: 7,
- * name: "Point1",
- * color: "#FF00FF"
- * }]
- * ```
- *
- * @type {Array<Array<(number|string),number,number,number>|Array<(number|string),number,number,number,number>|*>}
- * @extends series.ohlc.data
- * @excluding y
- * @product highstock
- * @apioption series.candlestick.data
- */
- ''; // adds doclets above to transpilat
- });
- _registerModule(_modules, 'mixins/on-series.js', [_modules['parts/Globals.js'], _modules['parts/Utilities.js']], function (H, U) {
- /* *
- *
- * (c) 2010-2020 Torstein Honsi
- *
- * License: www.highcharts.com/license
- *
- * !!!!!!! SOURCE GETS TRANSPILED BY TYPESCRIPT. EDIT TS FILE ONLY. !!!!!!!
- *
- * */
- var defined = U.defined, stableSort = U.stableSort;
- var seriesTypes = H.seriesTypes;
- /**
- * @private
- * @mixin onSeriesMixin
- */
- var onSeriesMixin = {
- /* eslint-disable valid-jsdoc */
- /**
- * Override getPlotBox. If the onSeries option is valid, return the plot box
- * of the onSeries, otherwise proceed as usual.
- *
- * @private
- * @function onSeriesMixin.getPlotBox
- * @return {Highcharts.SeriesPlotBoxObject}
- */
- getPlotBox: function () {
- return H.Series.prototype.getPlotBox.call((this.options.onSeries &&
- this.chart.get(this.options.onSeries)) || this);
- },
- /**
- * Extend the translate method by placing the point on the related series
- *
- * @private
- * @function onSeriesMixin.translate
- * @return {void}
- */
- translate: function () {
- seriesTypes.column.prototype.translate.apply(this);
- var series = this, options = series.options, chart = series.chart, points = series.points, cursor = points.length - 1, point, lastPoint, optionsOnSeries = options.onSeries, onSeries = (optionsOnSeries &&
- chart.get(optionsOnSeries)), onKey = options.onKey || 'y', step = onSeries && onSeries.options.step, onData = (onSeries && onSeries.points), i = onData && onData.length, inverted = chart.inverted, xAxis = series.xAxis, yAxis = series.yAxis, xOffset = 0, leftPoint, lastX, rightPoint, currentDataGrouping, distanceRatio;
- // relate to a master series
- if (onSeries && onSeries.visible && i) {
- xOffset = (onSeries.pointXOffset || 0) + (onSeries.barW || 0) / 2;
- currentDataGrouping = onSeries.currentDataGrouping;
- lastX = (onData[i - 1].x +
- (currentDataGrouping ? currentDataGrouping.totalRange : 0)); // #2374
- // sort the data points
- stableSort(points, function (a, b) {
- return (a.x - b.x);
- });
- onKey = 'plot' + onKey[0].toUpperCase() + onKey.substr(1);
- while (i-- && points[cursor]) {
- leftPoint = onData[i];
- point = points[cursor];
- point.y = leftPoint.y;
- if (leftPoint.x <= point.x &&
- typeof leftPoint[onKey] !== 'undefined') {
- if (point.x <= lastX) { // #803
- point.plotY = leftPoint[onKey];
- // interpolate between points, #666
- if (leftPoint.x < point.x &&
- !step) {
- rightPoint = onData[i + 1];
- if (rightPoint &&
- typeof rightPoint[onKey] !== 'undefined') {
- // the distance ratio, between 0 and 1
- distanceRatio =
- (point.x - leftPoint.x) /
- (rightPoint.x - leftPoint.x);
- point.plotY +=
- distanceRatio *
- // the plotY distance
- (rightPoint[onKey] - leftPoint[onKey]);
- point.y +=
- distanceRatio *
- (rightPoint.y - leftPoint.y);
- }
- }
- }
- cursor--;
- i++; // check again for points in the same x position
- if (cursor < 0) {
- break;
- }
- }
- }
- }
- // Add plotY position and handle stacking
- points.forEach(function (point, i) {
- var stackIndex;
- point.plotX += xOffset; // #2049
- // Undefined plotY means the point is either on axis, outside series
- // range or hidden series. If the series is outside the range of the
- // x axis it should fall through with an undefined plotY, but then
- // we must remove the shapeArgs (#847). For inverted charts, we need
- // to calculate position anyway, because series.invertGroups is not
- // defined
- if (typeof point.plotY === 'undefined' || inverted) {
- if (point.plotX >= 0 &&
- point.plotX <= xAxis.len) {
- // We're inside xAxis range
- if (inverted) {
- point.plotY = xAxis.translate(point.x, 0, 1, 0, 1);
- point.plotX = defined(point.y) ?
- yAxis.translate(point.y, 0, 0, 0, 1) :
- 0;
- }
- else {
- point.plotY = (xAxis.opposite ? 0 : series.yAxis.len) +
- xAxis.offset; // For the windbarb demo
- }
- }
- else {
- point.shapeArgs = {}; // 847
- }
- }
- // if multiple flags appear at the same x, order them into a stack
- lastPoint = points[i - 1];
- if (lastPoint && lastPoint.plotX === point.plotX) {
- if (typeof lastPoint.stackIndex === 'undefined') {
- lastPoint.stackIndex = 0;
- }
- stackIndex = lastPoint.stackIndex + 1;
- }
- point.stackIndex = stackIndex; // #3639
- });
- this.onSeries = onSeries;
- }
- /* eslint-enable valid-jsdoc */
- };
- return onSeriesMixin;
- });
- _registerModule(_modules, 'parts/FlagsSeries.js', [_modules['parts/Globals.js'], _modules['parts/SVGElement.js'], _modules['parts/SVGRenderer.js'], _modules['parts/Utilities.js'], _modules['mixins/on-series.js']], function (H, SVGElement, SVGRenderer, U, onSeriesMixin) {
- /* *
- *
- * (c) 2010-2020 Torstein Honsi
- *
- * License: www.highcharts.com/license
- *
- * !!!!!!! SOURCE GETS TRANSPILED BY TYPESCRIPT. EDIT TS FILE ONLY. !!!!!!!
- *
- * */
- var addEvent = U.addEvent, defined = U.defined, isNumber = U.isNumber, merge = U.merge, objectEach = U.objectEach, seriesType = U.seriesType, wrap = U.wrap;
- /**
- * @typedef {"circlepin"|"flag"|"squarepin"} Highcharts.FlagsShapeValue
- */
- var noop = H.noop, Renderer = H.Renderer, Series = H.Series, TrackerMixin = H.TrackerMixin, VMLRenderer = H.VMLRenderer, symbols = SVGRenderer.prototype.symbols;
- /**
- * The Flags series.
- *
- * @private
- * @class
- * @name Highcharts.seriesTypes.flags
- *
- * @augments Highcharts.Series
- */
- seriesType('flags', 'column'
- /**
- * Flags are used to mark events in stock charts. They can be added on the
- * timeline, or attached to a specific series.
- *
- * @sample stock/demo/flags-general/
- * Flags on a line series
- *
- * @extends plotOptions.column
- * @excluding animation, borderColor, borderRadius, borderWidth,
- * colorByPoint, dataGrouping, pointPadding, pointWidth,
- * turboThreshold
- * @product highstock
- * @optionparent plotOptions.flags
- */
- , {
- /**
- * In case the flag is placed on a series, on what point key to place
- * it. Line and columns have one key, `y`. In range or OHLC-type series,
- * however, the flag can optionally be placed on the `open`, `high`,
- * `low` or `close` key.
- *
- * @sample {highstock} stock/plotoptions/flags-onkey/
- * Range series, flag on high
- *
- * @type {string}
- * @default y
- * @since 4.2.2
- * @product highstock
- * @validvalue ["y", "open", "high", "low", "close"]
- * @apioption plotOptions.flags.onKey
- */
- /**
- * The id of the series that the flags should be drawn on. If no id
- * is given, the flags are drawn on the x axis.
- *
- * @sample {highstock} stock/plotoptions/flags/
- * Flags on series and on x axis
- *
- * @type {string}
- * @product highstock
- * @apioption plotOptions.flags.onSeries
- */
- pointRange: 0,
- /**
- * Whether the flags are allowed to overlap sideways. If `false`, the
- * flags are moved sideways using an algorithm that seeks to place every
- * flag as close as possible to its original position.
- *
- * @sample {highstock} stock/plotoptions/flags-allowoverlapx
- * Allow sideways overlap
- *
- * @since 6.0.4
- */
- allowOverlapX: false,
- /**
- * The shape of the marker. Can be one of "flag", "circlepin",
- * "squarepin", or an image of the format `url(/path-to-image.jpg)`.
- * Individual shapes can also be set for each point.
- *
- * @sample {highstock} stock/plotoptions/flags/
- * Different shapes
- *
- * @type {Highcharts.FlagsShapeValue}
- * @product highstock
- */
- shape: 'flag',
- /**
- * When multiple flags in the same series fall on the same value, this
- * number determines the vertical offset between them.
- *
- * @sample {highstock} stock/plotoptions/flags-stackdistance/
- * A greater stack distance
- *
- * @product highstock
- */
- stackDistance: 12,
- /**
- * Text alignment for the text inside the flag.
- *
- * @since 5.0.0
- * @product highstock
- * @validvalue ["left", "center", "right"]
- */
- textAlign: 'center',
- /**
- * Specific tooltip options for flag series. Flag series tooltips are
- * different from most other types in that a flag doesn't have a data
- * value, so the tooltip rather displays the `text` option for each
- * point.
- *
- * @extends plotOptions.series.tooltip
- * @excluding changeDecimals, valueDecimals, valuePrefix, valueSuffix
- * @product highstock
- */
- tooltip: {
- pointFormat: '{point.text}<br/>'
- },
- threshold: null,
- /**
- * The text to display on each flag. This can be defined on series
- * level, or individually for each point. Defaults to `"A"`.
- *
- * @type {string}
- * @default A
- * @product highstock
- * @apioption plotOptions.flags.title
- */
- /**
- * The y position of the top left corner of the flag relative to either
- * the series (if onSeries is defined), or the x axis. Defaults to
- * `-30`.
- *
- * @product highstock
- */
- y: -30,
- /**
- * Whether to use HTML to render the flag texts. Using HTML allows for
- * advanced formatting, images and reliable bi-directional text
- * rendering. Note that exported images won't respect the HTML, and that
- * HTML won't respect Z-index settings.
- *
- * @type {boolean}
- * @default false
- * @since 1.3
- * @product highstock
- * @apioption plotOptions.flags.useHTML
- */
- /**
- * Fixed width of the flag's shape. By default, width is autocalculated
- * according to the flag's title.
- *
- * @sample {highstock} stock/demo/flags-shapes/
- * Flags with fixed width
- *
- * @type {number}
- * @product highstock
- * @apioption plotOptions.flags.width
- */
- /**
- * Fixed height of the flag's shape. By default, height is
- * autocalculated according to the flag's title.
- *
- * @type {number}
- * @product highstock
- * @apioption plotOptions.flags.height
- */
- /**
- * The fill color for the flags.
- *
- * @type {Highcharts.ColorString|Highcharts.GradientColorObject|Highcharts.PatternObject}
- * @product highstock
- */
- fillColor: '#ffffff',
- /**
- * The color of the line/border of the flag.
- *
- * In styled mode, the stroke is set in the
- * `.highcharts-flag-series.highcharts-point` rule.
- *
- * @type {Highcharts.ColorString|Highcharts.GradientColorObject|Highcharts.PatternObject}
- * @default #000000
- * @product highstock
- * @apioption plotOptions.flags.lineColor
- */
- /**
- * The pixel width of the flag's line/border.
- *
- * @product highstock
- */
- lineWidth: 1,
- states: {
- /**
- * @extends plotOptions.column.states.hover
- * @product highstock
- */
- hover: {
- /**
- * The color of the line/border of the flag.
- *
- * @type {Highcharts.ColorString|Highcharts.GradientColorObject|Highcharts.PatternObject}
- * @product highstock
- */
- lineColor: '#000000',
- /**
- * The fill or background color of the flag.
- *
- * @type {Highcharts.ColorString|Highcharts.GradientColorObject|Highcharts.PatternObject}
- * @product highstock
- */
- fillColor: '#ccd6eb'
- }
- },
- /**
- * The text styles of the flag.
- *
- * In styled mode, the styles are set in the
- * `.highcharts-flag-series .highcharts-point` rule.
- *
- * @type {Highcharts.CSSObject}
- * @default {"fontSize": "11px", "fontWeight": "bold"}
- * @product highstock
- */
- style: {
- /** @ignore-option */
- fontSize: '11px',
- /** @ignore-option */
- fontWeight: 'bold'
- }
- },
- /**
- * @lends seriesTypes.flags.prototype
- */
- {
- sorted: false,
- noSharedTooltip: true,
- allowDG: false,
- takeOrdinalPosition: false,
- trackerGroups: ['markerGroup'],
- forceCrop: true,
- /* eslint-disable no-invalid-this, valid-jsdoc */
- /**
- * Inherit the initialization from base Series.
- *
- * @private
- * @borrows Highcharts.Series#init as Highcharts.seriesTypes.flags#init
- */
- init: Series.prototype.init,
- /**
- * Get presentational attributes
- *
- * @private
- * @function Highcharts.seriesTypes.flags#pointAttribs
- *
- * @param {Highcharts.Point} point
- *
- * @param {string} [state]
- *
- * @return {Highcharts.SVGAttributes}
- */
- pointAttribs: function (point, state) {
- var options = this.options, color = (point && point.color) || this.color, lineColor = options.lineColor, lineWidth = (point && point.lineWidth), fill = (point && point.fillColor) || options.fillColor;
- if (state) {
- fill = options.states[state].fillColor;
- lineColor = options.states[state].lineColor;
- lineWidth = options.states[state].lineWidth;
- }
- return {
- fill: fill || color,
- stroke: lineColor || color,
- 'stroke-width': lineWidth || options.lineWidth || 0
- };
- },
- translate: onSeriesMixin.translate,
- getPlotBox: onSeriesMixin.getPlotBox,
- /**
- * Draw the markers.
- *
- * @private
- * @function Highcharts.seriesTypes.flags#drawPoints
- * @return {void}
- */
- drawPoints: function () {
- var series = this, points = series.points, chart = series.chart, renderer = chart.renderer, plotX, plotY, inverted = chart.inverted, options = series.options, optionsY = options.y, shape, i, point, graphic, stackIndex, anchorY, attribs, outsideRight, yAxis = series.yAxis, boxesMap = {}, boxes = [], centered;
- i = points.length;
- while (i--) {
- point = points[i];
- outsideRight =
- (inverted ? point.plotY : point.plotX) >
- series.xAxis.len;
- plotX = point.plotX;
- stackIndex = point.stackIndex;
- shape = point.options.shape || options.shape;
- plotY = point.plotY;
- if (typeof plotY !== 'undefined') {
- plotY = point.plotY + optionsY -
- (typeof stackIndex !== 'undefined' &&
- (stackIndex * options.stackDistance));
- }
- // skip connectors for higher level stacked points
- point.anchorX = stackIndex ? void 0 : point.plotX;
- anchorY = stackIndex ? void 0 : point.plotY;
- centered = shape !== 'flag';
- graphic = point.graphic;
- // Only draw the point if y is defined and the flag is within
- // the visible area
- if (typeof plotY !== 'undefined' &&
- plotX >= 0 &&
- !outsideRight) {
- // Create the flag
- if (!graphic) {
- graphic = point.graphic = renderer.label('', null, null, shape, null, null, options.useHTML);
- if (!chart.styledMode) {
- graphic
- .attr(series.pointAttribs(point))
- .css(merge(options.style, point.style));
- }
- graphic.attr({
- align: centered ? 'center' : 'left',
- width: options.width,
- height: options.height,
- 'text-align': options.textAlign
- })
- .addClass('highcharts-point')
- .add(series.markerGroup);
- // Add reference to the point for tracker (#6303)
- if (point.graphic.div) {
- point.graphic.div.point = point;
- }
- if (!chart.styledMode) {
- graphic.shadow(options.shadow);
- }
- graphic.isNew = true;
- }
- if (plotX > 0) { // #3119
- plotX -= graphic.strokeWidth() % 2; // #4285
- }
- // Plant the flag
- attribs = {
- y: plotY,
- anchorY: anchorY
- };
- if (options.allowOverlapX) {
- attribs.x = plotX;
- attribs.anchorX = point.anchorX;
- }
- graphic.attr({
- text: point.options.title || options.title || 'A'
- })[graphic.isNew ? 'attr' : 'animate'](attribs);
- // Rig for the distribute function
- if (!options.allowOverlapX) {
- if (!boxesMap[point.plotX]) {
- boxesMap[point.plotX] = {
- align: centered ? 0.5 : 0,
- size: graphic.width,
- target: plotX,
- anchorX: plotX
- };
- }
- else {
- boxesMap[point.plotX].size = Math.max(boxesMap[point.plotX].size, graphic.width);
- }
- }
- // Set the tooltip anchor position
- point.tooltipPos = [
- plotX,
- plotY + yAxis.pos - chart.plotTop
- ]; // #6327
- }
- else if (graphic) {
- point.graphic = graphic.destroy();
- }
- }
- // Handle X-dimension overlapping
- if (!options.allowOverlapX) {
- objectEach(boxesMap, function (box) {
- box.plotX = box.anchorX;
- boxes.push(box);
- });
- H.distribute(boxes, inverted ? yAxis.len : this.xAxis.len, 100);
- points.forEach(function (point) {
- var box = point.graphic && boxesMap[point.plotX];
- if (box) {
- point.graphic[point.graphic.isNew ? 'attr' : 'animate']({
- x: box.pos + box.align * box.size,
- anchorX: point.anchorX
- });
- // Hide flag when its box position is not specified
- // (#8573, #9299)
- if (!defined(box.pos)) {
- point.graphic.attr({
- x: -9999,
- anchorX: -9999
- });
- point.graphic.isNew = true;
- }
- else {
- point.graphic.isNew = false;
- }
- }
- });
- }
- // Can be a mix of SVG and HTML and we need events for both (#6303)
- if (options.useHTML) {
- wrap(series.markerGroup, 'on', function (proceed) {
- return SVGElement.prototype.on.apply(
- // for HTML
- proceed.apply(this, [].slice.call(arguments, 1)),
- // and for SVG
- [].slice.call(arguments, 1));
- });
- }
- },
- /**
- * Extend the column trackers with listeners to expand and contract
- * stacks.
- *
- * @private
- * @function Highcharts.seriesTypes.flags#drawTracker
- * @return {void}
- */
- drawTracker: function () {
- var series = this, points = series.points;
- TrackerMixin.drawTrackerPoint.apply(this);
- /* *
- * Bring each stacked flag up on mouse over, this allows readability
- * of vertically stacked elements as well as tight points on the x
- * axis. #1924.
- */
- points.forEach(function (point) {
- var graphic = point.graphic;
- if (graphic) {
- addEvent(graphic.element, 'mouseover', function () {
- // Raise this point
- if (point.stackIndex > 0 &&
- !point.raised) {
- point._y = graphic.y;
- graphic.attr({
- y: point._y - 8
- });
- point.raised = true;
- }
- // Revert other raised points
- points.forEach(function (otherPoint) {
- if (otherPoint !== point &&
- otherPoint.raised &&
- otherPoint.graphic) {
- otherPoint.graphic.attr({
- y: otherPoint._y
- });
- otherPoint.raised = false;
- }
- });
- });
- }
- });
- },
- /**
- * Disable animation, but keep clipping (#8546).
- *
- * @private
- * @function Highcharts.seriesTypes.flags#animate
- * @param {boolean} [init]
- * @return {void}
- */
- animate: function (init) {
- if (init) {
- this.setClip();
- }
- },
- /**
- * @private
- * @function Highcharts.seriesTypes.flags#setClip
- * @return {void}
- */
- setClip: function () {
- Series.prototype.setClip.apply(this, arguments);
- if (this.options.clip !== false && this.sharedClipKey) {
- this.markerGroup
- .clip(this.chart[this.sharedClipKey]);
- }
- },
- /**
- * @private
- * @function Highcharts.seriesTypes.flags#buildKDTree
- */
- buildKDTree: noop,
- /**
- * Don't invert the flag marker group (#4960).
- *
- * @private
- * @function Highcharts.seriesTypes.flags#invertGroups
- */
- invertGroups: noop
- /* eslint-enable no-invalid-this, valid-jsdoc */
- },
- /**
- * @lends Highcharts.seriesTypes.flag.prototype.pointClass.prototype
- */
- {
- isValid: function () {
- // #9233 - Prevent from treating flags as null points (even if
- // they have no y values defined).
- return isNumber(this.y) || typeof this.y === 'undefined';
- }
- });
- // create the flag icon with anchor
- symbols.flag = function (x, y, w, h, options) {
- var anchorX = (options && options.anchorX) || x, anchorY = (options && options.anchorY) || y;
- // To do: unwanted any cast because symbols.circle has wrong type, it
- // actually returns an SVGPathArray
- var path = symbols.circle(anchorX - 1, anchorY - 1, 2, 2);
- path.push(['M', anchorX, anchorY], ['L', x, y + h], ['L', x, y], ['L', x + w, y], ['L', x + w, y + h], ['L', x, y + h], ['Z']);
- return path;
- };
- /**
- * Create the circlepin and squarepin icons with anchor.
- * @private
- * @param {string} shape - circle or square
- * @return {void}
- */
- function createPinSymbol(shape) {
- symbols[shape + 'pin'] = function (x, y, w, h, options) {
- var anchorX = options && options.anchorX, anchorY = options && options.anchorY, path;
- // For single-letter flags, make sure circular flags are not taller
- // than their width
- if (shape === 'circle' && h > w) {
- x -= Math.round((h - w) / 2);
- w = h;
- }
- path = (symbols[shape])(x, y, w, h);
- if (anchorX && anchorY) {
- /**
- * If the label is below the anchor, draw the connecting line from
- * the top edge of the label, otherwise start drawing from the
- * bottom edge
- */
- var labelX = anchorX;
- if (shape === 'circle') {
- labelX = x + w / 2;
- }
- else {
- var startSeg = path[0];
- var endSeg = path[1];
- if (startSeg[0] === 'M' && endSeg[0] === 'L') {
- labelX = (startSeg[1] + endSeg[1]) / 2;
- }
- }
- var labelY = (y > anchorY) ? y : y + h;
- path.push([
- 'M',
- labelX,
- labelY
- ], [
- 'L',
- anchorX,
- anchorY
- ]);
- path = path.concat(symbols.circle(anchorX - 1, anchorY - 1, 2, 2));
- }
- return path;
- };
- }
- createPinSymbol('circle');
- createPinSymbol('square');
- /**
- * The symbol callbacks are generated on the SVGRenderer object in all browsers.
- * Even VML browsers need this in order to generate shapes in export. Now share
- * them with the VMLRenderer.
- */
- if (Renderer === VMLRenderer) {
- ['circlepin', 'flag', 'squarepin'].forEach(function (shape) {
- VMLRenderer.prototype.symbols[shape] = symbols[shape];
- });
- }
- /**
- * A `flags` series. If the [type](#series.flags.type) option is not
- * specified, it is inherited from [chart.type](#chart.type).
- *
- * @extends series,plotOptions.flags
- * @excluding animation, borderColor, borderRadius, borderWidth, colorByPoint,
- * connectNulls, dashStyle, dataGrouping, dataParser, dataURL,
- * gapSize, gapUnit, linecap, lineWidth, marker, pointPadding,
- * pointWidth, step, turboThreshold, useOhlcData
- * @product highstock
- * @apioption series.flags
- */
- /**
- * An array of data points for the series. For the `flags` series type,
- * points can be given in the following ways:
- *
- * 1. An array of objects with named values. The following snippet shows only a
- * few settings, see the complete options set below. If the total number of
- * data points exceeds the series'
- * [turboThreshold](#series.flags.turboThreshold), this option is not
- * available.
- * ```js
- * data: [{
- * x: 1,
- * title: "A",
- * text: "First event"
- * }, {
- * x: 1,
- * title: "B",
- * text: "Second event"
- * }]
- * ```
- *
- * @type {Array<*>}
- * @extends series.line.data
- * @excluding dataLabels, marker, name, y
- * @product highstock
- * @apioption series.flags.data
- */
- /**
- * The fill color of an individual flag. By default it inherits from
- * the series color.
- *
- * @type {Highcharts.ColorString|Highcharts.GradientColorObject|Highcharts.PatternObject}
- * @product highstock
- * @apioption series.flags.data.fillColor
- */
- /**
- * The longer text to be shown in the flag's tooltip.
- *
- * @type {string}
- * @product highstock
- * @apioption series.flags.data.text
- */
- /**
- * The short text to be shown on the flag.
- *
- * @type {string}
- * @product highstock
- * @apioption series.flags.data.title
- */
- ''; // adds doclets above to transpiled file
- });
- _registerModule(_modules, 'parts/RangeSelector.js', [_modules['parts/Axis.js'], _modules['parts/Chart.js'], _modules['parts/Globals.js'], _modules['parts/Options.js'], _modules['parts/SVGElement.js'], _modules['parts/Utilities.js']], function (Axis, Chart, H, O, SVGElement, U) {
- /* *
- *
- * (c) 2010-2020 Torstein Honsi
- *
- * License: www.highcharts.com/license
- *
- * !!!!!!! SOURCE GETS TRANSPILED BY TYPESCRIPT. EDIT TS FILE ONLY. !!!!!!!
- *
- * */
- var defaultOptions = O.defaultOptions;
- var addEvent = U.addEvent, createElement = U.createElement, css = U.css, defined = U.defined, destroyObjectProperties = U.destroyObjectProperties, discardElement = U.discardElement, extend = U.extend, fireEvent = U.fireEvent, isNumber = U.isNumber, merge = U.merge, objectEach = U.objectEach, pick = U.pick, pInt = U.pInt, splat = U.splat;
- /**
- * Define the time span for the button
- *
- * @typedef {"all"|"day"|"hour"|"millisecond"|"minute"|"month"|"second"|"week"|"year"|"ytd"} Highcharts.RangeSelectorButtonTypeValue
- */
- /**
- * Callback function to react on button clicks.
- *
- * @callback Highcharts.RangeSelectorClickCallbackFunction
- *
- * @param {global.Event} e
- * Event arguments.
- *
- * @param {boolean|undefined}
- * Return false to cancel the default button event.
- */
- /**
- * Callback function to parse values entered in the input boxes and return a
- * valid JavaScript time as milliseconds since 1970.
- *
- * @callback Highcharts.RangeSelectorParseCallbackFunction
- *
- * @param {string} value
- * Input value to parse.
- *
- * @return {number}
- * Parsed JavaScript time value.
- */
- /* ************************************************************************** *
- * Start Range Selector code *
- * ************************************************************************** */
- extend(defaultOptions, {
- /**
- * The range selector is a tool for selecting ranges to display within
- * the chart. It provides buttons to select preconfigured ranges in
- * the chart, like 1 day, 1 week, 1 month etc. It also provides input
- * boxes where min and max dates can be manually input.
- *
- * @product highstock gantt
- * @optionparent rangeSelector
- */
- rangeSelector: {
- /**
- * Whether to enable all buttons from the start. By default buttons are
- * only enabled if the corresponding time range exists on the X axis,
- * but enabling all buttons allows for dynamically loading different
- * time ranges.
- *
- * @sample {highstock} stock/rangeselector/allbuttonsenabled-true/
- * All buttons enabled
- *
- * @type {boolean}
- * @default false
- * @since 2.0.3
- * @apioption rangeSelector.allButtonsEnabled
- */
- /**
- * An array of configuration objects for the buttons.
- *
- * Defaults to:
- * ```js
- * buttons: [{
- * type: 'month',
- * count: 1,
- * text: '1m'
- * }, {
- * type: 'month',
- * count: 3,
- * text: '3m'
- * }, {
- * type: 'month',
- * count: 6,
- * text: '6m'
- * }, {
- * type: 'ytd',
- * text: 'YTD'
- * }, {
- * type: 'year',
- * count: 1,
- * text: '1y'
- * }, {
- * type: 'all',
- * text: 'All'
- * }]
- * ```
- *
- * @sample {highstock} stock/rangeselector/datagrouping/
- * Data grouping by buttons
- *
- * @type {Array<*>}
- * @apioption rangeSelector.buttons
- */
- /**
- * How many units of the defined type the button should span. If `type`
- * is "month" and `count` is 3, the button spans three months.
- *
- * @type {number}
- * @default 1
- * @apioption rangeSelector.buttons.count
- */
- /**
- * Fires when clicking on the rangeSelector button. One parameter,
- * event, is passed to the function, containing common event
- * information.
- *
- * ```js
- * click: function(e) {
- * console.log(this);
- * }
- * ```
- *
- * Return false to stop default button's click action.
- *
- * @sample {highstock} stock/rangeselector/button-click/
- * Click event on the button
- *
- * @type {Highcharts.RangeSelectorClickCallbackFunction}
- * @apioption rangeSelector.buttons.events.click
- */
- /**
- * Additional range (in milliseconds) added to the end of the calculated
- * time span.
- *
- * @sample {highstock} stock/rangeselector/min-max-offsets/
- * Button offsets
- *
- * @type {number}
- * @default 0
- * @since 6.0.0
- * @apioption rangeSelector.buttons.offsetMax
- */
- /**
- * Additional range (in milliseconds) added to the start of the
- * calculated time span.
- *
- * @sample {highstock} stock/rangeselector/min-max-offsets/
- * Button offsets
- *
- * @type {number}
- * @default 0
- * @since 6.0.0
- * @apioption rangeSelector.buttons.offsetMin
- */
- /**
- * When buttons apply dataGrouping on a series, by default zooming
- * in/out will deselect buttons and unset dataGrouping. Enable this
- * option to keep buttons selected when extremes change.
- *
- * @sample {highstock} stock/rangeselector/preserve-datagrouping/
- * Different preserveDataGrouping settings
- *
- * @type {boolean}
- * @default false
- * @since 6.1.2
- * @apioption rangeSelector.buttons.preserveDataGrouping
- */
- /**
- * A custom data grouping object for each button.
- *
- * @see [series.dataGrouping](#plotOptions.series.dataGrouping)
- *
- * @sample {highstock} stock/rangeselector/datagrouping/
- * Data grouping by range selector buttons
- *
- * @type {*}
- * @extends plotOptions.series.dataGrouping
- * @apioption rangeSelector.buttons.dataGrouping
- */
- /**
- * The text for the button itself.
- *
- * @type {string}
- * @apioption rangeSelector.buttons.text
- */
- /**
- * Defined the time span for the button. Can be one of `millisecond`,
- * `second`, `minute`, `hour`, `day`, `week`, `month`, `year`, `ytd`,
- * and `all`.
- *
- * @type {Highcharts.RangeSelectorButtonTypeValue}
- * @apioption rangeSelector.buttons.type
- */
- /**
- * The space in pixels between the buttons in the range selector.
- *
- * @type {number}
- * @default 0
- * @apioption rangeSelector.buttonSpacing
- */
- /**
- * Enable or disable the range selector.
- *
- * @sample {highstock} stock/rangeselector/enabled/
- * Disable the range selector
- *
- * @type {boolean}
- * @default true
- * @apioption rangeSelector.enabled
- */
- /**
- * The vertical alignment of the rangeselector box. Allowed properties
- * are `top`, `middle`, `bottom`.
- *
- * @sample {highstock} stock/rangeselector/vertical-align-middle/
- * Middle
- * @sample {highstock} stock/rangeselector/vertical-align-bottom/
- * Bottom
- *
- * @type {Highcharts.VerticalAlignValue}
- * @since 6.0.0
- */
- verticalAlign: 'top',
- /**
- * A collection of attributes for the buttons. The object takes SVG
- * attributes like `fill`, `stroke`, `stroke-width`, as well as `style`,
- * a collection of CSS properties for the text.
- *
- * The object can also be extended with states, so you can set
- * presentational options for `hover`, `select` or `disabled` button
- * states.
- *
- * CSS styles for the text label.
- *
- * In styled mode, the buttons are styled by the
- * `.highcharts-range-selector-buttons .highcharts-button` rule with its
- * different states.
- *
- * @sample {highstock} stock/rangeselector/styling/
- * Styling the buttons and inputs
- *
- * @type {Highcharts.SVGAttributes}
- */
- buttonTheme: {
- /** @ignore */
- width: 28,
- /** @ignore */
- height: 18,
- /** @ignore */
- padding: 2,
- /** @ignore */
- zIndex: 7 // #484, #852
- },
- /**
- * When the rangeselector is floating, the plot area does not reserve
- * space for it. This opens for positioning anywhere on the chart.
- *
- * @sample {highstock} stock/rangeselector/floating/
- * Placing the range selector between the plot area and the
- * navigator
- *
- * @since 6.0.0
- */
- floating: false,
- /**
- * The x offset of the range selector relative to its horizontal
- * alignment within `chart.spacingLeft` and `chart.spacingRight`.
- *
- * @since 6.0.0
- */
- x: 0,
- /**
- * The y offset of the range selector relative to its horizontal
- * alignment within `chart.spacingLeft` and `chart.spacingRight`.
- *
- * @since 6.0.0
- */
- y: 0,
- /**
- * Deprecated. The height of the range selector. Currently it is
- * calculated dynamically.
- *
- * @deprecated
- * @type {number|undefined}
- * @since 2.1.9
- */
- height: void 0,
- /**
- * The border color of the date input boxes.
- *
- * @sample {highstock} stock/rangeselector/styling/
- * Styling the buttons and inputs
- *
- * @type {Highcharts.ColorString}
- * @default #cccccc
- * @since 1.3.7
- * @apioption rangeSelector.inputBoxBorderColor
- */
- /**
- * The pixel height of the date input boxes.
- *
- * @sample {highstock} stock/rangeselector/styling/
- * Styling the buttons and inputs
- *
- * @type {number}
- * @default 17
- * @since 1.3.7
- * @apioption rangeSelector.inputBoxHeight
- */
- /**
- * CSS for the container DIV holding the input boxes. Deprecated as
- * of 1.2.5\. Use [inputPosition](#rangeSelector.inputPosition) instead.
- *
- * @sample {highstock} stock/rangeselector/styling/
- * Styling the buttons and inputs
- *
- * @deprecated
- * @type {Highcharts.CSSObject}
- * @apioption rangeSelector.inputBoxStyle
- */
- /**
- * The pixel width of the date input boxes.
- *
- * @sample {highstock} stock/rangeselector/styling/
- * Styling the buttons and inputs
- *
- * @type {number}
- * @default 90
- * @since 1.3.7
- * @apioption rangeSelector.inputBoxWidth
- */
- /**
- * The date format in the input boxes when not selected for editing.
- * Defaults to `%b %e, %Y`.
- *
- * @sample {highstock} stock/rangeselector/input-format/
- * Milliseconds in the range selector
- *
- * @type {string}
- * @default %b %e, %Y
- * @apioption rangeSelector.inputDateFormat
- */
- /**
- * A custom callback function to parse values entered in the input boxes
- * and return a valid JavaScript time as milliseconds since 1970.
- *
- * @sample {highstock} stock/rangeselector/input-format/
- * Milliseconds in the range selector
- *
- * @type {Highcharts.RangeSelectorParseCallbackFunction}
- * @since 1.3.3
- * @apioption rangeSelector.inputDateParser
- */
- /**
- * The date format in the input boxes when they are selected for
- * editing. This must be a format that is recognized by JavaScript
- * Date.parse.
- *
- * @sample {highstock} stock/rangeselector/input-format/
- * Milliseconds in the range selector
- *
- * @type {string}
- * @default %Y-%m-%d
- * @apioption rangeSelector.inputEditDateFormat
- */
- /**
- * Enable or disable the date input boxes. Defaults to enabled when
- * there is enough space, disabled if not (typically mobile).
- *
- * @sample {highstock} stock/rangeselector/input-datepicker/
- * Extending the input with a jQuery UI datepicker
- *
- * @type {boolean}
- * @default true
- * @apioption rangeSelector.inputEnabled
- */
- /**
- * Positioning for the input boxes. Allowed properties are `align`,
- * `x` and `y`.
- *
- * @since 1.2.4
- */
- inputPosition: {
- /**
- * The alignment of the input box. Allowed properties are `left`,
- * `center`, `right`.
- *
- * @sample {highstock} stock/rangeselector/input-button-position/
- * Alignment
- *
- * @type {Highcharts.AlignValue}
- * @since 6.0.0
- */
- align: 'right',
- /**
- * X offset of the input row.
- */
- x: 0,
- /**
- * Y offset of the input row.
- */
- y: 0
- },
- /**
- * The index of the button to appear pre-selected.
- *
- * @type {number}
- * @apioption rangeSelector.selected
- */
- /**
- * Positioning for the button row.
- *
- * @since 1.2.4
- */
- buttonPosition: {
- /**
- * The alignment of the input box. Allowed properties are `left`,
- * `center`, `right`.
- *
- * @sample {highstock} stock/rangeselector/input-button-position/
- * Alignment
- *
- * @type {Highcharts.AlignValue}
- * @since 6.0.0
- */
- align: 'left',
- /**
- * X offset of the button row.
- */
- x: 0,
- /**
- * Y offset of the button row.
- */
- y: 0
- },
- /**
- * CSS for the HTML inputs in the range selector.
- *
- * In styled mode, the inputs are styled by the
- * `.highcharts-range-input text` rule in SVG mode, and
- * `input.highcharts-range-selector` when active.
- *
- * @sample {highstock} stock/rangeselector/styling/
- * Styling the buttons and inputs
- *
- * @type {Highcharts.CSSObject}
- * @apioption rangeSelector.inputStyle
- */
- /**
- * CSS styles for the labels - the Zoom, From and To texts.
- *
- * In styled mode, the labels are styled by the
- * `.highcharts-range-label` class.
- *
- * @sample {highstock} stock/rangeselector/styling/
- * Styling the buttons and inputs
- *
- * @type {Highcharts.CSSObject}
- */
- labelStyle: {
- /** @ignore */
- color: '#666666'
- }
- }
- });
- defaultOptions.lang = merge(defaultOptions.lang,
- /**
- * Language object. The language object is global and it can't be set
- * on each chart initialization. Instead, use `Highcharts.setOptions` to
- * set it before any chart is initialized.
- *
- * ```js
- * Highcharts.setOptions({
- * lang: {
- * months: [
- * 'Janvier', 'Février', 'Mars', 'Avril',
- * 'Mai', 'Juin', 'Juillet', 'Août',
- * 'Septembre', 'Octobre', 'Novembre', 'Décembre'
- * ],
- * weekdays: [
- * 'Dimanche', 'Lundi', 'Mardi', 'Mercredi',
- * 'Jeudi', 'Vendredi', 'Samedi'
- * ]
- * }
- * });
- * ```
- *
- * @optionparent lang
- */
- {
- /**
- * The text for the label for the range selector buttons.
- *
- * @product highstock gantt
- */
- rangeSelectorZoom: 'Zoom',
- /**
- * The text for the label for the "from" input box in the range
- * selector.
- *
- * @product highstock gantt
- */
- rangeSelectorFrom: 'From',
- /**
- * The text for the label for the "to" input box in the range selector.
- *
- * @product highstock gantt
- */
- rangeSelectorTo: 'To'
- });
- /* eslint-disable no-invalid-this, valid-jsdoc */
- /**
- * The range selector.
- *
- * @private
- * @class
- * @name Highcharts.RangeSelector
- * @param {Highcharts.Chart} chart
- */
- var RangeSelector = /** @class */ (function () {
- function RangeSelector(chart) {
- /* *
- *
- * Properties
- *
- * */
- this.buttons = void 0;
- this.buttonOptions = RangeSelector.prototype.defaultButtons;
- this.options = void 0;
- this.chart = chart;
- // Run RangeSelector
- this.init(chart);
- }
- /**
- * The method to run when one of the buttons in the range selectors is
- * clicked
- *
- * @private
- * @function Highcharts.RangeSelector#clickButton
- * @param {number} i
- * The index of the button
- * @param {boolean} [redraw]
- * @return {void}
- */
- RangeSelector.prototype.clickButton = function (i, redraw) {
- var rangeSelector = this, chart = rangeSelector.chart, rangeOptions = rangeSelector.buttonOptions[i], baseAxis = chart.xAxis[0], unionExtremes = (chart.scroller && chart.scroller.getUnionExtremes()) || baseAxis || {}, dataMin = unionExtremes.dataMin, dataMax = unionExtremes.dataMax, newMin, newMax = baseAxis && Math.round(Math.min(baseAxis.max, pick(dataMax, baseAxis.max))), // #1568
- type = rangeOptions.type, baseXAxisOptions, range = rangeOptions._range, rangeMin, minSetting, rangeSetting, ctx, ytdExtremes, dataGrouping = rangeOptions.dataGrouping;
- // chart has no data, base series is removed
- if (dataMin === null || dataMax === null) {
- return;
- }
- // Set the fixed range before range is altered
- chart.fixedRange = range;
- // Apply dataGrouping associated to button
- if (dataGrouping) {
- this.forcedDataGrouping = true;
- Axis.prototype.setDataGrouping.call(baseAxis || { chart: this.chart }, dataGrouping, false);
- this.frozenStates = rangeOptions.preserveDataGrouping;
- }
- // Apply range
- if (type === 'month' || type === 'year') {
- if (!baseAxis) {
- // This is set to the user options and picked up later when the
- // axis is instantiated so that we know the min and max.
- range = rangeOptions;
- }
- else {
- ctx = {
- range: rangeOptions,
- max: newMax,
- chart: chart,
- dataMin: dataMin,
- dataMax: dataMax
- };
- newMin = baseAxis.minFromRange.call(ctx);
- if (isNumber(ctx.newMax)) {
- newMax = ctx.newMax;
- }
- }
- // Fixed times like minutes, hours, days
- }
- else if (range) {
- newMin = Math.max(newMax - range, dataMin);
- newMax = Math.min(newMin + range, dataMax);
- }
- else if (type === 'ytd') {
- // On user clicks on the buttons, or a delayed action running from
- // the beforeRender event (below), the baseAxis is defined.
- if (baseAxis) {
- // When "ytd" is the pre-selected button for the initial view,
- // its calculation is delayed and rerun in the beforeRender
- // event (below). When the series are initialized, but before
- // the chart is rendered, we have access to the xData array
- // (#942).
- if (typeof dataMax === 'undefined') {
- dataMin = Number.MAX_VALUE;
- dataMax = Number.MIN_VALUE;
- chart.series.forEach(function (series) {
- // reassign it to the last item
- var xData = series.xData;
- dataMin = Math.min(xData[0], dataMin);
- dataMax = Math.max(xData[xData.length - 1], dataMax);
- });
- redraw = false;
- }
- ytdExtremes = rangeSelector.getYTDExtremes(dataMax, dataMin, chart.time.useUTC);
- newMin = rangeMin = ytdExtremes.min;
- newMax = ytdExtremes.max;
- // "ytd" is pre-selected. We don't yet have access to processed
- // point and extremes data (things like pointStart and pointInterval
- // are missing), so we delay the process (#942)
- }
- else {
- rangeSelector.deferredYTDClick = i;
- return;
- }
- }
- else if (type === 'all' && baseAxis) {
- newMin = dataMin;
- newMax = dataMax;
- }
- newMin += rangeOptions._offsetMin;
- newMax += rangeOptions._offsetMax;
- rangeSelector.setSelected(i);
- // Update the chart
- if (!baseAxis) {
- // Axis not yet instanciated. Temporarily set min and range
- // options and remove them on chart load (#4317).
- baseXAxisOptions = splat(chart.options.xAxis)[0];
- rangeSetting = baseXAxisOptions.range;
- baseXAxisOptions.range = range;
- minSetting = baseXAxisOptions.min;
- baseXAxisOptions.min = rangeMin;
- addEvent(chart, 'load', function resetMinAndRange() {
- baseXAxisOptions.range = rangeSetting;
- baseXAxisOptions.min = minSetting;
- });
- }
- else {
- // Existing axis object. Set extremes after render time.
- baseAxis.setExtremes(newMin, newMax, pick(redraw, 1), null, // auto animation
- {
- trigger: 'rangeSelectorButton',
- rangeSelectorButton: rangeOptions
- });
- }
- };
- /**
- * Set the selected option. This method only sets the internal flag, it
- * doesn't update the buttons or the actual zoomed range.
- *
- * @private
- * @function Highcharts.RangeSelector#setSelected
- * @param {number} [selected]
- * @return {void}
- */
- RangeSelector.prototype.setSelected = function (selected) {
- this.selected = this.options.selected = selected;
- };
- /**
- * Initialize the range selector
- *
- * @private
- * @function Highcharts.RangeSelector#init
- * @param {Highcharts.Chart} chart
- * @return {void}
- */
- RangeSelector.prototype.init = function (chart) {
- var rangeSelector = this, options = chart.options.rangeSelector, buttonOptions = options.buttons || rangeSelector.defaultButtons.slice(), selectedOption = options.selected, blurInputs = function () {
- var minInput = rangeSelector.minInput, maxInput = rangeSelector.maxInput;
- // #3274 in some case blur is not defined
- if (minInput && minInput.blur) {
- fireEvent(minInput, 'blur');
- }
- if (maxInput && maxInput.blur) {
- fireEvent(maxInput, 'blur');
- }
- };
- rangeSelector.chart = chart;
- rangeSelector.options = options;
- rangeSelector.buttons = [];
- rangeSelector.buttonOptions = buttonOptions;
- this.unMouseDown = addEvent(chart.container, 'mousedown', blurInputs);
- this.unResize = addEvent(chart, 'resize', blurInputs);
- // Extend the buttonOptions with actual range
- buttonOptions.forEach(rangeSelector.computeButtonRange);
- // zoomed range based on a pre-selected button index
- if (typeof selectedOption !== 'undefined' &&
- buttonOptions[selectedOption]) {
- this.clickButton(selectedOption, false);
- }
- addEvent(chart, 'load', function () {
- // If a data grouping is applied to the current button, release it
- // when extremes change
- if (chart.xAxis && chart.xAxis[0]) {
- addEvent(chart.xAxis[0], 'setExtremes', function (e) {
- if (this.max - this.min !==
- chart.fixedRange &&
- e.trigger !== 'rangeSelectorButton' &&
- e.trigger !== 'updatedData' &&
- rangeSelector.forcedDataGrouping &&
- !rangeSelector.frozenStates) {
- this.setDataGrouping(false, false);
- }
- });
- }
- });
- };
- /**
- * Dynamically update the range selector buttons after a new range has been
- * set
- *
- * @private
- * @function Highcharts.RangeSelector#updateButtonStates
- * @return {void}
- */
- RangeSelector.prototype.updateButtonStates = function () {
- var rangeSelector = this, chart = this.chart, baseAxis = chart.xAxis[0], actualRange = Math.round(baseAxis.max - baseAxis.min), hasNoData = !baseAxis.hasVisibleSeries, day = 24 * 36e5, // A single day in milliseconds
- unionExtremes = (chart.scroller &&
- chart.scroller.getUnionExtremes()) || baseAxis, dataMin = unionExtremes.dataMin, dataMax = unionExtremes.dataMax, ytdExtremes = rangeSelector.getYTDExtremes(dataMax, dataMin, chart.time.useUTC), ytdMin = ytdExtremes.min, ytdMax = ytdExtremes.max, selected = rangeSelector.selected, selectedExists = isNumber(selected), allButtonsEnabled = rangeSelector.options.allButtonsEnabled, buttons = rangeSelector.buttons;
- rangeSelector.buttonOptions.forEach(function (rangeOptions, i) {
- var range = rangeOptions._range, type = rangeOptions.type, count = rangeOptions.count || 1, button = buttons[i], state = 0, disable, select, offsetRange = rangeOptions._offsetMax -
- rangeOptions._offsetMin, isSelected = i === selected,
- // Disable buttons where the range exceeds what is allowed in
- // the current view
- isTooGreatRange = range >
- dataMax - dataMin,
- // Disable buttons where the range is smaller than the minimum
- // range
- isTooSmallRange = range < baseAxis.minRange,
- // Do not select the YTD button if not explicitly told so
- isYTDButNotSelected = false,
- // Disable the All button if we're already showing all
- isAllButAlreadyShowingAll = false, isSameRange = range === actualRange;
- // Months and years have a variable range so we check the extremes
- if ((type === 'month' || type === 'year') &&
- (actualRange + 36e5 >=
- { month: 28, year: 365 }[type] * day * count - offsetRange) &&
- (actualRange - 36e5 <=
- { month: 31, year: 366 }[type] * day * count + offsetRange)) {
- isSameRange = true;
- }
- else if (type === 'ytd') {
- isSameRange = (ytdMax - ytdMin + offsetRange) === actualRange;
- isYTDButNotSelected = !isSelected;
- }
- else if (type === 'all') {
- isSameRange = (baseAxis.max - baseAxis.min >=
- dataMax - dataMin);
- isAllButAlreadyShowingAll = (!isSelected &&
- selectedExists &&
- isSameRange);
- }
- // The new zoom area happens to match the range for a button - mark
- // it selected. This happens when scrolling across an ordinal gap.
- // It can be seen in the intraday demos when selecting 1h and scroll
- // across the night gap.
- disable = (!allButtonsEnabled &&
- (isTooGreatRange ||
- isTooSmallRange ||
- isAllButAlreadyShowingAll ||
- hasNoData));
- select = ((isSelected && isSameRange) ||
- (isSameRange && !selectedExists && !isYTDButNotSelected) ||
- (isSelected && rangeSelector.frozenStates));
- if (disable) {
- state = 3;
- }
- else if (select) {
- selectedExists = true; // Only one button can be selected
- state = 2;
- }
- // If state has changed, update the button
- if (button.state !== state) {
- button.setState(state);
- // Reset (#9209)
- if (state === 0 && selected === i) {
- rangeSelector.setSelected(null);
- }
- }
- });
- };
- /**
- * Compute and cache the range for an individual button
- *
- * @private
- * @function Highcharts.RangeSelector#computeButtonRange
- * @param {Highcharts.RangeSelectorButtonsOptions} rangeOptions
- * @return {void}
- */
- RangeSelector.prototype.computeButtonRange = function (rangeOptions) {
- var type = rangeOptions.type, count = rangeOptions.count || 1,
- // these time intervals have a fixed number of milliseconds, as
- // opposed to month, ytd and year
- fixedTimes = {
- millisecond: 1,
- second: 1000,
- minute: 60 * 1000,
- hour: 3600 * 1000,
- day: 24 * 3600 * 1000,
- week: 7 * 24 * 3600 * 1000
- };
- // Store the range on the button object
- if (fixedTimes[type]) {
- rangeOptions._range = fixedTimes[type] * count;
- }
- else if (type === 'month' || type === 'year') {
- rangeOptions._range = {
- month: 30,
- year: 365
- }[type] * 24 * 36e5 * count;
- }
- rangeOptions._offsetMin = pick(rangeOptions.offsetMin, 0);
- rangeOptions._offsetMax = pick(rangeOptions.offsetMax, 0);
- rangeOptions._range +=
- rangeOptions._offsetMax - rangeOptions._offsetMin;
- };
- /**
- * Set the internal and displayed value of a HTML input for the dates
- *
- * @private
- * @function Highcharts.RangeSelector#setInputValue
- * @param {string} name
- * @param {number} [inputTime]
- * @return {void}
- */
- RangeSelector.prototype.setInputValue = function (name, inputTime) {
- var options = this.chart.options.rangeSelector, time = this.chart.time, input = this[name + 'Input'];
- if (defined(inputTime)) {
- input.previousValue = input.HCTime;
- input.HCTime = inputTime;
- }
- input.value = time.dateFormat(options.inputEditDateFormat || '%Y-%m-%d', input.HCTime);
- this[name + 'DateBox'].attr({
- text: time.dateFormat(options.inputDateFormat || '%b %e, %Y', input.HCTime)
- });
- };
- /**
- * @private
- * @function Highcharts.RangeSelector#showInput
- * @param {string} name
- * @return {void}
- */
- RangeSelector.prototype.showInput = function (name) {
- var inputGroup = this.inputGroup, dateBox = this[name + 'DateBox'];
- css(this[name + 'Input'], {
- left: (inputGroup.translateX + dateBox.x) + 'px',
- top: inputGroup.translateY + 'px',
- width: (dateBox.width - 2) + 'px',
- height: (dateBox.height - 2) + 'px',
- border: '2px solid silver'
- });
- };
- /**
- * @private
- * @function Highcharts.RangeSelector#hideInput
- * @param {string} name
- * @return {void}
- */
- RangeSelector.prototype.hideInput = function (name) {
- css(this[name + 'Input'], {
- border: 0,
- width: '1px',
- height: '1px'
- });
- this.setInputValue(name);
- };
- /**
- * Draw either the 'from' or the 'to' HTML input box of the range selector
- *
- * @private
- * @function Highcharts.RangeSelector#drawInput
- * @param {string} name
- * @return {void}
- */
- RangeSelector.prototype.drawInput = function (name) {
- var rangeSelector = this, chart = rangeSelector.chart, chartStyle = chart.renderer.style || {}, renderer = chart.renderer, options = chart.options.rangeSelector, lang = defaultOptions.lang, div = rangeSelector.div, isMin = name === 'min', input, label, dateBox, inputGroup = this.inputGroup;
- /**
- * @private
- */
- function updateExtremes() {
- var inputValue = input.value, value = (options.inputDateParser || Date.parse)(inputValue), chartAxis = chart.xAxis[0], dataAxis = chart.scroller && chart.scroller.xAxis ?
- chart.scroller.xAxis :
- chartAxis, dataMin = dataAxis.dataMin, dataMax = dataAxis.dataMax;
- if (value !== input.previousValue) {
- input.previousValue = value;
- // If the value isn't parsed directly to a value by the
- // browser's Date.parse method, like YYYY-MM-DD in IE, try
- // parsing it a different way
- if (!isNumber(value)) {
- value = inputValue.split('-');
- value = Date.UTC(pInt(value[0]), pInt(value[1]) - 1, pInt(value[2]));
- }
- if (isNumber(value)) {
- // Correct for timezone offset (#433)
- if (!chart.time.useUTC) {
- value =
- value + new Date().getTimezoneOffset() * 60 * 1000;
- }
- // Validate the extremes. If it goes beyound the data min or
- // max, use the actual data extreme (#2438).
- if (isMin) {
- if (value > rangeSelector.maxInput.HCTime) {
- value = void 0;
- }
- else if (value < dataMin) {
- value = dataMin;
- }
- }
- else {
- if (value < rangeSelector.minInput.HCTime) {
- value = void 0;
- }
- else if (value > dataMax) {
- value = dataMax;
- }
- }
- // Set the extremes
- if (typeof value !== 'undefined') { // @todo typof undefined
- chartAxis.setExtremes(isMin ? value : chartAxis.min, isMin ? chartAxis.max : value, void 0, void 0, { trigger: 'rangeSelectorInput' });
- }
- }
- }
- }
- // Create the text label
- this[name + 'Label'] = label = renderer
- .label(lang[isMin ? 'rangeSelectorFrom' : 'rangeSelectorTo'], this.inputGroup.offset)
- .addClass('highcharts-range-label')
- .attr({
- padding: 2
- })
- .add(inputGroup);
- inputGroup.offset += label.width + 5;
- // Create an SVG label that shows updated date ranges and and records
- // click events that bring in the HTML input.
- this[name + 'DateBox'] = dateBox = renderer
- .label('', inputGroup.offset)
- .addClass('highcharts-range-input')
- .attr({
- padding: 2,
- width: options.inputBoxWidth || 90,
- height: options.inputBoxHeight || 17,
- 'text-align': 'center'
- })
- .on('click', function () {
- // If it is already focused, the onfocus event doesn't fire
- // (#3713)
- rangeSelector.showInput(name);
- rangeSelector[name + 'Input'].focus();
- });
- if (!chart.styledMode) {
- dateBox.attr({
- stroke: options.inputBoxBorderColor || '#cccccc',
- 'stroke-width': 1
- });
- }
- dateBox.add(inputGroup);
- inputGroup.offset += dateBox.width + (isMin ? 10 : 0);
- // Create the HTML input element. This is rendered as 1x1 pixel then set
- // to the right size when focused.
- this[name + 'Input'] = input = createElement('input', {
- name: name,
- className: 'highcharts-range-selector',
- type: 'text'
- }, {
- top: chart.plotTop + 'px' // prevent jump on focus in Firefox
- }, div);
- if (!chart.styledMode) {
- // Styles
- label.css(merge(chartStyle, options.labelStyle));
- dateBox.css(merge({
- color: '#333333'
- }, chartStyle, options.inputStyle));
- css(input, extend({
- position: 'absolute',
- border: 0,
- width: '1px',
- height: '1px',
- padding: 0,
- textAlign: 'center',
- fontSize: chartStyle.fontSize,
- fontFamily: chartStyle.fontFamily,
- top: '-9999em' // #4798
- }, options.inputStyle));
- }
- // Blow up the input box
- input.onfocus = function () {
- rangeSelector.showInput(name);
- };
- // Hide away the input box
- input.onblur = function () {
- // update extermes only when inputs are active
- if (input === H.doc.activeElement) { // Only when focused
- // Update also when no `change` event is triggered, like when
- // clicking inside the SVG (#4710)
- updateExtremes();
- }
- // #10404 - move hide and blur outside focus
- rangeSelector.hideInput(name);
- input.blur(); // #4606
- };
- // handle changes in the input boxes
- input.onchange = updateExtremes;
- input.onkeypress = function (event) {
- // IE does not fire onchange on enter
- if (event.keyCode === 13) {
- updateExtremes();
- }
- };
- };
- /**
- * Get the position of the range selector buttons and inputs. This can be
- * overridden from outside for custom positioning.
- *
- * @private
- * @function Highcharts.RangeSelector#getPosition
- *
- * @return {Highcharts.Dictionary<number>}
- */
- RangeSelector.prototype.getPosition = function () {
- var chart = this.chart, options = chart.options.rangeSelector, top = options.verticalAlign === 'top' ?
- chart.plotTop - chart.axisOffset[0] :
- 0; // set offset only for varticalAlign top
- return {
- buttonTop: top + options.buttonPosition.y,
- inputTop: top + options.inputPosition.y - 10
- };
- };
- /**
- * Get the extremes of YTD. Will choose dataMax if its value is lower than
- * the current timestamp. Will choose dataMin if its value is higher than
- * the timestamp for the start of current year.
- *
- * @private
- * @function Highcharts.RangeSelector#getYTDExtremes
- *
- * @param {number} dataMax
- *
- * @param {number} dataMin
- *
- * @return {*}
- * Returns min and max for the YTD
- */
- RangeSelector.prototype.getYTDExtremes = function (dataMax, dataMin, useUTC) {
- var time = this.chart.time, min, now = new time.Date(dataMax), year = time.get('FullYear', now), startOfYear = useUTC ?
- time.Date.UTC(year, 0, 1) : // eslint-disable-line new-cap
- +new time.Date(year, 0, 1);
- min = Math.max(dataMin || 0, startOfYear);
- now = now.getTime();
- return {
- max: Math.min(dataMax || now, now),
- min: min
- };
- };
- /**
- * Render the range selector including the buttons and the inputs. The first
- * time render is called, the elements are created and positioned. On
- * subsequent calls, they are moved and updated.
- *
- * @private
- * @function Highcharts.RangeSelector#render
- * @param {number} [min]
- * X axis minimum
- * @param {number} [max]
- * X axis maximum
- * @return {void}
- */
- RangeSelector.prototype.render = function (min, max) {
- var rangeSelector = this, chart = rangeSelector.chart, renderer = chart.renderer, container = chart.container, chartOptions = chart.options, navButtonOptions = (chartOptions.exporting &&
- chartOptions.exporting.enabled !== false &&
- chartOptions.navigation &&
- chartOptions.navigation.buttonOptions), lang = defaultOptions.lang, div = rangeSelector.div, options = chartOptions.rangeSelector,
- // Place inputs above the container
- inputsZIndex = pick(chartOptions.chart.style &&
- chartOptions.chart.style.zIndex, 0) + 1, floating = options.floating, buttons = rangeSelector.buttons, inputGroup = rangeSelector.inputGroup, buttonTheme = options.buttonTheme, buttonPosition = options.buttonPosition, inputPosition = options.inputPosition, inputEnabled = options.inputEnabled, states = buttonTheme && buttonTheme.states, plotLeft = chart.plotLeft, buttonLeft, buttonGroup = rangeSelector.buttonGroup, group, groupHeight, rendered = rangeSelector.rendered, verticalAlign = rangeSelector.options.verticalAlign, legend = chart.legend, legendOptions = legend && legend.options, buttonPositionY = buttonPosition.y, inputPositionY = inputPosition.y, animate = chart.hasLoaded, verb = animate ? 'animate' : 'attr', exportingX = 0, alignTranslateY, legendHeight, minPosition, translateY = 0, translateX;
- if (options.enabled === false) {
- return;
- }
- // create the elements
- if (!rendered) {
- rangeSelector.group = group = renderer.g('range-selector-group')
- .attr({
- zIndex: 7
- })
- .add();
- rangeSelector.buttonGroup = buttonGroup =
- renderer.g('range-selector-buttons').add(group);
- rangeSelector.zoomText = renderer
- .text(lang.rangeSelectorZoom, 0, 15)
- .add(buttonGroup);
- if (!chart.styledMode) {
- rangeSelector.zoomText.css(options.labelStyle);
- buttonTheme['stroke-width'] =
- pick(buttonTheme['stroke-width'], 0);
- }
- rangeSelector.buttonOptions.forEach(function (rangeOptions, i) {
- buttons[i] = renderer
- .button(rangeOptions.text, 0, 0, function (e) {
- // extract events from button object and call
- var buttonEvents = (rangeOptions.events &&
- rangeOptions.events.click), callDefaultEvent;
- if (buttonEvents) {
- callDefaultEvent =
- buttonEvents.call(rangeOptions, e);
- }
- if (callDefaultEvent !== false) {
- rangeSelector.clickButton(i);
- }
- rangeSelector.isActive = true;
- }, buttonTheme, states && states.hover, states && states.select, states && states.disabled)
- .attr({
- 'text-align': 'center'
- })
- .add(buttonGroup);
- });
- // first create a wrapper outside the container in order to make
- // the inputs work and make export correct
- if (inputEnabled !== false) {
- rangeSelector.div = div = createElement('div', null, {
- position: 'relative',
- height: 0,
- zIndex: inputsZIndex
- });
- container.parentNode.insertBefore(div, container);
- // Create the group to keep the inputs
- rangeSelector.inputGroup = inputGroup =
- renderer.g('input-group').add(group);
- inputGroup.offset = 0;
- rangeSelector.drawInput('min');
- rangeSelector.drawInput('max');
- }
- }
- // #8769, allow dynamically updating margins
- rangeSelector.zoomText[verb]({
- x: pick(plotLeft + buttonPosition.x, plotLeft)
- });
- // button start position
- buttonLeft = pick(plotLeft + buttonPosition.x, plotLeft) +
- rangeSelector.zoomText.getBBox().width + 5;
- rangeSelector.buttonOptions.forEach(function (rangeOptions, i) {
- buttons[i][verb]({ x: buttonLeft });
- // increase button position for the next button
- buttonLeft += buttons[i].width + pick(options.buttonSpacing, 5);
- });
- plotLeft = chart.plotLeft - chart.spacing[3];
- rangeSelector.updateButtonStates();
- // detect collisiton with exporting
- if (navButtonOptions &&
- this.titleCollision(chart) &&
- verticalAlign === 'top' &&
- buttonPosition.align === 'right' && ((buttonPosition.y +
- buttonGroup.getBBox().height - 12) <
- ((navButtonOptions.y || 0) +
- navButtonOptions.height))) {
- exportingX = -40;
- }
- translateX = buttonPosition.x - chart.spacing[3];
- if (buttonPosition.align === 'right') {
- translateX += exportingX - plotLeft; // (#13014)
- }
- else if (buttonPosition.align === 'center') {
- translateX -= plotLeft / 2;
- }
- // align button group
- buttonGroup.align({
- y: buttonPosition.y,
- width: buttonGroup.getBBox().width,
- align: buttonPosition.align,
- x: translateX
- }, true, chart.spacingBox);
- // skip animation
- rangeSelector.group.placed = animate;
- rangeSelector.buttonGroup.placed = animate;
- if (inputEnabled !== false) {
- var inputGroupX, inputGroupWidth, buttonGroupX, buttonGroupWidth;
- // detect collision with exporting
- if (navButtonOptions &&
- this.titleCollision(chart) &&
- verticalAlign === 'top' &&
- inputPosition.align === 'right' && ((inputPosition.y -
- inputGroup.getBBox().height - 12) <
- ((navButtonOptions.y || 0) +
- navButtonOptions.height +
- chart.spacing[0]))) {
- exportingX = -40;
- }
- else {
- exportingX = 0;
- }
- if (inputPosition.align === 'left') {
- translateX = plotLeft;
- }
- else if (inputPosition.align === 'right') {
- translateX = -Math.max(chart.axisOffset[1], -exportingX);
- }
- // Update the alignment to the updated spacing box
- inputGroup.align({
- y: inputPosition.y,
- width: inputGroup.getBBox().width,
- align: inputPosition.align,
- // fix wrong getBBox() value on right align
- x: inputPosition.x + translateX - 2
- }, true, chart.spacingBox);
- // detect collision
- inputGroupX = (inputGroup.alignAttr.translateX +
- inputGroup.alignOptions.x -
- exportingX +
- // getBBox for detecing left margin
- inputGroup.getBBox().x +
- // 2px padding to not overlap input and label
- 2);
- inputGroupWidth = inputGroup.alignOptions.width;
- buttonGroupX = buttonGroup.alignAttr.translateX +
- buttonGroup.getBBox().x;
- // 20 is minimal spacing between elements
- buttonGroupWidth = buttonGroup.getBBox().width + 20;
- if ((inputPosition.align ===
- buttonPosition.align) || ((buttonGroupX + buttonGroupWidth > inputGroupX) &&
- (inputGroupX + inputGroupWidth > buttonGroupX) &&
- (buttonPositionY <
- (inputPositionY +
- inputGroup.getBBox().height)))) {
- inputGroup.attr({
- translateX: inputGroup.alignAttr.translateX +
- (chart.axisOffset[1] >= -exportingX ? 0 : -exportingX),
- translateY: inputGroup.alignAttr.translateY +
- buttonGroup.getBBox().height + 10
- });
- }
- // Set or reset the input values
- rangeSelector.setInputValue('min', min);
- rangeSelector.setInputValue('max', max);
- // skip animation
- rangeSelector.inputGroup.placed = animate;
- }
- // vertical align
- rangeSelector.group.align({
- verticalAlign: verticalAlign
- }, true, chart.spacingBox);
- // set position
- groupHeight =
- rangeSelector.group.getBBox().height + 20; // # 20 padding
- alignTranslateY =
- rangeSelector.group.alignAttr.translateY;
- // calculate bottom position
- if (verticalAlign === 'bottom') {
- legendHeight = (legendOptions &&
- legendOptions.verticalAlign === 'bottom' &&
- legendOptions.enabled &&
- !legendOptions.floating ?
- legend.legendHeight + pick(legendOptions.margin, 10) :
- 0);
- groupHeight = groupHeight + legendHeight - 20;
- translateY = (alignTranslateY -
- groupHeight -
- (floating ? 0 : options.y) -
- (chart.titleOffset ? chart.titleOffset[2] : 0) -
- 10 // 10 spacing
- );
- }
- if (verticalAlign === 'top') {
- if (floating) {
- translateY = 0;
- }
- if (chart.titleOffset && chart.titleOffset[0]) {
- translateY = chart.titleOffset[0];
- }
- translateY += ((chart.margin[0] - chart.spacing[0]) || 0);
- }
- else if (verticalAlign === 'middle') {
- if (inputPositionY === buttonPositionY) {
- if (inputPositionY < 0) {
- translateY = alignTranslateY + minPosition;
- }
- else {
- translateY = alignTranslateY;
- }
- }
- else if (inputPositionY || buttonPositionY) {
- if (inputPositionY < 0 ||
- buttonPositionY < 0) {
- translateY -= Math.min(inputPositionY, buttonPositionY);
- }
- else {
- translateY =
- alignTranslateY - groupHeight + minPosition;
- }
- }
- }
- rangeSelector.group.translate(options.x, options.y + Math.floor(translateY));
- // translate HTML inputs
- if (inputEnabled !== false) {
- rangeSelector.minInput.style.marginTop =
- rangeSelector.group.translateY + 'px';
- rangeSelector.maxInput.style.marginTop =
- rangeSelector.group.translateY + 'px';
- }
- rangeSelector.rendered = true;
- };
- /**
- * Extracts height of range selector
- *
- * @private
- * @function Highcharts.RangeSelector#getHeight
- * @return {number}
- * Returns rangeSelector height
- */
- RangeSelector.prototype.getHeight = function () {
- var rangeSelector = this, options = rangeSelector.options, rangeSelectorGroup = rangeSelector.group, inputPosition = options.inputPosition, buttonPosition = options.buttonPosition, yPosition = options.y, buttonPositionY = buttonPosition.y, inputPositionY = inputPosition.y, rangeSelectorHeight = 0, minPosition;
- if (options.height) {
- return options.height;
- }
- rangeSelectorHeight = rangeSelectorGroup ?
- // 13px to keep back compatibility
- (rangeSelectorGroup.getBBox(true).height) + 13 +
- yPosition :
- 0;
- minPosition = Math.min(inputPositionY, buttonPositionY);
- if ((inputPositionY < 0 && buttonPositionY < 0) ||
- (inputPositionY > 0 && buttonPositionY > 0)) {
- rangeSelectorHeight += Math.abs(minPosition);
- }
- return rangeSelectorHeight;
- };
- /**
- * Detect collision with title or subtitle
- *
- * @private
- * @function Highcharts.RangeSelector#titleCollision
- *
- * @param {Highcharts.Chart} chart
- *
- * @return {boolean}
- * Returns collision status
- */
- RangeSelector.prototype.titleCollision = function (chart) {
- return !(chart.options.title.text ||
- chart.options.subtitle.text);
- };
- /**
- * Update the range selector with new options
- *
- * @private
- * @function Highcharts.RangeSelector#update
- * @param {Highcharts.RangeSelectorOptions} options
- * @return {void}
- */
- RangeSelector.prototype.update = function (options) {
- var chart = this.chart;
- merge(true, chart.options.rangeSelector, options);
- this.destroy();
- this.init(chart);
- chart.rangeSelector.render();
- };
- /**
- * Destroys allocated elements.
- *
- * @private
- * @function Highcharts.RangeSelector#destroy
- */
- RangeSelector.prototype.destroy = function () {
- var rSelector = this, minInput = rSelector.minInput, maxInput = rSelector.maxInput;
- rSelector.unMouseDown();
- rSelector.unResize();
- // Destroy elements in collections
- destroyObjectProperties(rSelector.buttons);
- // Clear input element events
- if (minInput) {
- minInput.onfocus = minInput.onblur = minInput.onchange = null;
- }
- if (maxInput) {
- maxInput.onfocus = maxInput.onblur = maxInput.onchange = null;
- }
- // Destroy HTML and SVG elements
- objectEach(rSelector, function (val, key) {
- if (val && key !== 'chart') {
- if (val instanceof SVGElement) {
- // SVGElement
- val.destroy();
- }
- else if (val instanceof window.HTMLElement) {
- // HTML element
- discardElement(val);
- }
- }
- if (val !== RangeSelector.prototype[key]) {
- rSelector[key] = null;
- }
- }, this);
- };
- return RangeSelector;
- }());
- /**
- * The default buttons for pre-selecting time frames
- */
- RangeSelector.prototype.defaultButtons = [{
- type: 'month',
- count: 1,
- text: '1m'
- }, {
- type: 'month',
- count: 3,
- text: '3m'
- }, {
- type: 'month',
- count: 6,
- text: '6m'
- }, {
- type: 'ytd',
- text: 'YTD'
- }, {
- type: 'year',
- count: 1,
- text: '1y'
- }, {
- type: 'all',
- text: 'All'
- }];
- /**
- * Get the axis min value based on the range option and the current max. For
- * stock charts this is extended via the {@link RangeSelector} so that if the
- * selected range is a multiple of months or years, it is compensated for
- * various month lengths.
- *
- * @private
- * @function Highcharts.Axis#minFromRange
- * @return {number|undefined}
- * The new minimum value.
- */
- Axis.prototype.minFromRange = function () {
- var rangeOptions = this.range, type = rangeOptions.type, min, max = this.max, dataMin, range, time = this.chart.time,
- // Get the true range from a start date
- getTrueRange = function (base, count) {
- var timeName = type === 'year' ? 'FullYear' : 'Month';
- var date = new time.Date(base);
- var basePeriod = time.get(timeName, date);
- time.set(timeName, date, basePeriod + count);
- if (basePeriod === time.get(timeName, date)) {
- time.set('Date', date, 0); // #6537
- }
- return date.getTime() - base;
- };
- if (isNumber(rangeOptions)) {
- min = max - rangeOptions;
- range = rangeOptions;
- }
- else {
- min = max + getTrueRange(max, -rangeOptions.count);
- // Let the fixedRange reflect initial settings (#5930)
- if (this.chart) {
- this.chart.fixedRange = max - min;
- }
- }
- dataMin = pick(this.dataMin, Number.MIN_VALUE);
- if (!isNumber(min)) {
- min = dataMin;
- }
- if (min <= dataMin) {
- min = dataMin;
- if (typeof range === 'undefined') { // #4501
- range = getTrueRange(min, rangeOptions.count);
- }
- this.newMax = Math.min(min + range, this.dataMax);
- }
- if (!isNumber(max)) {
- min = void 0;
- }
- return min;
- };
- if (!H.RangeSelector) {
- // Initialize rangeselector for stock charts
- addEvent(Chart, 'afterGetContainer', function () {
- if (this.options.rangeSelector.enabled) {
- this.rangeSelector = new RangeSelector(this);
- }
- });
- addEvent(Chart, 'beforeRender', function () {
- var chart = this, axes = chart.axes, rangeSelector = chart.rangeSelector, verticalAlign;
- if (rangeSelector) {
- if (isNumber(rangeSelector.deferredYTDClick)) {
- rangeSelector.clickButton(rangeSelector.deferredYTDClick);
- delete rangeSelector.deferredYTDClick;
- }
- axes.forEach(function (axis) {
- axis.updateNames();
- axis.setScale();
- });
- chart.getAxisMargins();
- rangeSelector.render();
- verticalAlign = rangeSelector.options.verticalAlign;
- if (!rangeSelector.options.floating) {
- if (verticalAlign === 'bottom') {
- this.extraBottomMargin = true;
- }
- else if (verticalAlign !== 'middle') {
- this.extraTopMargin = true;
- }
- }
- }
- });
- addEvent(Chart, 'update', function (e) {
- var chart = this, options = e.options, optionsRangeSelector = options.rangeSelector, rangeSelector = chart.rangeSelector, verticalAlign, extraBottomMarginWas = this.extraBottomMargin, extraTopMarginWas = this.extraTopMargin;
- if (optionsRangeSelector &&
- optionsRangeSelector.enabled &&
- !defined(rangeSelector)) {
- this.options.rangeSelector.enabled = true;
- this.rangeSelector = new RangeSelector(this);
- }
- this.extraBottomMargin = false;
- this.extraTopMargin = false;
- if (rangeSelector) {
- rangeSelector.render();
- verticalAlign = (optionsRangeSelector &&
- optionsRangeSelector.verticalAlign) || (rangeSelector.options && rangeSelector.options.verticalAlign);
- if (!rangeSelector.options.floating) {
- if (verticalAlign === 'bottom') {
- this.extraBottomMargin = true;
- }
- else if (verticalAlign !== 'middle') {
- this.extraTopMargin = true;
- }
- }
- if (this.extraBottomMargin !== extraBottomMarginWas ||
- this.extraTopMargin !== extraTopMarginWas) {
- this.isDirtyBox = true;
- }
- }
- });
- addEvent(Chart, 'render', function () {
- var chart = this, rangeSelector = chart.rangeSelector, verticalAlign;
- if (rangeSelector && !rangeSelector.options.floating) {
- rangeSelector.render();
- verticalAlign = rangeSelector.options.verticalAlign;
- if (verticalAlign === 'bottom') {
- this.extraBottomMargin = true;
- }
- else if (verticalAlign !== 'middle') {
- this.extraTopMargin = true;
- }
- }
- });
- addEvent(Chart, 'getMargins', function () {
- var rangeSelector = this.rangeSelector, rangeSelectorHeight;
- if (rangeSelector) {
- rangeSelectorHeight = rangeSelector.getHeight();
- if (this.extraTopMargin) {
- this.plotTop += rangeSelectorHeight;
- }
- if (this.extraBottomMargin) {
- this.marginBottom += rangeSelectorHeight;
- }
- }
- });
- Chart.prototype.callbacks.push(function (chart) {
- var extremes, rangeSelector = chart.rangeSelector, unbindRender, unbindSetExtremes, legend, alignTo, verticalAlign;
- /**
- * @private
- */
- function renderRangeSelector() {
- extremes = chart.xAxis[0].getExtremes();
- legend = chart.legend;
- verticalAlign = rangeSelector === null || rangeSelector === void 0 ? void 0 : rangeSelector.options.verticalAlign;
- if (isNumber(extremes.min)) {
- rangeSelector.render(extremes.min, extremes.max);
- }
- // Re-align the legend so that it's below the rangeselector
- if (rangeSelector && legend.display &&
- verticalAlign === 'top' &&
- verticalAlign === legend.options.verticalAlign) {
- // Create a new alignment box for the legend.
- alignTo = merge(chart.spacingBox);
- if (legend.options.layout === 'vertical') {
- alignTo.y = chart.plotTop;
- }
- else {
- alignTo.y += rangeSelector.getHeight();
- }
- legend.group.placed = false; // Don't animate the alignment.
- legend.align(alignTo);
- }
- }
- if (rangeSelector) {
- // redraw the scroller on setExtremes
- unbindSetExtremes = addEvent(chart.xAxis[0], 'afterSetExtremes', function (e) {
- rangeSelector.render(e.min, e.max);
- });
- // redraw the scroller chart resize
- unbindRender = addEvent(chart, 'redraw', renderRangeSelector);
- // do it now
- renderRangeSelector();
- }
- // Remove resize/afterSetExtremes at chart destroy
- addEvent(chart, 'destroy', function destroyEvents() {
- if (rangeSelector) {
- unbindRender();
- unbindSetExtremes();
- }
- });
- });
- H.RangeSelector = RangeSelector;
- }
- return H.RangeSelector;
- });
- _registerModule(_modules, 'parts/StockChart.js', [_modules['parts/Axis.js'], _modules['parts/Chart.js'], _modules['parts/Globals.js'], _modules['parts/Point.js'], _modules['parts/SVGRenderer.js'], _modules['parts/Utilities.js']], function (Axis, Chart, H, Point, SVGRenderer, U) {
- /* *
- *
- * (c) 2010-2020 Torstein Honsi
- *
- * License: www.highcharts.com/license
- *
- * !!!!!!! SOURCE GETS TRANSPILED BY TYPESCRIPT. EDIT TS FILE ONLY. !!!!!!!
- *
- * */
- var addEvent = U.addEvent, arrayMax = U.arrayMax, arrayMin = U.arrayMin, clamp = U.clamp, defined = U.defined, extend = U.extend, find = U.find, format = U.format, getOptions = U.getOptions, isNumber = U.isNumber, isString = U.isString, merge = U.merge, pick = U.pick, splat = U.splat;
- // Has a dependency on Navigator due to the use of
- // defaultOptions.navigator
- // Has a dependency on Scrollbar due to the use of
- // defaultOptions.scrollbar
- // Has a dependency on RangeSelector due to the use of
- // defaultOptions.rangeSelector
- var Series = H.Series, seriesProto = Series.prototype, seriesInit = seriesProto.init, seriesProcessData = seriesProto.processData, pointTooltipFormatter = Point.prototype.tooltipFormatter;
- /**
- * Compare the values of the series against the first non-null, non-
- * zero value in the visible range. The y axis will show percentage
- * or absolute change depending on whether `compare` is set to `"percent"`
- * or `"value"`. When this is applied to multiple series, it allows
- * comparing the development of the series against each other. Adds
- * a `change` field to every point object.
- *
- * @see [compareBase](#plotOptions.series.compareBase)
- * @see [Axis.setCompare()](/class-reference/Highcharts.Axis#setCompare)
- *
- * @sample {highstock} stock/plotoptions/series-compare-percent/
- * Percent
- * @sample {highstock} stock/plotoptions/series-compare-value/
- * Value
- *
- * @type {string}
- * @since 1.0.1
- * @product highstock
- * @apioption plotOptions.series.compare
- */
- /**
- * Defines if comparison should start from the first point within the visible
- * range or should start from the first point **before** the range.
- *
- * In other words, this flag determines if first point within the visible range
- * will have 0% (`compareStart=true`) or should have been already calculated
- * according to the previous point (`compareStart=false`).
- *
- * @sample {highstock} stock/plotoptions/series-comparestart/
- * Calculate compare within visible range
- *
- * @type {boolean}
- * @default false
- * @since 6.0.0
- * @product highstock
- * @apioption plotOptions.series.compareStart
- */
- /**
- * When [compare](#plotOptions.series.compare) is `percent`, this option
- * dictates whether to use 0 or 100 as the base of comparison.
- *
- * @sample {highstock} stock/plotoptions/series-comparebase/
- * Compare base is 100
- *
- * @type {number}
- * @default 0
- * @since 5.0.6
- * @product highstock
- * @validvalue [0, 100]
- * @apioption plotOptions.series.compareBase
- */
- /* eslint-disable no-invalid-this, valid-jsdoc */
- /**
- * Factory function for creating new stock charts. Creates a new
- * {@link Highcharts.Chart|Chart} object with different default options than the
- * basic Chart.
- *
- * @example
- * var chart = Highcharts.stockChart('container', {
- * series: [{
- * data: [1, 2, 3, 4, 5, 6, 7, 8, 9],
- * pointInterval: 24 * 60 * 60 * 1000
- * }]
- * });
- *
- * @function Highcharts.stockChart
- *
- * @param {string|Highcharts.HTMLDOMElement} [renderTo]
- * The DOM element to render to, or its id.
- *
- * @param {Highcharts.Options} options
- * The chart options structure as described in the
- * [options reference](https://api.highcharts.com/highstock).
- *
- * @param {Highcharts.ChartCallbackFunction} [callback]
- * A function to execute when the chart object is finished loading and
- * rendering. In most cases the chart is built in one thread, but in
- * Internet Explorer version 8 or less the chart is sometimes
- * initialized before the document is ready, and in these cases the
- * chart object will not be finished synchronously. As a consequence,
- * code that relies on the newly built Chart object should always run in
- * the callback. Defining a
- * [chart.events.load](https://api.highcharts.com/highstock/chart.events.load)
- * handler is equivalent.
- *
- * @return {Highcharts.Chart}
- * The chart object.
- */
- H.StockChart = H.stockChart = function (a, b, c) {
- var hasRenderToArg = isString(a) || a.nodeName, options = arguments[hasRenderToArg ? 1 : 0], userOptions = options,
- // to increase performance, don't merge the data
- seriesOptions = options.series, defaultOptions = getOptions(), opposite,
- // Always disable startOnTick:true on the main axis when the navigator
- // is enabled (#1090)
- navigatorEnabled = pick(options.navigator && options.navigator.enabled, defaultOptions.navigator.enabled, true);
- // apply X axis options to both single and multi y axes
- options.xAxis = splat(options.xAxis || {}).map(function (xAxisOptions, i) {
- return merge({
- minPadding: 0,
- maxPadding: 0,
- overscroll: 0,
- ordinal: true,
- title: {
- text: null
- },
- labels: {
- overflow: 'justify'
- },
- showLastLabel: true
- }, defaultOptions.xAxis, // #3802
- defaultOptions.xAxis && defaultOptions.xAxis[i], // #7690
- xAxisOptions, // user options
- {
- type: 'datetime',
- categories: null
- }, (navigatorEnabled ? {
- startOnTick: false,
- endOnTick: false
- } : null));
- });
- // apply Y axis options to both single and multi y axes
- options.yAxis = splat(options.yAxis || {}).map(function (yAxisOptions, i) {
- opposite = pick(yAxisOptions.opposite, true);
- return merge({
- labels: {
- y: -2
- },
- opposite: opposite,
- /**
- * @default {highcharts} true
- * @default {highstock} false
- * @apioption yAxis.showLastLabel
- *
- * @private
- */
- showLastLabel: !!(
- // #6104, show last label by default for category axes
- yAxisOptions.categories ||
- yAxisOptions.type === 'category'),
- title: {
- text: null
- }
- }, defaultOptions.yAxis, // #3802
- defaultOptions.yAxis && defaultOptions.yAxis[i], // #7690
- yAxisOptions // user options
- );
- });
- options.series = null;
- options = merge({
- chart: {
- panning: {
- enabled: true,
- type: 'x'
- },
- pinchType: 'x'
- },
- navigator: {
- enabled: navigatorEnabled
- },
- scrollbar: {
- // #4988 - check if setOptions was called
- enabled: pick(defaultOptions.scrollbar.enabled, true)
- },
- rangeSelector: {
- // #4988 - check if setOptions was called
- enabled: pick(defaultOptions.rangeSelector.enabled, true)
- },
- title: {
- text: null
- },
- tooltip: {
- split: pick(defaultOptions.tooltip.split, true),
- crosshairs: true
- },
- legend: {
- enabled: false
- }
- }, options, // user's options
- {
- isStock: true // internal flag
- });
- options.series = userOptions.series = seriesOptions;
- return hasRenderToArg ?
- new Chart(a, options, c) :
- new Chart(options, b);
- };
- // Handle som Stock-specific series defaults, override the plotOptions before
- // series options are handled.
- addEvent(Series, 'setOptions', function (e) {
- var overrides;
- if (this.chart.options.isStock) {
- if (this.is('column') || this.is('columnrange')) {
- overrides = {
- borderWidth: 0,
- shadow: false
- };
- }
- else if (!this.is('scatter') && !this.is('sma')) {
- overrides = {
- marker: {
- enabled: false,
- radius: 2
- }
- };
- }
- if (overrides) {
- e.plotOptions[this.type] = merge(e.plotOptions[this.type], overrides);
- }
- }
- });
- // Override the automatic label alignment so that the first Y axis' labels
- // are drawn on top of the grid line, and subsequent axes are drawn outside
- addEvent(Axis, 'autoLabelAlign', function (e) {
- var chart = this.chart, options = this.options, panes = chart._labelPanes = chart._labelPanes || {}, key, labelOptions = this.options.labels;
- if (this.chart.options.isStock && this.coll === 'yAxis') {
- key = options.top + ',' + options.height;
- // do it only for the first Y axis of each pane
- if (!panes[key] && labelOptions.enabled) {
- if (labelOptions.x === 15) { // default
- labelOptions.x = 0;
- }
- if (typeof labelOptions.align === 'undefined') {
- labelOptions.align = 'right';
- }
- panes[key] = this;
- e.align = 'right';
- e.preventDefault();
- }
- }
- });
- // Clear axis from label panes (#6071)
- addEvent(Axis, 'destroy', function () {
- var chart = this.chart, key = this.options && (this.options.top + ',' + this.options.height);
- if (key && chart._labelPanes && chart._labelPanes[key] === this) {
- delete chart._labelPanes[key];
- }
- });
- // Override getPlotLinePath to allow for multipane charts
- addEvent(Axis, 'getPlotLinePath', function (e) {
- var axis = this, series = (this.isLinked && !this.series ?
- this.linkedParent.series :
- this.series), chart = axis.chart, renderer = chart.renderer, axisLeft = axis.left, axisTop = axis.top, x1, y1, x2, y2, result = [], axes = [], // #3416 need a default array
- axes2, uniqueAxes, translatedValue = e.translatedValue, value = e.value, force = e.force, transVal;
- /**
- * Return the other axis based on either the axis option or on related
- * series.
- * @private
- */
- function getAxis(coll) {
- var otherColl = coll === 'xAxis' ? 'yAxis' : 'xAxis', opt = axis.options[otherColl];
- // Other axis indexed by number
- if (isNumber(opt)) {
- return [chart[otherColl][opt]];
- }
- // Other axis indexed by id (like navigator)
- if (isString(opt)) {
- return [chart.get(opt)];
- }
- // Auto detect based on existing series
- return series.map(function (s) {
- return s[otherColl];
- });
- }
- if ( // For stock chart, by default render paths across the panes
- // except the case when `acrossPanes` is disabled by user (#6644)
- (chart.options.isStock && e.acrossPanes !== false) &&
- // Ignore in case of colorAxis or zAxis. #3360, #3524, #6720
- axis.coll === 'xAxis' || axis.coll === 'yAxis') {
- e.preventDefault();
- // Get the related axes based on series
- axes = getAxis(axis.coll);
- // Get the related axes based options.*Axis setting #2810
- axes2 = (axis.isXAxis ? chart.yAxis : chart.xAxis);
- axes2.forEach(function (A) {
- if (defined(A.options.id) ?
- A.options.id.indexOf('navigator') === -1 :
- true) {
- var a = (A.isXAxis ? 'yAxis' : 'xAxis'), rax = (defined(A.options[a]) ?
- chart[a][A.options[a]] :
- chart[a][0]);
- if (axis === rax) {
- axes.push(A);
- }
- }
- });
- // Remove duplicates in the axes array. If there are no axes in the axes
- // array, we are adding an axis without data, so we need to populate
- // this with grid lines (#2796).
- uniqueAxes = axes.length ?
- [] :
- [axis.isXAxis ? chart.yAxis[0] : chart.xAxis[0]]; // #3742
- axes.forEach(function (axis2) {
- if (uniqueAxes.indexOf(axis2) === -1 &&
- // Do not draw on axis which overlap completely. #5424
- !find(uniqueAxes, function (unique) {
- return unique.pos === axis2.pos && unique.len === axis2.len;
- })) {
- uniqueAxes.push(axis2);
- }
- });
- transVal = pick(translatedValue, axis.translate(value, null, null, e.old));
- if (isNumber(transVal)) {
- if (axis.horiz) {
- uniqueAxes.forEach(function (axis2) {
- var skip;
- y1 = axis2.pos;
- y2 = y1 + axis2.len;
- x1 = x2 = Math.round(transVal + axis.transB);
- // outside plot area
- if (force !== 'pass' &&
- (x1 < axisLeft || x1 > axisLeft + axis.width)) {
- if (force) {
- x1 = x2 = clamp(x1, axisLeft, axisLeft + axis.width);
- }
- else {
- skip = true;
- }
- }
- if (!skip) {
- result.push(['M', x1, y1], ['L', x2, y2]);
- }
- });
- }
- else {
- uniqueAxes.forEach(function (axis2) {
- var skip;
- x1 = axis2.pos;
- x2 = x1 + axis2.len;
- y1 = y2 = Math.round(axisTop + axis.height - transVal);
- // outside plot area
- if (force !== 'pass' &&
- (y1 < axisTop || y1 > axisTop + axis.height)) {
- if (force) {
- y1 = y2 = clamp(y1, axisTop, axisTop + axis.height);
- }
- else {
- skip = true;
- }
- }
- if (!skip) {
- result.push(['M', x1, y1], ['L', x2, y2]);
- }
- });
- }
- }
- e.path = result.length > 0 ?
- renderer.crispPolyLine(result, e.lineWidth || 1) :
- // #3557 getPlotLinePath in regular Highcharts also returns null
- null;
- }
- });
- /**
- * Function to crisp a line with multiple segments
- *
- * @private
- * @function Highcharts.SVGRenderer#crispPolyLine
- * @param {Highcharts.SVGPathArray} points
- * @param {number} width
- * @return {Highcharts.SVGPathArray}
- */
- SVGRenderer.prototype.crispPolyLine = function (points, width) {
- // points format: [['M', 0, 0], ['L', 100, 0]]
- // normalize to a crisp line
- for (var i = 0; i < points.length; i = i + 2) {
- var start = points[i], end = points[i + 1];
- if (start[1] === end[1]) {
- // Substract due to #1129. Now bottom and left axis gridlines behave
- // the same.
- start[1] = end[1] =
- Math.round(start[1]) - (width % 2 / 2);
- }
- if (start[2] === end[2]) {
- start[2] = end[2] =
- Math.round(start[2]) + (width % 2 / 2);
- }
- }
- return points;
- };
- // Wrapper to hide the label
- addEvent(Axis, 'afterHideCrosshair', function () {
- if (this.crossLabel) {
- this.crossLabel = this.crossLabel.hide();
- }
- });
- // Extend crosshairs to also draw the label
- addEvent(Axis, 'afterDrawCrosshair', function (event) {
- // Check if the label has to be drawn
- if (!defined(this.crosshair.label) ||
- !this.crosshair.label.enabled ||
- !this.cross) {
- return;
- }
- var chart = this.chart, log = this.logarithmic, options = this.options.crosshair.label, // the label's options
- horiz = this.horiz, // axis orientation
- opposite = this.opposite, // axis position
- left = this.left, // left position
- top = this.top, // top position
- crossLabel = this.crossLabel, // the svgElement
- posx, posy, crossBox, formatOption = options.format, formatFormat = '', limit, align, tickInside = this.options.tickPosition === 'inside', snap = this.crosshair.snap !== false, value, offset = 0,
- // Use last available event (#5287)
- e = event.e || (this.cross && this.cross.e), point = event.point, min = this.min, max = this.max;
- if (log) {
- min = log.lin2log(min);
- max = log.lin2log(max);
- }
- align = (horiz ? 'center' : opposite ?
- (this.labelAlign === 'right' ? 'right' : 'left') :
- (this.labelAlign === 'left' ? 'left' : 'center'));
- // If the label does not exist yet, create it.
- if (!crossLabel) {
- crossLabel = this.crossLabel = chart.renderer
- .label(null, null, null, options.shape || 'callout')
- .addClass('highcharts-crosshair-label' + (this.series[0] &&
- ' highcharts-color-' + this.series[0].colorIndex))
- .attr({
- align: options.align || align,
- padding: pick(options.padding, 8),
- r: pick(options.borderRadius, 3),
- zIndex: 2
- })
- .add(this.labelGroup);
- // Presentational
- if (!chart.styledMode) {
- crossLabel
- .attr({
- fill: options.backgroundColor ||
- (this.series[0] && this.series[0].color) ||
- '#666666',
- stroke: options.borderColor || '',
- 'stroke-width': options.borderWidth || 0
- })
- .css(extend({
- color: '#ffffff',
- fontWeight: 'normal',
- fontSize: '11px',
- textAlign: 'center'
- }, options.style));
- }
- }
- if (horiz) {
- posx = snap ? point.plotX + left : e.chartX;
- posy = top + (opposite ? 0 : this.height);
- }
- else {
- posx = opposite ? this.width + left : 0;
- posy = snap ? point.plotY + top : e.chartY;
- }
- if (!formatOption && !options.formatter) {
- if (this.dateTime) {
- formatFormat = '%b %d, %Y';
- }
- formatOption =
- '{value' + (formatFormat ? ':' + formatFormat : '') + '}';
- }
- // Show the label
- value = snap ?
- point[this.isXAxis ? 'x' : 'y'] :
- this.toValue(horiz ? e.chartX : e.chartY);
- crossLabel.attr({
- text: formatOption ?
- format(formatOption, { value: value }, chart) :
- options.formatter.call(this, value),
- x: posx,
- y: posy,
- // Crosshair should be rendered within Axis range (#7219)
- visibility: value < min || value > max ?
- 'hidden' :
- 'visible'
- });
- crossBox = crossLabel.getBBox();
- // now it is placed we can correct its position
- if (isNumber(crossLabel.y)) {
- if (horiz) {
- if ((tickInside && !opposite) || (!tickInside && opposite)) {
- posy = crossLabel.y - crossBox.height;
- }
- }
- else {
- posy = crossLabel.y - (crossBox.height / 2);
- }
- }
- // check the edges
- if (horiz) {
- limit = {
- left: left - crossBox.x,
- right: left + this.width - crossBox.x
- };
- }
- else {
- limit = {
- left: this.labelAlign === 'left' ? left : 0,
- right: this.labelAlign === 'right' ?
- left + this.width :
- chart.chartWidth
- };
- }
- // left edge
- if (crossLabel.translateX < limit.left) {
- offset = limit.left - crossLabel.translateX;
- }
- // right edge
- if (crossLabel.translateX + crossBox.width >= limit.right) {
- offset = -(crossLabel.translateX + crossBox.width - limit.right);
- }
- // show the crosslabel
- crossLabel.attr({
- x: posx + offset,
- y: posy,
- // First set x and y, then anchorX and anchorY, when box is actually
- // calculated, #5702
- anchorX: horiz ?
- posx :
- (this.opposite ? 0 : chart.chartWidth),
- anchorY: horiz ?
- (this.opposite ? chart.chartHeight : 0) :
- posy + crossBox.height / 2
- });
- });
- /* ************************************************************************** *
- * Start value compare logic *
- * ************************************************************************** */
- /**
- * Extend series.init by adding a method to modify the y value used for plotting
- * on the y axis. This method is called both from the axis when finding dataMin
- * and dataMax, and from the series.translate method.
- *
- * @ignore
- * @function Highcharts.Series#init
- */
- seriesProto.init = function () {
- // Call base method
- seriesInit.apply(this, arguments);
- // Set comparison mode
- this.setCompare(this.options.compare);
- };
- /**
- * Highstock only. Set the
- * [compare](https://api.highcharts.com/highstock/plotOptions.series.compare)
- * mode of the series after render time. In most cases it is more useful running
- * {@link Axis#setCompare} on the X axis to update all its series.
- *
- * @function Highcharts.Series#setCompare
- *
- * @param {string} [compare]
- * Can be one of `null` (default), `"percent"` or `"value"`.
- */
- seriesProto.setCompare = function (compare) {
- // Set or unset the modifyValue method
- this.modifyValue = (compare === 'value' || compare === 'percent') ?
- function (value, point) {
- var compareValue = this.compareValue;
- if (typeof value !== 'undefined' &&
- typeof compareValue !== 'undefined') { // #2601, #5814
- // Get the modified value
- if (compare === 'value') {
- value -= compareValue;
- // Compare percent
- }
- else {
- value = 100 * (value / compareValue) -
- (this.options.compareBase === 100 ? 0 : 100);
- }
- // record for tooltip etc.
- if (point) {
- point.change = value;
- }
- return value;
- }
- return 0;
- } :
- null;
- // Survive to export, #5485
- this.userOptions.compare = compare;
- // Mark dirty
- if (this.chart.hasRendered) {
- this.isDirty = true;
- }
- };
- /**
- * Extend series.processData by finding the first y value in the plot area,
- * used for comparing the following values
- *
- * @ignore
- * @function Highcharts.Series#processData
- */
- seriesProto.processData = function (force) {
- var series = this, i, keyIndex = -1, processedXData, processedYData, compareStart = series.options.compareStart === true ? 0 : 1, length, compareValue;
- // call base method
- seriesProcessData.apply(this, arguments);
- if (series.xAxis && series.processedYData) { // not pies
- // local variables
- processedXData = series.processedXData;
- processedYData = series.processedYData;
- length = processedYData.length;
- // For series with more than one value (range, OHLC etc), compare
- // against close or the pointValKey (#4922, #3112, #9854)
- if (series.pointArrayMap) {
- keyIndex = series.pointArrayMap.indexOf(series.options.pointValKey || series.pointValKey || 'y');
- }
- // find the first value for comparison
- for (i = 0; i < length - compareStart; i++) {
- compareValue = processedYData[i] && keyIndex > -1 ?
- processedYData[i][keyIndex] :
- processedYData[i];
- if (isNumber(compareValue) &&
- processedXData[i + compareStart] >=
- series.xAxis.min &&
- compareValue !== 0) {
- series.compareValue = compareValue;
- break;
- }
- }
- }
- return;
- };
- // Modify series extremes
- addEvent(Series, 'afterGetExtremes', function (e) {
- var dataExtremes = e.dataExtremes;
- if (this.modifyValue && dataExtremes) {
- var extremes = [
- this.modifyValue(dataExtremes.dataMin),
- this.modifyValue(dataExtremes.dataMax)
- ];
- dataExtremes.dataMin = arrayMin(extremes);
- dataExtremes.dataMax = arrayMax(extremes);
- }
- });
- /**
- * Highstock only. Set the compare mode on all series belonging to an Y axis
- * after render time.
- *
- * @see [series.plotOptions.compare](https://api.highcharts.com/highstock/series.plotOptions.compare)
- *
- * @sample stock/members/axis-setcompare/
- * Set compoare
- *
- * @function Highcharts.Axis#setCompare
- *
- * @param {string} [compare]
- * The compare mode. Can be one of `null` (default), `"value"` or
- * `"percent"`.
- *
- * @param {boolean} [redraw=true]
- * Whether to redraw the chart or to wait for a later call to
- * {@link Chart#redraw}.
- */
- Axis.prototype.setCompare = function (compare, redraw) {
- if (!this.isXAxis) {
- this.series.forEach(function (series) {
- series.setCompare(compare);
- });
- if (pick(redraw, true)) {
- this.chart.redraw();
- }
- }
- };
- /**
- * Extend the tooltip formatter by adding support for the point.change variable
- * as well as the changeDecimals option.
- *
- * @ignore
- * @function Highcharts.Point#tooltipFormatter
- *
- * @param {string} pointFormat
- */
- Point.prototype.tooltipFormatter = function (pointFormat) {
- var point = this;
- var numberFormatter = point.series.chart.numberFormatter;
- pointFormat = pointFormat.replace('{point.change}', (point.change > 0 ? '+' : '') + numberFormatter(point.change, pick(point.series.tooltipOptions.changeDecimals, 2)));
- return pointTooltipFormatter.apply(this, [pointFormat]);
- };
- /* ************************************************************************** *
- * End value compare logic *
- * ************************************************************************** */
- // Extend the Series prototype to create a separate series clip box. This is
- // related to using multiple panes, and a future pane logic should incorporate
- // this feature (#2754).
- addEvent(Series, 'render', function () {
- var chart = this.chart, clipHeight;
- // Only do this on not 3d (#2939, #5904) nor polar (#6057) charts, and only
- // if the series type handles clipping in the animate method (#2975).
- if (!(chart.is3d && chart.is3d()) &&
- !chart.polar &&
- this.xAxis &&
- !this.xAxis.isRadial // Gauge, #6192
- ) {
- clipHeight = this.yAxis.len;
- // Include xAxis line width (#8031) but only if the Y axis ends on the
- // edge of the X axis (#11005).
- if (this.xAxis.axisLine) {
- var dist = chart.plotTop + chart.plotHeight -
- this.yAxis.pos - this.yAxis.len, lineHeightCorrection = Math.floor(this.xAxis.axisLine.strokeWidth() / 2);
- if (dist >= 0) {
- clipHeight -= Math.max(lineHeightCorrection - dist, 0);
- }
- }
- // First render, initial clip box
- if (!this.clipBox && this.animate) {
- this.clipBox = merge(chart.clipBox);
- this.clipBox.width = this.xAxis.len;
- this.clipBox.height = clipHeight;
- // On redrawing, resizing etc, update the clip rectangle
- }
- else if (chart[this.sharedClipKey]) {
- // animate in case resize is done during initial animation
- chart[this.sharedClipKey].animate({
- width: this.xAxis.len,
- height: clipHeight
- });
- // also change markers clip animation for consistency
- // (marker clip rects should exist only on chart init)
- if (chart[this.sharedClipKey + 'm']) {
- chart[this.sharedClipKey + 'm'].animate({
- width: this.xAxis.len
- });
- }
- }
- }
- });
- addEvent(Chart, 'update', function (e) {
- var options = e.options;
- // Use case: enabling scrollbar from a disabled state.
- // Scrollbar needs to be initialized from a controller, Navigator in this
- // case (#6615)
- if ('scrollbar' in options && this.navigator) {
- merge(true, this.options.scrollbar, options.scrollbar);
- this.navigator.update({}, false);
- delete options.scrollbar;
- }
- });
- });
- _registerModule(_modules, 'masters/modules/stock.src.js', [], function () {
- });
- }));
|