kitygraph.all.js 165 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092109310941095109610971098109911001101110211031104110511061107110811091110111111121113111411151116111711181119112011211122112311241125112611271128112911301131113211331134113511361137113811391140114111421143114411451146114711481149115011511152115311541155115611571158115911601161116211631164116511661167116811691170117111721173117411751176117711781179118011811182118311841185118611871188118911901191119211931194119511961197119811991200120112021203120412051206120712081209121012111212121312141215121612171218121912201221122212231224122512261227122812291230123112321233123412351236123712381239124012411242124312441245124612471248124912501251125212531254125512561257125812591260126112621263126412651266126712681269127012711272127312741275127612771278127912801281128212831284128512861287128812891290129112921293129412951296129712981299130013011302130313041305130613071308130913101311131213131314131513161317131813191320132113221323132413251326132713281329133013311332133313341335133613371338133913401341134213431344134513461347134813491350135113521353135413551356135713581359136013611362136313641365136613671368136913701371137213731374137513761377137813791380138113821383138413851386138713881389139013911392139313941395139613971398139914001401140214031404140514061407140814091410141114121413141414151416141714181419142014211422142314241425142614271428142914301431143214331434143514361437143814391440144114421443144414451446144714481449145014511452145314541455145614571458145914601461146214631464146514661467146814691470147114721473147414751476147714781479148014811482148314841485148614871488148914901491149214931494149514961497149814991500150115021503150415051506150715081509151015111512151315141515151615171518151915201521152215231524152515261527152815291530153115321533153415351536153715381539154015411542154315441545154615471548154915501551155215531554155515561557155815591560156115621563156415651566156715681569157015711572157315741575157615771578157915801581158215831584158515861587158815891590159115921593159415951596159715981599160016011602160316041605160616071608160916101611161216131614161516161617161816191620162116221623162416251626162716281629163016311632163316341635163616371638163916401641164216431644164516461647164816491650165116521653165416551656165716581659166016611662166316641665166616671668166916701671167216731674167516761677167816791680168116821683168416851686168716881689169016911692169316941695169616971698169917001701170217031704170517061707170817091710171117121713171417151716171717181719172017211722172317241725172617271728172917301731173217331734173517361737173817391740174117421743174417451746174717481749175017511752175317541755175617571758175917601761176217631764176517661767176817691770177117721773177417751776177717781779178017811782178317841785178617871788178917901791179217931794179517961797179817991800180118021803180418051806180718081809181018111812181318141815181618171818181918201821182218231824182518261827182818291830183118321833183418351836183718381839184018411842184318441845184618471848184918501851185218531854185518561857185818591860186118621863186418651866186718681869187018711872187318741875187618771878187918801881188218831884188518861887188818891890189118921893189418951896189718981899190019011902190319041905190619071908190919101911191219131914191519161917191819191920192119221923192419251926192719281929193019311932193319341935193619371938193919401941194219431944194519461947194819491950195119521953195419551956195719581959196019611962196319641965196619671968196919701971197219731974197519761977197819791980198119821983198419851986198719881989199019911992199319941995199619971998199920002001200220032004200520062007200820092010201120122013201420152016201720182019202020212022202320242025202620272028202920302031203220332034203520362037203820392040204120422043204420452046204720482049205020512052205320542055205620572058205920602061206220632064206520662067206820692070207120722073207420752076207720782079208020812082208320842085208620872088208920902091209220932094209520962097209820992100210121022103210421052106210721082109211021112112211321142115211621172118211921202121212221232124212521262127212821292130213121322133213421352136213721382139214021412142214321442145214621472148214921502151215221532154215521562157215821592160216121622163216421652166216721682169217021712172217321742175217621772178217921802181218221832184218521862187218821892190219121922193219421952196219721982199220022012202220322042205220622072208220922102211221222132214221522162217221822192220222122222223222422252226222722282229223022312232223322342235223622372238223922402241224222432244224522462247224822492250225122522253225422552256225722582259226022612262226322642265226622672268226922702271227222732274227522762277227822792280228122822283228422852286228722882289229022912292229322942295229622972298229923002301230223032304230523062307230823092310231123122313231423152316231723182319232023212322232323242325232623272328232923302331233223332334233523362337233823392340234123422343234423452346234723482349235023512352235323542355235623572358235923602361236223632364236523662367236823692370237123722373237423752376237723782379238023812382238323842385238623872388238923902391239223932394239523962397239823992400240124022403240424052406240724082409241024112412241324142415241624172418241924202421242224232424242524262427242824292430243124322433243424352436243724382439244024412442244324442445244624472448244924502451245224532454245524562457245824592460246124622463246424652466246724682469247024712472247324742475247624772478247924802481248224832484248524862487248824892490249124922493249424952496249724982499250025012502250325042505250625072508250925102511251225132514251525162517251825192520252125222523252425252526252725282529253025312532253325342535253625372538253925402541254225432544254525462547254825492550255125522553255425552556255725582559256025612562256325642565256625672568256925702571257225732574257525762577257825792580258125822583258425852586258725882589259025912592259325942595259625972598259926002601260226032604260526062607260826092610261126122613261426152616261726182619262026212622262326242625262626272628262926302631263226332634263526362637263826392640264126422643264426452646264726482649265026512652265326542655265626572658265926602661266226632664266526662667266826692670267126722673267426752676267726782679268026812682268326842685268626872688268926902691269226932694269526962697269826992700270127022703270427052706270727082709271027112712271327142715271627172718271927202721272227232724272527262727272827292730273127322733273427352736273727382739274027412742274327442745274627472748274927502751275227532754275527562757275827592760276127622763276427652766276727682769277027712772277327742775277627772778277927802781278227832784278527862787278827892790279127922793279427952796279727982799280028012802280328042805280628072808280928102811281228132814281528162817281828192820282128222823282428252826282728282829283028312832283328342835283628372838283928402841284228432844284528462847284828492850285128522853285428552856285728582859286028612862286328642865286628672868286928702871287228732874287528762877287828792880288128822883288428852886288728882889289028912892289328942895289628972898289929002901290229032904290529062907290829092910291129122913291429152916291729182919292029212922292329242925292629272928292929302931293229332934293529362937293829392940294129422943294429452946294729482949295029512952295329542955295629572958295929602961296229632964296529662967296829692970297129722973297429752976297729782979298029812982298329842985298629872988298929902991299229932994299529962997299829993000300130023003300430053006300730083009301030113012301330143015301630173018301930203021302230233024302530263027302830293030303130323033303430353036303730383039304030413042304330443045304630473048304930503051305230533054305530563057305830593060306130623063306430653066306730683069307030713072307330743075307630773078307930803081308230833084308530863087308830893090309130923093309430953096309730983099310031013102310331043105310631073108310931103111311231133114311531163117311831193120312131223123312431253126312731283129313031313132313331343135313631373138313931403141314231433144314531463147314831493150315131523153315431553156315731583159316031613162316331643165316631673168316931703171317231733174317531763177317831793180318131823183318431853186318731883189319031913192319331943195319631973198319932003201320232033204320532063207320832093210321132123213321432153216321732183219322032213222322332243225322632273228322932303231323232333234323532363237323832393240324132423243324432453246324732483249325032513252325332543255325632573258325932603261326232633264326532663267326832693270327132723273327432753276327732783279328032813282328332843285328632873288328932903291329232933294329532963297329832993300330133023303330433053306330733083309331033113312331333143315331633173318331933203321332233233324332533263327332833293330333133323333333433353336333733383339334033413342334333443345334633473348334933503351335233533354335533563357335833593360336133623363336433653366336733683369337033713372337333743375337633773378337933803381338233833384338533863387338833893390339133923393339433953396339733983399340034013402340334043405340634073408340934103411341234133414341534163417341834193420342134223423342434253426342734283429343034313432343334343435343634373438343934403441344234433444344534463447344834493450345134523453345434553456345734583459346034613462346334643465346634673468346934703471347234733474347534763477347834793480348134823483348434853486348734883489349034913492349334943495349634973498349935003501350235033504350535063507350835093510351135123513351435153516351735183519352035213522352335243525352635273528352935303531353235333534353535363537353835393540354135423543354435453546354735483549355035513552355335543555355635573558355935603561356235633564356535663567356835693570357135723573357435753576357735783579358035813582358335843585358635873588358935903591359235933594359535963597359835993600360136023603360436053606360736083609361036113612361336143615361636173618361936203621362236233624362536263627362836293630363136323633363436353636363736383639364036413642364336443645364636473648364936503651365236533654365536563657365836593660366136623663366436653666366736683669367036713672367336743675367636773678367936803681368236833684368536863687368836893690369136923693369436953696369736983699370037013702370337043705370637073708370937103711371237133714371537163717371837193720372137223723372437253726372737283729373037313732373337343735373637373738373937403741374237433744374537463747374837493750375137523753375437553756375737583759376037613762376337643765376637673768376937703771377237733774377537763777377837793780378137823783378437853786378737883789379037913792379337943795379637973798379938003801380238033804380538063807380838093810381138123813381438153816381738183819382038213822382338243825382638273828382938303831383238333834383538363837383838393840384138423843384438453846384738483849385038513852385338543855385638573858385938603861386238633864386538663867386838693870387138723873387438753876387738783879388038813882388338843885388638873888388938903891389238933894389538963897389838993900390139023903390439053906390739083909391039113912391339143915391639173918391939203921392239233924392539263927392839293930393139323933393439353936393739383939394039413942394339443945394639473948394939503951395239533954395539563957395839593960396139623963396439653966396739683969397039713972397339743975397639773978397939803981398239833984398539863987398839893990399139923993399439953996399739983999400040014002400340044005400640074008400940104011401240134014401540164017401840194020402140224023402440254026402740284029403040314032403340344035403640374038403940404041404240434044404540464047404840494050405140524053405440554056405740584059406040614062406340644065406640674068406940704071407240734074407540764077407840794080408140824083408440854086408740884089409040914092409340944095409640974098409941004101410241034104410541064107410841094110411141124113411441154116411741184119412041214122412341244125412641274128412941304131413241334134413541364137413841394140414141424143414441454146414741484149415041514152415341544155415641574158415941604161416241634164416541664167416841694170417141724173417441754176417741784179418041814182418341844185418641874188418941904191419241934194419541964197419841994200420142024203420442054206420742084209421042114212421342144215421642174218421942204221422242234224422542264227422842294230423142324233423442354236423742384239424042414242424342444245424642474248424942504251425242534254425542564257425842594260426142624263426442654266426742684269427042714272427342744275427642774278427942804281428242834284428542864287428842894290429142924293429442954296429742984299430043014302430343044305430643074308430943104311431243134314431543164317431843194320432143224323432443254326432743284329433043314332433343344335433643374338433943404341434243434344434543464347434843494350435143524353435443554356435743584359436043614362436343644365436643674368436943704371437243734374437543764377437843794380438143824383438443854386438743884389439043914392439343944395439643974398439944004401440244034404440544064407440844094410441144124413441444154416441744184419442044214422442344244425442644274428442944304431443244334434443544364437443844394440444144424443444444454446444744484449445044514452445344544455445644574458445944604461446244634464446544664467446844694470447144724473447444754476447744784479448044814482448344844485448644874488448944904491449244934494449544964497449844994500450145024503450445054506450745084509451045114512451345144515451645174518451945204521452245234524452545264527452845294530453145324533453445354536453745384539454045414542454345444545454645474548454945504551455245534554455545564557455845594560456145624563456445654566456745684569457045714572457345744575457645774578457945804581458245834584458545864587458845894590
  1. /*!
  2. * ====================================================
  3. * kitygraph - v1.0.0 - 2014-03-06
  4. * https://github.com/kitygraph/kity
  5. * GitHub: https://github.com/kitygraph/kity.git
  6. * Copyright (c) 2014 Baidu UEditor Group; Licensed MIT
  7. * ====================================================
  8. */
  9. (function () {
  10. /**
  11. * cmd 内部定义
  12. */
  13. // 模块存储
  14. var _modules = {};
  15. function define ( id, deps, factory ) {
  16. _modules[ id ] = {
  17. exports: {},
  18. value: null,
  19. factory: null
  20. };
  21. if ( arguments.length === 2 ) {
  22. factory = deps;
  23. }
  24. if ( _modules.toString.call( factory ) === '[object Object]' ) {
  25. _modules[ id ][ 'value' ] = factory;
  26. } else if ( typeof factory === 'function' ) {
  27. _modules[ id ][ 'factory' ] = factory;
  28. } else {
  29. throw new Error( 'define函数未定义的行为' );
  30. }
  31. }
  32. function require ( id ) {
  33. var module = _modules[ id ],
  34. exports = null;
  35. if ( !module ) {
  36. return null;
  37. }
  38. if ( module.value ) {
  39. return module.value;
  40. }
  41. exports = module.factory.call( null, require, module.exports, module );
  42. // return 值不为空, 则以return值为最终值
  43. if ( exports ) {
  44. module.exports = exports;
  45. }
  46. module.value = module.exports;
  47. return module.value;
  48. }
  49. function use ( id ) {
  50. return require( id );
  51. }
  52. define("animate/animator", [ "animate/timeline", "graphic/color", "graphic/matrix", "graphic/eventhandler", "core/class", "animate/easing", "core/config", "graphic/shape", "graphic/svg", "core/utils", "graphic/styled", "graphic/data", "graphic/pen" ], function(require, exports, module) {
  53. function parseTime(str) {
  54. var value = parseFloat(str, 10);
  55. if (/ms/.test(str)) {
  56. return value;
  57. }
  58. if (/s/.test(str)) {
  59. return value * 1e3;
  60. }
  61. if (/min/.test(str)) {
  62. return value * 60 * 1e3;
  63. }
  64. return value;
  65. }
  66. var Timeline = require("animate/timeline");
  67. var easingTable = require("animate/easing");
  68. var Animator = require("core/class").createClass("Animator", {
  69. constructor: function(beginValue, finishValue, setter) {
  70. if (arguments.length == 1) {
  71. var opt = arguments[0];
  72. this.beginVal = opt.beginValue;
  73. this.finishVal = opt.finishValue;
  74. this.setter = opt.setter;
  75. } else {
  76. this.beginVal = beginValue;
  77. this.finishVal = finishValue;
  78. this.setter = setter;
  79. }
  80. },
  81. start: function(target, duration, easing, delay, callback) {
  82. if (arguments.length === 4 && typeof delay == "function") {
  83. callback = delay;
  84. delay = 0;
  85. }
  86. var timeline = this.create(target, duration, easing, callback);
  87. delay = parseTime(delay);
  88. if (delay > 0) {
  89. setTimeout(function() {
  90. timeline.play();
  91. }, delay);
  92. } else {
  93. timeline.play();
  94. }
  95. return timeline;
  96. },
  97. create: function(target, duration, easing, callback) {
  98. var timeline;
  99. duration = duration && parseTime(duration) || Animator.DEFAULT_DURATION;
  100. easing = easing || Animator.DEFAULT_EASING;
  101. if (typeof easing == "string") {
  102. easing = easingTable[easing];
  103. }
  104. timeline = new Timeline(this, target, duration, easing);
  105. if (typeof callback == "function") {
  106. timeline.on("finish", callback);
  107. }
  108. return timeline;
  109. },
  110. reverse: function() {
  111. return new Animator(this.finishVal, this.beginVal, this.setter);
  112. }
  113. });
  114. Animator.DEFAULT_DURATION = 300;
  115. Animator.DEFAULT_EASING = "linear";
  116. var Shape = require("graphic/shape");
  117. require("core/class").extendClass(Shape, {
  118. animate: function(animator, duration, easing, delay, callback) {
  119. var queue = this._KityAnimateQueue = this._KityAnimateQueue || [];
  120. var timeline = animator.create(this, duration, easing, callback);
  121. function dequeue() {
  122. queue.shift();
  123. if (queue.length) {
  124. setTimeout(queue[0].t.play.bind(queue[0].t), queue[0].d);
  125. }
  126. }
  127. timeline.on("finish", dequeue);
  128. queue.push({
  129. t: timeline,
  130. d: delay
  131. });
  132. if (queue.length == 1) {
  133. setTimeout(timeline.play.bind(timeline), delay);
  134. }
  135. return this;
  136. },
  137. stop: function() {
  138. var queue = this._KityAnimateQueue;
  139. if (queue) {
  140. while (queue.length) {
  141. queue.shift().stop();
  142. }
  143. }
  144. }
  145. });
  146. return Animator;
  147. });
  148. /**
  149. * Kity Animate Easing modified from jQuery Easing
  150. * Author: techird
  151. * Changes:
  152. * 1. make easing functions standalone
  153. * 2. remove the 'x' parameter
  154. */
  155. /* ============================================================
  156. * jQuery Easing v1.3 - http://gsgd.co.uk/sandbox/jquery/easing/
  157. *
  158. * Open source under the BSD License.
  159. *
  160. * Copyright © 2008 George McGinley Smith
  161. * All rights reserved.
  162. * https://raw.github.com/danro/jquery-easing/master/LICENSE
  163. * ======================================================== */
  164. define("animate/easing", [], function(require, exports, module) {
  165. var easings = {
  166. // t: current_time, b: begin_value, c: change_value, d: duration
  167. linear: function(t, b, c, d) {
  168. return c * (t / d) + b;
  169. },
  170. swing: function(t, b, c, d) {
  171. return easings.easeOutQuad(t, b, c, d);
  172. },
  173. ease: function(t, b, c, d) {
  174. return easings.easeInOutCubic(t, b, c, d);
  175. },
  176. easeInQuad: function(t, b, c, d) {
  177. return c * (t /= d) * t + b;
  178. },
  179. easeOutQuad: function(t, b, c, d) {
  180. return -c * (t /= d) * (t - 2) + b;
  181. },
  182. easeInOutQuad: function(t, b, c, d) {
  183. if ((t /= d / 2) < 1) return c / 2 * t * t + b;
  184. return -c / 2 * (--t * (t - 2) - 1) + b;
  185. },
  186. easeInCubic: function(t, b, c, d) {
  187. return c * (t /= d) * t * t + b;
  188. },
  189. easeOutCubic: function(t, b, c, d) {
  190. return c * ((t = t / d - 1) * t * t + 1) + b;
  191. },
  192. easeInOutCubic: function(t, b, c, d) {
  193. if ((t /= d / 2) < 1) return c / 2 * t * t * t + b;
  194. return c / 2 * ((t -= 2) * t * t + 2) + b;
  195. },
  196. easeInQuart: function(t, b, c, d) {
  197. return c * (t /= d) * t * t * t + b;
  198. },
  199. easeOutQuart: function(t, b, c, d) {
  200. return -c * ((t = t / d - 1) * t * t * t - 1) + b;
  201. },
  202. easeInOutQuart: function(t, b, c, d) {
  203. if ((t /= d / 2) < 1) return c / 2 * t * t * t * t + b;
  204. return -c / 2 * ((t -= 2) * t * t * t - 2) + b;
  205. },
  206. easeInQuint: function(t, b, c, d) {
  207. return c * (t /= d) * t * t * t * t + b;
  208. },
  209. easeOutQuint: function(t, b, c, d) {
  210. return c * ((t = t / d - 1) * t * t * t * t + 1) + b;
  211. },
  212. easeInOutQuint: function(t, b, c, d) {
  213. if ((t /= d / 2) < 1) return c / 2 * t * t * t * t * t + b;
  214. return c / 2 * ((t -= 2) * t * t * t * t + 2) + b;
  215. },
  216. easeInSine: function(t, b, c, d) {
  217. return -c * Math.cos(t / d * (Math.PI / 2)) + c + b;
  218. },
  219. easeOutSine: function(t, b, c, d) {
  220. return c * Math.sin(t / d * (Math.PI / 2)) + b;
  221. },
  222. easeInOutSine: function(t, b, c, d) {
  223. return -c / 2 * (Math.cos(Math.PI * t / d) - 1) + b;
  224. },
  225. easeInExpo: function(t, b, c, d) {
  226. return t == 0 ? b : c * Math.pow(2, 10 * (t / d - 1)) + b;
  227. },
  228. easeOutExpo: function(t, b, c, d) {
  229. return t == d ? b + c : c * (-Math.pow(2, -10 * t / d) + 1) + b;
  230. },
  231. easeInOutExpo: function(t, b, c, d) {
  232. if (t == 0) return b;
  233. if (t == d) return b + c;
  234. if ((t /= d / 2) < 1) return c / 2 * Math.pow(2, 10 * (t - 1)) + b;
  235. return c / 2 * (-Math.pow(2, -10 * --t) + 2) + b;
  236. },
  237. easeInCirc: function(t, b, c, d) {
  238. return -c * (Math.sqrt(1 - (t /= d) * t) - 1) + b;
  239. },
  240. easeOutCirc: function(t, b, c, d) {
  241. return c * Math.sqrt(1 - (t = t / d - 1) * t) + b;
  242. },
  243. easeInOutCirc: function(t, b, c, d) {
  244. if ((t /= d / 2) < 1) return -c / 2 * (Math.sqrt(1 - t * t) - 1) + b;
  245. return c / 2 * (Math.sqrt(1 - (t -= 2) * t) + 1) + b;
  246. },
  247. easeInElastic: function(t, b, c, d) {
  248. var s = 1.70158;
  249. var p = 0;
  250. var a = c;
  251. if (t == 0) return b;
  252. if ((t /= d) == 1) return b + c;
  253. if (!p) p = d * .3;
  254. if (a < Math.abs(c)) {
  255. a = c;
  256. var s = p / 4;
  257. } else var s = p / (2 * Math.PI) * Math.asin(c / a);
  258. return -(a * Math.pow(2, 10 * (t -= 1)) * Math.sin((t * d - s) * 2 * Math.PI / p)) + b;
  259. },
  260. easeOutElastic: function(t, b, c, d) {
  261. var s = 1.70158;
  262. var p = 0;
  263. var a = c;
  264. if (t == 0) return b;
  265. if ((t /= d) == 1) return b + c;
  266. if (!p) p = d * .3;
  267. if (a < Math.abs(c)) {
  268. a = c;
  269. var s = p / 4;
  270. } else var s = p / (2 * Math.PI) * Math.asin(c / a);
  271. return a * Math.pow(2, -10 * t) * Math.sin((t * d - s) * 2 * Math.PI / p) + c + b;
  272. },
  273. easeInOutElastic: function(t, b, c, d) {
  274. var s = 1.70158;
  275. var p = 0;
  276. var a = c;
  277. if (t == 0) return b;
  278. if ((t /= d / 2) == 2) return b + c;
  279. if (!p) p = d * .3 * 1.5;
  280. if (a < Math.abs(c)) {
  281. a = c;
  282. var s = p / 4;
  283. } else var s = p / (2 * Math.PI) * Math.asin(c / a);
  284. if (t < 1) return -.5 * a * Math.pow(2, 10 * (t -= 1)) * Math.sin((t * d - s) * 2 * Math.PI / p) + b;
  285. return a * Math.pow(2, -10 * (t -= 1)) * Math.sin((t * d - s) * 2 * Math.PI / p) * .5 + c + b;
  286. },
  287. easeInBack: function(t, b, c, d, s) {
  288. if (s == undefined) s = 1.70158;
  289. return c * (t /= d) * t * ((s + 1) * t - s) + b;
  290. },
  291. easeOutBack: function(t, b, c, d, s) {
  292. if (s == undefined) s = 1.70158;
  293. return c * ((t = t / d - 1) * t * ((s + 1) * t + s) + 1) + b;
  294. },
  295. easeInOutBack: function(t, b, c, d, s) {
  296. if (s == undefined) s = 1.70158;
  297. if ((t /= d / 2) < 1) return c / 2 * t * t * (((s *= 1.525) + 1) * t - s) + b;
  298. return c / 2 * ((t -= 2) * t * (((s *= 1.525) + 1) * t + s) + 2) + b;
  299. },
  300. easeInBounce: function(t, b, c, d) {
  301. return c - easings.easeOutBounce(d - t, 0, c, d) + b;
  302. },
  303. easeOutBounce: function(t, b, c, d) {
  304. if ((t /= d) < 1 / 2.75) {
  305. return c * 7.5625 * t * t + b;
  306. } else if (t < 2 / 2.75) {
  307. return c * (7.5625 * (t -= 1.5 / 2.75) * t + .75) + b;
  308. } else if (t < 2.5 / 2.75) {
  309. return c * (7.5625 * (t -= 2.25 / 2.75) * t + .9375) + b;
  310. } else {
  311. return c * (7.5625 * (t -= 2.625 / 2.75) * t + .984375) + b;
  312. }
  313. },
  314. easeInOutBounce: function(t, b, c, d) {
  315. if (t < d / 2) return easings.easeInBounce(t * 2, 0, c, d) * .5 + b;
  316. return easings.easeOutBounce(t * 2 - d, 0, c, d) * .5 + c * .5 + b;
  317. }
  318. };
  319. return easings;
  320. });
  321. define("animate/opacityanimator", [ "animate/animator", "animate/timeline", "animate/easing", "core/class", "graphic/shape", "graphic/matrix", "core/utils", "graphic/vector", "core/config", "graphic/svg", "graphic/eventhandler", "graphic/styled", "graphic/data", "graphic/pen" ], function(require, exports, module) {
  322. var Animator = require("animate/animator");
  323. var Matrix = require("graphic/matrix");
  324. var OpacityAnimator = require("core/class").createClass("OpacityAnimator", {
  325. base: Animator,
  326. constructor: function(opacity) {
  327. this.callBase({
  328. beginValue: function(target) {
  329. return target.getOpacity();
  330. },
  331. finishValue: opacity,
  332. setter: function(target, value) {
  333. target.setOpacity(value);
  334. }
  335. });
  336. }
  337. });
  338. var Shape = require("graphic/shape");
  339. require("core/class").extendClass(Shape, {
  340. fxOpacity: function(opacity, duration, easing, delay, callback) {
  341. return this.animate(new OpacityAnimator(opacity), duration, easing, delay, callback);
  342. },
  343. fadeTo: function() {
  344. return this.fxOpacity.apply(this, arguments);
  345. },
  346. fadeIn: function() {
  347. return this.fxOpacity.apply(this, [ 1 ].concat([].slice.call(arguments)));
  348. },
  349. fadeOut: function() {
  350. return this.fxOpacity.apply(this, [ 0 ].concat([].slice.call(arguments)));
  351. }
  352. });
  353. return OpacityAnimator;
  354. });
  355. define("animate/rotateanimator", [ "animate/animator", "animate/timeline", "animate/easing", "core/class", "graphic/shape", "graphic/matrix", "core/utils", "graphic/vector", "core/config", "graphic/svg", "graphic/eventhandler", "graphic/styled", "graphic/data", "graphic/pen" ], function(require, exports, module) {
  356. var Animator = require("animate/animator");
  357. var Matrix = require("graphic/matrix");
  358. var RotateAnimator = require("core/class").createClass("RotateAnimator", {
  359. base: Animator,
  360. constructor: function(deg, ax, ay) {
  361. this.callBase({
  362. beginValue: 0,
  363. finishValue: deg,
  364. setter: function(target, value, timeline) {
  365. var delta = timeline.getDelta();
  366. target.rotate(delta, ax, ay);
  367. }
  368. });
  369. }
  370. });
  371. var Shape = require("graphic/shape");
  372. require("core/class").extendClass(Shape, {
  373. fxRotate: function(deg, duration, easing, delay, callback) {
  374. return this.animate(new RotateAnimator(deg), duration, easing, delay, callback);
  375. },
  376. fxRotateAnchor: function(deg, ax, ay, duration, easing, delay, callback) {
  377. return this.animate(new RotateAnimator(deg, ax, ay), duration, easing, delay, callback);
  378. }
  379. });
  380. return RotateAnimator;
  381. });
  382. define("animate/scaleanimator", [ "animate/animator", "animate/timeline", "animate/easing", "core/class", "graphic/shape", "graphic/matrix", "core/utils", "graphic/vector", "core/config", "graphic/svg", "graphic/eventhandler", "graphic/styled", "graphic/data", "graphic/pen" ], function(require, exports, module) {
  383. var Animator = require("animate/animator");
  384. var Matrix = require("graphic/matrix");
  385. var ScaleAnimator = require("core/class").createClass("ScaleAnimator", {
  386. base: Animator,
  387. constructor: function(sx, sy, ax, ay) {
  388. this.callBase({
  389. beginValue: 0,
  390. finishValue: 1,
  391. setter: function(target, value, timeline) {
  392. var delta = timeline.getDelta();
  393. var kx = Math.pow(sx, delta);
  394. var ky = Math.pow(sy, delta);
  395. target.scale(ky, kx);
  396. }
  397. });
  398. }
  399. });
  400. var Shape = require("graphic/shape");
  401. require("core/class").extendClass(Shape, {
  402. fxScale: function(sx, sy, duration, easing, delay, callback) {
  403. return this.animate(new ScaleAnimator(sx, sy), duration, easing, delay, callback);
  404. }
  405. });
  406. return ScaleAnimator;
  407. });
  408. define("animate/timeline", [ "graphic/color", "core/utils", "graphic/standardcolor", "core/class", "graphic/matrix", "graphic/vector", "graphic/eventhandler", "graphic/shapeevent", "core/config" ], function(require, exports, module) {
  409. var Color = require("graphic/color");
  410. var Matrix = require("graphic/matrix");
  411. var EventHandler = require("graphic/eventhandler");
  412. var requestAnimationFrame = window.requestAnimationFrame || window.mozRequestAnimationFrame || window.webkitRequestAnimationFrame || window.msRequestAnimationFrame || function(fn) {
  413. return setTimeout(fn, 16);
  414. };
  415. var cancelAnimationFrame = window.cancelAnimationFrame || window.mozCancelAnimationFrame || window.webkitCancelAnimationFrame || window.msCancelAnimationFrame || function(reqId) {
  416. return clearTimeout(reqId);
  417. };
  418. var globalFrameAction = [];
  419. var frameRequests = [];
  420. var frameRequestId = 0;
  421. function requestFrame(id) {
  422. if (!~frameRequests.indexOf(id)) {
  423. frameRequests.push(id);
  424. }
  425. if (frameRequests.length === 1) {
  426. frameRequestId = execGlobalFrameAction();
  427. }
  428. }
  429. function releaseFrame(id) {
  430. var index = frameRequests.indexOf(id);
  431. if (index !== -1) {
  432. frameRequests.splice(index, 1);
  433. }
  434. if (frameRequests.length === 0) {
  435. cancelAnimationFrame(frameRequestId);
  436. }
  437. }
  438. function execGlobalFrameAction() {
  439. var pending = globalFrameAction;
  440. globalFrameAction = [];
  441. while (pending.length) {
  442. pending.shift()();
  443. }
  444. if (frameRequests.length > 0) {
  445. frameRequestId = requestAnimationFrame(execGlobalFrameAction);
  446. }
  447. }
  448. function paralle(v1, v2, op) {
  449. if (false === isNaN(parseFloat(v1))) {
  450. return op(v1, v2);
  451. }
  452. var value = {};
  453. for (var n in v1) {
  454. if (v1.hasOwnProperty(n)) {
  455. value[n] = paralle(v1[n], v2[n], op);
  456. }
  457. }
  458. return value;
  459. }
  460. function getDelta(v1, v2) {
  461. return paralle(v1, v2, function(v1, v2) {
  462. return v2 - v1;
  463. });
  464. }
  465. // 不会深度遍历
  466. function getPercentValue(b, f, p) {
  467. return paralle(b, f, function(b, f) {
  468. return b + (f - b) * p;
  469. });
  470. }
  471. function TimelineEvent(timeline, type, param) {
  472. this.timeline = timeline;
  473. this.target = timeline.target;
  474. this.type = type;
  475. for (var name in param) {
  476. if (param.hasOwnProperty(name)) {
  477. this[name] = param[name];
  478. }
  479. }
  480. }
  481. var timelineId = 0;
  482. var Timeline = require("core/class").createClass("Timeline", {
  483. mixins: [ EventHandler ],
  484. constructor: function(animator, target, duration, easing) {
  485. this.callMixin();
  486. this.time = 0;
  487. this.duration = duration;
  488. this.target = target;
  489. this.easing = easing;
  490. this.status = "ready";
  491. this.animator = animator;
  492. this.beginVal = animator.beginVal;
  493. this.finishVal = animator.finishVal;
  494. this.setter = animator.setter;
  495. this.id = timelineId++;
  496. },
  497. guessValueType: function() {
  498. var value = this.beginVal;
  499. if (parseFloat(value)) {
  500. this.valueType = "number";
  501. return;
  502. }
  503. // string as color
  504. if (typeof value == "string" || value instanceof Color) {
  505. this.valueType = "color";
  506. return;
  507. }
  508. if (value.x && value.y) {
  509. this.valueType = "point";
  510. return;
  511. }
  512. if (value instanceof Matrix) {
  513. this.valueType = "matrix";
  514. }
  515. },
  516. nextFrame: function() {
  517. if (this.status != "playing") {
  518. return;
  519. }
  520. var ts = +new Date(), lts = this.lastFrameTS || 0, elapsed = ts - lts;
  521. var target = this.target, setter = this.setter;
  522. //
  523. // 1. 首次播放 lts 为 0,则修正 elapsed 为一帧的长度
  524. //
  525. // 2. 浏览器最小化或切换标签,requestAnimationFrame 不会执行。
  526. // 检测时间超过 200 ms(频率小于 5Hz ) 判定为计时器暂停,重置为一帧长度
  527. //
  528. // ref: http://stackoverflow.com/questions/13133434/requestanimationframe-detect-stop
  529. if (elapsed > 200) {
  530. elapsed = 1e3 / 60;
  531. }
  532. this.time += elapsed;
  533. this.setValue(this.getValue());
  534. this.lastFrameTS = ts;
  535. if (this.time >= this.duration) {
  536. this.timeUp();
  537. }
  538. globalFrameAction.push(this.nextFrame.bind(this));
  539. },
  540. getPlayTime: function() {
  541. return this.rollbacking ? this.duration - this.time : this.time;
  542. },
  543. getTimeProportion: function() {
  544. return this.getPlayTime() / this.duration;
  545. },
  546. getValueProportion: function() {
  547. return this.easing(this.getPlayTime(), 0, 1, this.duration);
  548. },
  549. getValue: function() {
  550. var b = this.beginVal, f = this.finishVal, p = this.getValueProportion(), v;
  551. switch (this.valueType) {
  552. case "color":
  553. b = b.getValues();
  554. f = f.getValues();
  555. v = getPercentValue(b, f, p);
  556. return Color.createRGBA(v.r, v.g, v.b, v.a);
  557. case "matrix":
  558. b = b.getMatrix();
  559. f = f.getMatrix();
  560. v = getPercentValue(b, f, p);
  561. return new Matrix(v);
  562. default:
  563. return getPercentValue(b, f, p);
  564. }
  565. },
  566. getDelta: function() {
  567. this.lastValue = this.lastValue || this.beginVal;
  568. return getDelta(this.lastValue, this.currentValue);
  569. },
  570. setValue: function(value, lastValue) {
  571. this.currentValue = value;
  572. this.setter.call(this.target, this.target, value, this);
  573. this.lastValue = value;
  574. },
  575. play: function() {
  576. var ctx = this.context;
  577. var me = this;
  578. var lastStatus = this.status;
  579. this.status = "playing";
  580. switch (lastStatus) {
  581. case "ready":
  582. this.beginVal = typeof this.beginVal == "function" ? this.beginVal.call(this.target, this.target) : this.beginVal;
  583. this.finishVal = typeof this.finishVal == "function" ? this.finishVal.call(this.target, this.target) : this.finishVal;
  584. this.time = 0;
  585. this.guessValueType();
  586. this.nextFrame();
  587. break;
  588. case "finished":
  589. case "stoped":
  590. this.time = 0;
  591. this.nextFrame();
  592. break;
  593. case "paused":
  594. this.lastFrameTS = 0;
  595. this.nextFrame();
  596. }
  597. this.fire("play", new TimelineEvent(this, "play", {
  598. lastStatus: lastStatus
  599. }));
  600. requestFrame(this.id);
  601. return this;
  602. },
  603. pause: function() {
  604. this.status = "paused";
  605. this.fire("pause", new TimelineEvent(this, "pause"));
  606. releaseFrame(this.id);
  607. return this;
  608. },
  609. stop: function() {
  610. this.status = "stoped";
  611. this.setValue(this.finishVal);
  612. this.rollbacking = false;
  613. this.fire("stop", new TimelineEvent(this, "stop"));
  614. releaseFrame(this.id);
  615. return this;
  616. },
  617. reset: function() {
  618. this.setValue(this.beginVal);
  619. },
  620. timeUp: function() {
  621. if (this.repeatOption) {
  622. this.time = 0;
  623. if (this.rollback) {
  624. if (this.rollbacking) {
  625. this.decreaseRepeat();
  626. this.rollbacking = false;
  627. } else {
  628. this.rollbacking = true;
  629. this.fire("rollback", new TimelineEvent(this, "rollback"));
  630. }
  631. } else {
  632. this.decreaseRepeat();
  633. }
  634. if (!this.repeatOption) {
  635. this.finish();
  636. } else {
  637. this.fire("repeat", new TimelineEvent(this, "repeat"));
  638. }
  639. } else {
  640. this.finish();
  641. }
  642. },
  643. finish: function() {
  644. this.setValue(this.finishVal);
  645. this.status = "finished";
  646. this.fire("finish", new TimelineEvent(this, "finish"));
  647. releaseFrame(this.id);
  648. },
  649. decreaseRepeat: function() {
  650. if (this.repeatOption !== true) {
  651. this.repeatOption--;
  652. }
  653. },
  654. repeat: function(repeat, rollback) {
  655. this.repeatOption = repeat;
  656. this.rollback = rollback;
  657. return this;
  658. }
  659. });
  660. return Timeline;
  661. });
  662. define("animate/translateanimator", [ "animate/animator", "animate/timeline", "animate/easing", "core/class", "graphic/shape", "graphic/matrix", "core/utils", "graphic/vector", "core/config", "graphic/svg", "graphic/eventhandler", "graphic/styled", "graphic/data", "graphic/pen" ], function(require, exports, module) {
  663. var Animator = require("animate/animator");
  664. var Matrix = require("graphic/matrix");
  665. var TranslateAnimator = require("core/class").createClass("TranslateAnimator", {
  666. base: Animator,
  667. constructor: function(x, y) {
  668. this.callBase({
  669. x: 0,
  670. y: 0
  671. }, {
  672. x: x,
  673. y: y
  674. }, function(target, value, timeline) {
  675. var delta = timeline.getDelta();
  676. target.translate(delta.x, delta.y);
  677. });
  678. }
  679. });
  680. var Shape = require("graphic/shape");
  681. require("core/class").extendClass(Shape, {
  682. fxTranslate: function(x, y, duration, easing, delay, callback) {
  683. return this.animate(new TranslateAnimator(x, y), duration, easing, delay, callback);
  684. }
  685. });
  686. return TranslateAnimator;
  687. });
  688. define("core/browser", [], function(require, exports, module) {
  689. var browser = function() {
  690. var agent = navigator.userAgent.toLowerCase(), opera = window.opera, browser = {
  691. ie: /(msie\s|trident.*rv:)([\w.]+)/.test(agent),
  692. opera: !!opera && opera.version,
  693. webkit: agent.indexOf(" applewebkit/") > -1,
  694. mac: agent.indexOf("macintosh") > -1,
  695. quirks: document.compatMode == "BackCompat"
  696. };
  697. browser.gecko = navigator.product == "Gecko" && !browser.webkit && !browser.opera && !browser.ie;
  698. var version = 0;
  699. // Internet Explorer 6.0+
  700. if (browser.ie) {
  701. version = (agent.match(/(msie\s|trident.*rv:)([\w.]+)/)[2] || 0) * 1;
  702. browser.ie11Compat = document.documentMode == 11;
  703. browser.ie9Compat = document.documentMode == 9;
  704. }
  705. // Gecko.
  706. if (browser.gecko) {
  707. var geckoRelease = agent.match(/rv:([\d\.]+)/);
  708. if (geckoRelease) {
  709. geckoRelease = geckoRelease[1].split(".");
  710. version = geckoRelease[0] * 1e4 + (geckoRelease[1] || 0) * 100 + (geckoRelease[2] || 0) * 1;
  711. }
  712. }
  713. if (/chrome\/(\d+\.\d)/i.test(agent)) {
  714. browser.chrome = +RegExp["$1"];
  715. }
  716. if (/(\d+\.\d)?(?:\.\d)?\s+safari\/?(\d+\.\d+)?/i.test(agent) && !/chrome/i.test(agent)) {
  717. browser.safari = +(RegExp["$1"] || RegExp["$2"]);
  718. }
  719. // Opera 9.50+
  720. if (browser.opera) version = parseFloat(opera.version());
  721. // WebKit 522+ (Safari 3+)
  722. if (browser.webkit) version = parseFloat(agent.match(/ applewebkit\/(\d+)/)[1]);
  723. browser.version = version;
  724. browser.isCompatible = !browser.mobile && (browser.ie && version >= 6 || browser.gecko && version >= 10801 || browser.opera && version >= 9.5 || browser.air && version >= 1 || browser.webkit && version >= 522 || false);
  725. return browser;
  726. }();
  727. return browser;
  728. });
  729. /**
  730. * @description 创建一个类
  731. * @param {String} fullClassName 类全名,包括命名空间。
  732. * @param {Plain} defines 要创建的类的特性
  733. * defines.constructor {Function} 类的构造函数,实例化的时候会被调用。
  734. * defines.base {String} 基类的名称。名称要使用全名。(因为base是javascript未来保留字,所以不用base)
  735. * defines.mixin {Array<String>} 要混合到新类的类集合
  736. * defines.<method> {Function} 其他类方法
  737. *
  738. * TODO:
  739. * Mixin 构造函数调用支持
  740. */
  741. define("core/class", [ "core/config" ], function(require, exports) {
  742. // just to bind context
  743. Function.prototype.bind = Function.prototype.bind || function(thisObj) {
  744. var args = Array.prototype.slice.call(arguments, 1);
  745. return this.apply(thisObj, args);
  746. };
  747. var config = require("core/config");
  748. // 方便调试查看
  749. if (config.debug) {
  750. var origin = Object.prototype.toString;
  751. Object.prototype.toString = function() {
  752. return this.__KityClassName || origin.call(this);
  753. };
  754. }
  755. // 所有类的基类
  756. function Class() {}
  757. Class.__KityClassName = "Class";
  758. function getCallerClass(instance, caller) {
  759. var currentClass = instance.constructor;
  760. }
  761. // 提供 base 调用支持
  762. Class.prototype.base = function(name) {
  763. var caller = arguments.callee.caller;
  764. var method = caller.__KityMethodClass.__KityBaseClass.prototype[name];
  765. return method.apply(this, Array.prototype.slice.call(arguments, 1));
  766. };
  767. // 直接调用 base 类的同名方法
  768. Class.prototype.callBase = function() {
  769. var caller = arguments.callee.caller;
  770. var method = caller.__KityMethodClass.__KityBaseClass.prototype[caller.__KityMethodName];
  771. return method.apply(this, arguments);
  772. };
  773. Class.prototype.mixin = function(name) {
  774. var caller = arguments.callee.caller;
  775. var mixins = caller.__KityMethodClass.__KityMixins;
  776. if (!mixins) {
  777. return this;
  778. }
  779. var method = mixins[name];
  780. return method.apply(this, Array.prototype.slice.call(arguments, 1));
  781. };
  782. Class.prototype.callMixin = function() {
  783. var caller = arguments.callee.caller;
  784. var methodName = caller.__KityMethodName;
  785. var mixins = caller.__KityMethodClass.__KityMixins;
  786. if (!mixins) {
  787. return this;
  788. }
  789. var method = mixins[methodName];
  790. if (methodName == "constructor") {
  791. for (var i = 0, l = method.length; i < l; i++) {
  792. method[i].call(this);
  793. }
  794. return this;
  795. } else {
  796. return method.apply(this, arguments);
  797. }
  798. };
  799. Class.prototype.pipe = function(fn) {
  800. if (typeof fn == "function") {
  801. fn.call(this, this);
  802. }
  803. return this;
  804. };
  805. Class.prototype.getType = function() {
  806. return this.__KityClassName;
  807. };
  808. // 检查基类是否调用了父类的构造函数
  809. // 该检查是弱检查,假如调用的代码被注释了,同样能检查成功(这个特性可用于知道建议调用,但是出于某些原因不想调用的情况)
  810. function checkBaseConstructorCall(targetClass, classname) {
  811. var code = targetClass.toString();
  812. if (!/this\.callBase/.test(code)) {
  813. throw new Error(classname + " : 类构造函数没有调用父类的构造函数!为了安全,请调用父类的构造函数");
  814. }
  815. }
  816. function checkMixinConstructorCall(targetClass, classname) {
  817. var code = targetClass.toString();
  818. if (!/this\.callMixin/.test(code)) {
  819. throw new Error(classname + " : 类构造函数没有调用父类的构造函数!为了安全,请调用父类的构造函数");
  820. }
  821. }
  822. var KITY_INHERIT_FLAG = "__KITY_INHERIT_FLAG_" + +new Date();
  823. function inherit(constructor, BaseClass, classname) {
  824. var KityClass = eval("(function " + classname + "( __inherit__flag ) {" + "if( __inherit__flag != KITY_INHERIT_FLAG ) {" + "KityClass.__KityConstructor.apply(this, arguments);" + "}" + "this.__KityClassName = KityClass.__KityClassName;" + "})");
  825. KityClass.__KityConstructor = constructor;
  826. KityClass.prototype = new BaseClass(KITY_INHERIT_FLAG);
  827. for (var methodName in BaseClass.prototype) {
  828. if (BaseClass.prototype.hasOwnProperty(methodName) && methodName.indexOf("__Kity") !== 0) {
  829. KityClass.prototype[methodName] = BaseClass.prototype[methodName];
  830. }
  831. }
  832. KityClass.prototype.constructor = KityClass;
  833. return KityClass;
  834. }
  835. function mixin(NewClass, mixins) {
  836. if (false === mixins instanceof Array) {
  837. return NewClass;
  838. }
  839. var i, length = mixins.length, proto, method;
  840. NewClass.__KityMixins = {
  841. constructor: []
  842. };
  843. for (i = 0; i < length; i++) {
  844. proto = mixins[i].prototype;
  845. for (method in proto) {
  846. if (false === proto.hasOwnProperty(method) || method.indexOf("__Kity") === 0) {
  847. continue;
  848. }
  849. if (method === "constructor") {
  850. // constructor 特殊处理
  851. NewClass.__KityMixins.constructor.push(proto[method]);
  852. } else {
  853. NewClass.prototype[method] = NewClass.__KityMixins[method] = proto[method];
  854. }
  855. }
  856. }
  857. return NewClass;
  858. }
  859. function extend(BaseClass, extension) {
  860. if (extension.__KityClassName) {
  861. extension = extension.prototype;
  862. }
  863. for (var methodName in extension) {
  864. if (extension.hasOwnProperty(methodName) && methodName.indexOf("__Kity") && methodName != "constructor") {
  865. var method = BaseClass.prototype[methodName] = extension[methodName];
  866. method.__KityMethodClass = BaseClass;
  867. method.__KityMethodName = methodName;
  868. }
  869. }
  870. return BaseClass;
  871. }
  872. exports.createClass = function(classname, defines) {
  873. var constructor, NewClass, BaseClass;
  874. if (arguments.length === 1) {
  875. defines = arguments[0];
  876. classname = "AnonymousClass";
  877. }
  878. BaseClass = defines.base || Class;
  879. if (defines.hasOwnProperty("constructor")) {
  880. constructor = defines.constructor;
  881. if (BaseClass != Class) {
  882. checkBaseConstructorCall(constructor, classname);
  883. }
  884. } else {
  885. constructor = function() {
  886. this.callBase.apply(this, arguments);
  887. this.callMixin.apply(this, arguments);
  888. };
  889. }
  890. NewClass = inherit(constructor, BaseClass, classname);
  891. NewClass = mixin(NewClass, defines.mixins);
  892. NewClass.__KityClassName = constructor.__KityClassName = classname;
  893. NewClass.__KityBaseClass = constructor.__KityBaseClass = BaseClass;
  894. NewClass.__KityMethodName = constructor.__KityMethodName = "constructor";
  895. NewClass.__KityMethodClass = constructor.__KityMethodClass = NewClass;
  896. // 下面这些不需要拷贝到原型链上
  897. delete defines.mixins;
  898. delete defines.constructor;
  899. delete defines.base;
  900. NewClass = extend(NewClass, defines);
  901. return NewClass;
  902. };
  903. exports.extendClass = extend;
  904. });
  905. define("core/config", [], function(require, exports, module) {
  906. return {
  907. debug: true,
  908. version: "1.0.0"
  909. };
  910. });
  911. define("core/utils", [], function(require, exports, module) {
  912. var utils = {
  913. each: function(obj, iterator, context) {
  914. if (obj === null) {
  915. return;
  916. }
  917. if (obj.length === +obj.length) {
  918. for (var i = 0, l = obj.length; i < l; i++) {
  919. if (iterator.call(context, obj[i], i, obj) === false) {
  920. return false;
  921. }
  922. }
  923. } else {
  924. for (var key in obj) {
  925. if (obj.hasOwnProperty(key)) {
  926. if (iterator.call(context, obj[key], key, obj) === false) {
  927. return false;
  928. }
  929. }
  930. }
  931. }
  932. },
  933. extend: function(t, s) {
  934. var a = arguments, notCover = this.isBoolean(a[a.length - 1]) ? a[a.length - 1] : false, len = this.isBoolean(a[a.length - 1]) ? a.length - 1 : a.length;
  935. for (var i = 1; i < len; i++) {
  936. var x = a[i];
  937. for (var k in x) {
  938. if (!notCover || !t.hasOwnProperty(k)) {
  939. t[k] = x[k];
  940. }
  941. }
  942. }
  943. return t;
  944. },
  945. clone: function(obj) {
  946. var cloned = {};
  947. for (var m in obj) {
  948. if (obj.hasOwnProperty(m)) {
  949. cloned[m] = obj[m];
  950. }
  951. }
  952. return cloned;
  953. },
  954. getValue: function(value, defaultValue) {
  955. return value !== undefined ? value : defaultValue;
  956. }
  957. };
  958. utils.each([ "String", "Function", "Array", "Number", "RegExp", "Object", "Boolean" ], function(v) {
  959. utils["is" + v] = function(obj) {
  960. return Object.prototype.toString.apply(obj) == "[object " + v + "]";
  961. };
  962. });
  963. return utils;
  964. });
  965. /**
  966. * 颜色矩阵运算效果封装
  967. */
  968. define("filter/effect/colormatrixeffect", [ "filter/effect/effect", "graphic/svg", "core/class", "core/utils", "core/config" ], function(require, exports, module) {
  969. var Effect = require("filter/effect/effect"), Utils = require("core/utils");
  970. var ColorMatrixEffect = require("core/class").createClass("ColorMatrixEffect", {
  971. base: Effect,
  972. constructor: function(type, input) {
  973. this.callBase(Effect.NAME_COLOR_MATRIX);
  974. this.set("type", Utils.getValue(type, ColorMatrixEffect.TYPE_MATRIX));
  975. this.set("in", Utils.getValue(input, Effect.INPUT_SOURCE_GRAPHIC));
  976. }
  977. });
  978. Utils.extend(ColorMatrixEffect, {
  979. // 类型常量
  980. TYPE_MATRIX: "matrix",
  981. TYPE_SATURATE: "saturate",
  982. TYPE_HUE_ROTATE: "hueRotate",
  983. TYPE_LUMINANCE_TO_ALPHA: "luminanceToAlpha",
  984. // 矩阵常量
  985. MATRIX_ORIGINAL: "10000010000010000010".split("").join(" "),
  986. MATRIX_EMPTY: "00000000000000000000".split("").join(" ")
  987. });
  988. return ColorMatrixEffect;
  989. });
  990. /**
  991. * 高斯模糊效果封装
  992. */
  993. define("filter/effect/compositeeffect", [ "filter/effect/effect", "graphic/svg", "core/class", "core/utils", "core/config" ], function(require, exports, module) {
  994. var Effect = require("filter/effect/effect"), Utils = require("core/utils");
  995. var CompositeEffect = require("core/class").createClass("CompositeEffect", {
  996. base: Effect,
  997. constructor: function(operator, input, input2) {
  998. this.callBase(Effect.NAME_COMPOSITE);
  999. this.set("operator", Utils.getValue(operator, CompositeEffect.OPERATOR_OVER));
  1000. if (input) {
  1001. this.set("in", input);
  1002. }
  1003. if (input2) {
  1004. this.set("in2", input2);
  1005. }
  1006. }
  1007. });
  1008. Utils.extend(CompositeEffect, {
  1009. // operator 常量
  1010. OPERATOR_OVER: "over",
  1011. OPERATOR_IN: "in",
  1012. OPERATOR_OUT: "out",
  1013. OPERATOR_ATOP: "atop",
  1014. OPERATOR_XOR: "xor",
  1015. OPERATOR_ARITHMETIC: "arithmetic"
  1016. });
  1017. return CompositeEffect;
  1018. });
  1019. /**
  1020. * 像素级别的矩阵卷积运算效果封装
  1021. */
  1022. define("filter/effect/convolvematrixeffect", [ "filter/effect/effect", "graphic/svg", "core/class", "core/utils", "core/config" ], function(require, exports, module) {
  1023. var Effect = require("filter/effect/effect"), Utils = require("core/utils");
  1024. var ConvolveMatrixEffect = require("core/class").createClass("ConvolveMatrixEffect", {
  1025. base: Effect,
  1026. constructor: function(edgeMode, input) {
  1027. this.callBase(Effect.NAME_CONVOLVE_MATRIX);
  1028. this.set("edgeMode", Utils.getValue(edgeMode, ConvolveMatrixEffect.MODE_DUPLICATE));
  1029. this.set("in", Utils.getValue(input, Effect.INPUT_SOURCE_GRAPHIC));
  1030. }
  1031. });
  1032. Utils.extend(ConvolveMatrixEffect, {
  1033. MODE_DUPLICATE: "duplicate",
  1034. MODE_WRAP: "wrap",
  1035. MODE_NONE: "none"
  1036. });
  1037. return ConvolveMatrixEffect;
  1038. });
  1039. /*
  1040. * 效果类
  1041. * 该类型的对象不存储任何内部属性, 所有操作都是针对该类对象所维护的节点进行的
  1042. */
  1043. define("filter/effect/effect", [ "graphic/svg", "core/class", "core/config", "core/utils" ], function(require, exports, module) {
  1044. var svg = require("graphic/svg"), Effect = require("core/class").createClass("Effect", {
  1045. constructor: function(type) {
  1046. this.node = svg.createNode(type);
  1047. },
  1048. getId: function() {
  1049. return this.node.id;
  1050. },
  1051. setId: function(id) {
  1052. this.node.id = id;
  1053. return this;
  1054. },
  1055. set: function(key, value) {
  1056. this.node.setAttribute(key, value);
  1057. return this;
  1058. },
  1059. get: function(key) {
  1060. return this.node.getAttribute(key);
  1061. },
  1062. getNode: function() {
  1063. return this.node;
  1064. },
  1065. // 返回该效果的result
  1066. toString: function() {
  1067. return this.node.getAttribute("result") || "";
  1068. }
  1069. });
  1070. require("core/utils").extend(Effect, {
  1071. // 特效名称常量
  1072. NAME_GAUSSIAN_BLUR: "feGaussianBlur",
  1073. NAME_OFFSET: "feOffset",
  1074. NAME_COMPOSITE: "feComposite",
  1075. NAME_COLOR_MATRIX: "feColorMatrix",
  1076. NAME_CONVOLVE_MATRIX: "feConvolveMatrix",
  1077. // 输入常量
  1078. INPUT_SOURCE_GRAPHIC: "SourceGraphic",
  1079. INPUT_SOURCE_ALPHA: "SourceAlpha",
  1080. INPUT_BACKGROUND_IMAGE: "BackgroundImage",
  1081. INPUT_BACKGROUND_ALPHA: "BackgroundAlpha",
  1082. INPUT_FILL_PAINT: "FillPaint",
  1083. INPUT_STROKE_PAINT: "StrokePaint"
  1084. });
  1085. return Effect;
  1086. });
  1087. /**
  1088. * 高斯模糊效果封装
  1089. */
  1090. define("filter/effect/gaussianblureffect", [ "filter/effect/effect", "graphic/svg", "core/class", "core/utils", "core/config" ], function(require, exports, module) {
  1091. var Effect = require("filter/effect/effect"), Utils = require("core/utils");
  1092. return require("core/class").createClass("GaussianblurEffect", {
  1093. base: Effect,
  1094. constructor: function(stdDeviation, input) {
  1095. this.callBase(Effect.NAME_GAUSSIAN_BLUR);
  1096. this.set("stdDeviation", Utils.getValue(stdDeviation, 1));
  1097. this.set("in", Utils.getValue(input, Effect.INPUT_SOURCE_GRAPHIC));
  1098. }
  1099. });
  1100. });
  1101. /**
  1102. * 偏移效果封装
  1103. */
  1104. define("filter/effect/offseteffect", [ "filter/effect/effect", "graphic/svg", "core/class", "core/utils", "core/config" ], function(require, exports, module) {
  1105. var Effect = require("filter/effect/effect"), Utils = require("core/utils");
  1106. return require("core/class").createClass("OffsetEffect", {
  1107. base: Effect,
  1108. constructor: function(dx, dy, input) {
  1109. this.callBase(Effect.NAME_OFFSET);
  1110. this.set("dx", Utils.getValue(dx, 0));
  1111. this.set("dy", Utils.getValue(dy, 0));
  1112. this.set("in", Utils.getValue(input, Effect.INPUT_SOURCE_GRAPHIC));
  1113. }
  1114. });
  1115. });
  1116. /*
  1117. * Effect所用的container
  1118. */
  1119. define("filter/effectcontainer", [ "core/class", "core/config", "graphic/container" ], function(require, exports, module) {
  1120. return require("core/class").createClass("EffectContainer", {
  1121. base: require("graphic/container"),
  1122. addEffect: function(point, pos) {
  1123. return this.addItem.apply(this, arguments);
  1124. },
  1125. prependEffect: function() {
  1126. return this.prependItem.apply(this, arguments);
  1127. },
  1128. appendEffect: function() {
  1129. return this.appendItem.apply(this, arguments);
  1130. },
  1131. removeEffect: function(pos) {
  1132. return this.removeItem.apply(this, arguments);
  1133. },
  1134. addEffects: function() {
  1135. return this.addItems.apply(this, arguments);
  1136. },
  1137. setEffects: function() {
  1138. return this.setItems.apply(this, arguments);
  1139. },
  1140. getEffect: function() {
  1141. return this.getItem.apply(this, arguments);
  1142. },
  1143. getEffects: function() {
  1144. return this.getItems.apply(this, arguments);
  1145. },
  1146. getFirstEffect: function() {
  1147. return this.getFirstItem.apply(this, arguments);
  1148. },
  1149. getLastEffect: function() {
  1150. return this.getLastItem.apply(this, arguments);
  1151. },
  1152. itemAddedHandler: function(effectItem, pos) {
  1153. var count = this.getEffects().length, nextEffectItem = this.getItem(pos + 1);
  1154. // 最后一个节点, 直接追加
  1155. if (count === pos + 1) {
  1156. this.node.appendChild(effectItem.getNode());
  1157. return;
  1158. }
  1159. this.node.insertBefore(effectItem.getNode(), nextEffectItem.getNode());
  1160. }
  1161. });
  1162. });
  1163. /**
  1164. * Filter 基类
  1165. */
  1166. define("filter/filter", [ "graphic/svg", "core/class", "core/config", "filter/effectcontainer", "graphic/container", "graphic/shape", "core/utils", "graphic/eventhandler", "graphic/styled", "graphic/data", "graphic/matrix", "graphic/pen" ], function(require, exports, module) {
  1167. var svg = require("graphic/svg");
  1168. var Class = require("core/class");
  1169. var Filter = Class.createClass("Filter", {
  1170. mixins: [ require("filter/effectcontainer") ],
  1171. constructor: function(x, y, width, height) {
  1172. this.node = svg.createNode("filter");
  1173. if (x !== undefined) {
  1174. this.set("x", x);
  1175. }
  1176. if (y !== undefined) {
  1177. this.set("y", y);
  1178. }
  1179. if (width !== undefined) {
  1180. this.set("width", width);
  1181. }
  1182. if (height !== undefined) {
  1183. this.set("height", height);
  1184. }
  1185. },
  1186. getId: function() {
  1187. return this.id;
  1188. },
  1189. setId: function(id) {
  1190. this.node.id = id;
  1191. return this;
  1192. },
  1193. set: function(key, value) {
  1194. this.node.setAttribute(key, value);
  1195. return this;
  1196. },
  1197. get: function(key) {
  1198. return this.node.getAttribute(key);
  1199. },
  1200. getNode: function() {
  1201. return this.node;
  1202. }
  1203. });
  1204. var Shape = require("graphic/shape");
  1205. Class.extendClass(Shape, {
  1206. applyFilter: function(filter) {
  1207. var filterId = filter.get("id");
  1208. if (filterId) {
  1209. this.node.setAttribute("filter", "url(#" + filterId + ")");
  1210. }
  1211. return this;
  1212. }
  1213. });
  1214. return Filter;
  1215. });
  1216. /*
  1217. * 高斯模糊滤镜
  1218. */
  1219. define("filter/gaussianblurfilter", [ "filter/effect/gaussianblureffect", "filter/effect/effect", "core/utils", "core/class", "core/config", "filter/filter", "graphic/svg", "filter/effectcontainer", "graphic/shape" ], function(require, exports, module) {
  1220. var GaussianblurEffect = require("filter/effect/gaussianblureffect");
  1221. return require("core/class").createClass("GaussianblurFilter", {
  1222. base: require("filter/filter"),
  1223. constructor: function(stdDeviation) {
  1224. this.callBase();
  1225. this.addEffect(new GaussianblurEffect(stdDeviation));
  1226. }
  1227. });
  1228. });
  1229. /*
  1230. * 投影滤镜
  1231. */
  1232. define("filter/projectionfilter", [ "filter/effect/gaussianblureffect", "filter/effect/effect", "core/utils", "core/class", "graphic/svg", "filter/effect/colormatrixeffect", "graphic/color", "graphic/standardcolor", "filter/effect/compositeeffect", "filter/effect/offseteffect", "core/config", "filter/filter", "filter/effectcontainer", "graphic/shape" ], function(require, exports, module) {
  1233. var GaussianblurEffect = require("filter/effect/gaussianblureffect"), Effect = require("filter/effect/effect"), ColorMatrixEffect = require("filter/effect/colormatrixeffect"), Color = require("graphic/color"), Utils = require("core/utils"), CompositeEffect = require("filter/effect/compositeeffect"), OffsetEffect = require("filter/effect/offseteffect");
  1234. return require("core/class").createClass("ProjectionFilter", {
  1235. base: require("filter/filter"),
  1236. constructor: function(stdDeviation, dx, dy) {
  1237. this.callBase();
  1238. this.gaussianblurEffect = new GaussianblurEffect(stdDeviation, Effect.INPUT_SOURCE_ALPHA);
  1239. this.gaussianblurEffect.set("result", "gaussianblur");
  1240. this.addEffect(this.gaussianblurEffect);
  1241. this.offsetEffect = new OffsetEffect(dx, dy, this.gaussianblurEffect);
  1242. this.offsetEffect.set("result", "offsetBlur");
  1243. this.addEffect(this.offsetEffect);
  1244. this.colorMatrixEffect = new ColorMatrixEffect(ColorMatrixEffect.TYPE_MATRIX, this.offsetEffect);
  1245. this.colorMatrixEffect.set("values", ColorMatrixEffect.MATRIX_ORIGINAL);
  1246. this.colorMatrixEffect.set("result", "colorOffsetBlur");
  1247. this.addEffect(this.colorMatrixEffect);
  1248. this.compositeEffect = new CompositeEffect(CompositeEffect.OPERATOR_OVER, Effect.INPUT_SOURCE_GRAPHIC, this.colorMatrixEffect);
  1249. this.addEffect(this.compositeEffect);
  1250. },
  1251. // 设置投影颜色
  1252. setColor: function(color) {
  1253. var matrix = null, originMatrix = null, colorValue = [];
  1254. if (Utils.isString(color)) {
  1255. color = Color.parse(color);
  1256. }
  1257. if (!color) {
  1258. return this;
  1259. }
  1260. matrix = ColorMatrixEffect.MATRIX_EMPTY.split(" ");
  1261. colorValue.push(color.get("r"));
  1262. colorValue.push(color.get("g"));
  1263. colorValue.push(color.get("b"));
  1264. // rgb 分量更改
  1265. for (var i = 0, len = colorValue.length; i < len; i++) {
  1266. matrix[i * 5 + 3] = colorValue[i] / 255;
  1267. }
  1268. // alpha 分量更改
  1269. matrix[18] = color.get("a");
  1270. this.colorMatrixEffect.set("values", matrix.join(" "));
  1271. return this;
  1272. },
  1273. // 设置投影透明度
  1274. setOpacity: function(opacity) {
  1275. var matrix = this.colorMatrixEffect.get("values").split(" ");
  1276. matrix[18] = opacity;
  1277. this.colorMatrixEffect.set("values", matrix.join(" "));
  1278. return this;
  1279. },
  1280. // 设置阴影偏移量
  1281. setOffset: function(dx, dy) {
  1282. this.setOffsetX(dx);
  1283. this.setOffsetY(dy);
  1284. },
  1285. setOffsetX: function(dx) {
  1286. this.offsetEffect.set("dx", dx);
  1287. },
  1288. setOffsetY: function(dy) {
  1289. this.offsetEffect.set("dy", dy);
  1290. },
  1291. setDeviation: function(deviation) {
  1292. this.gaussianblurEffect.set("stdDeviation", deviation);
  1293. }
  1294. });
  1295. });
  1296. /**
  1297. * 贝塞尔曲线
  1298. */
  1299. define("graphic/bezier", [ "core/class", "core/config", "graphic/pointcontainer", "graphic/container", "graphic/path", "core/utils", "graphic/shape", "graphic/svg" ], function(require, exports, module) {
  1300. return require("core/class").createClass("Bezier", {
  1301. mixins: [ require("graphic/pointcontainer") ],
  1302. base: require("graphic/path"),
  1303. constructor: function(bezierPoints) {
  1304. this.callBase();
  1305. bezierPoints = bezierPoints || [];
  1306. this.changeable = true;
  1307. this.setBezierPoints(bezierPoints);
  1308. },
  1309. getBezierPoints: function() {
  1310. return this.getPoints();
  1311. },
  1312. setBezierPoints: function(bezierPoints) {
  1313. return this.setPoints(bezierPoints);
  1314. },
  1315. //当点集合发生变化时采取的动作
  1316. onContainerChanged: function() {
  1317. if (this.changeable) {
  1318. this.update();
  1319. }
  1320. },
  1321. update: function() {
  1322. var drawer = null, bezierPoints = this.getBezierPoints();
  1323. //单独的一个点不画任何图形
  1324. if (bezierPoints.length < 2) {
  1325. return;
  1326. }
  1327. drawer = this.getDrawer();
  1328. drawer.clear();
  1329. var vertex = bezierPoints[0].getVertex(), forward = null, backward = null;
  1330. drawer.moveTo(vertex.x, vertex.y);
  1331. for (var i = 1, len = bezierPoints.length; i < len; i++) {
  1332. vertex = bezierPoints[i].getVertex();
  1333. backward = bezierPoints[i].getBackward();
  1334. forward = bezierPoints[i - 1].getForward();
  1335. drawer.bezierTo(forward.x, forward.y, backward.x, backward.y, vertex.x, vertex.y);
  1336. }
  1337. return this;
  1338. }
  1339. });
  1340. });
  1341. /**
  1342. * 贝塞尔点
  1343. */
  1344. define("graphic/bezierpoint", [ "graphic/shapepoint", "core/class", "graphic/point", "graphic/vector", "core/config" ], function(require, exports, module) {
  1345. var ShapePoint = require("graphic/shapepoint");
  1346. var Vector = require("graphic/vector");
  1347. var BezierPoint = require("core/class").createClass("BezierPoint", {
  1348. constructor: function(x, y, isSmooth) {
  1349. //顶点
  1350. this.vertex = new ShapePoint(x, y);
  1351. //控制点
  1352. this.forward = new ShapePoint(x, y);
  1353. this.backward = new ShapePoint(x, y);
  1354. //是否平滑
  1355. this.setSmooth(isSmooth === undefined || isSmooth);
  1356. this.setSymReflaction(true);
  1357. },
  1358. clone: function() {
  1359. var newPoint = new BezierPoint(), tmp = null;
  1360. tmp = this.getVertex();
  1361. newPoint.setVertex(tmp.x, tmp.y);
  1362. tmp = this.getForward();
  1363. newPoint.setForward(tmp.x, tmp.y);
  1364. tmp = this.getBackward();
  1365. newPoint.setBackward(tmp.x, tmp.y);
  1366. newPoint.setSmooth(newPoint.isSmooth());
  1367. return newPoint;
  1368. },
  1369. setVertex: function(x, y) {
  1370. this.vertex.setPoint(x, y);
  1371. this.update();
  1372. return this;
  1373. },
  1374. moveTo: function(x, y) {
  1375. var oldForward = this.forward.getPoint(), oldBackward = this.backward.getPoint(), oldVertex = this.vertex.getPoint(), //移动距离
  1376. distance = {
  1377. left: x - oldVertex.x,
  1378. top: y - oldVertex.y
  1379. };
  1380. // 更新
  1381. this.forward.setPoint(oldForward.x + distance.left, oldForward.y + distance.top);
  1382. this.backward.setPoint(oldBackward.x + distance.left, oldBackward.y + distance.top);
  1383. this.vertex.setPoint(x, y);
  1384. this.update();
  1385. },
  1386. setForward: function(x, y) {
  1387. this.forward.setPoint(x, y);
  1388. //更新后置点
  1389. if (this.smooth) {
  1390. this.updateAnother(this.forward, this.backward);
  1391. }
  1392. this.update();
  1393. return this;
  1394. },
  1395. setBackward: function(x, y) {
  1396. this.backward.setPoint(x, y);
  1397. //更新前置点
  1398. if (this.smooth) {
  1399. this.updateAnother(this.backward, this.forward);
  1400. }
  1401. this.update();
  1402. return this;
  1403. },
  1404. setSymReflaction: function(value) {
  1405. this.symReflaction = value;
  1406. },
  1407. isSymReflaction: function() {
  1408. return this.symReflaction;
  1409. },
  1410. updateAnother: function(p, q) {
  1411. var v = this.getVertex(), pv = Vector.fromPoints(p.getPoint(), v), vq = Vector.fromPoints(v, q.getPoint());
  1412. vq = Vector.normalize(pv, this.isSymReflaction() ? pv.length() : vq.length());
  1413. q.setPoint(v.x + vq.x, v.y + vq.y);
  1414. },
  1415. setSmooth: function(isSmooth) {
  1416. this.smooth = !!isSmooth;
  1417. return this;
  1418. },
  1419. getVertex: function() {
  1420. return this.vertex.getPoint();
  1421. },
  1422. getForward: function() {
  1423. return this.forward.getPoint();
  1424. },
  1425. getBackward: function() {
  1426. return this.backward.getPoint();
  1427. },
  1428. isSmooth: function() {
  1429. return this.smooth;
  1430. },
  1431. update: function() {
  1432. if (!this.container) {
  1433. return this;
  1434. }
  1435. //新增参数 this, 把当前引起变化的点传递过去, 以便有需要的地方可以获取到引起变化的源
  1436. this.container.update && this.container.update(this);
  1437. }
  1438. });
  1439. return BezierPoint;
  1440. });
  1441. define("graphic/circle", [ "core/class", "core/config", "graphic/ellipse", "core/utils", "graphic/path" ], function(require, exports, module) {
  1442. return require("core/class").createClass("Circle", {
  1443. base: require("graphic/ellipse"),
  1444. constructor: function(radius, cx, cy) {
  1445. this.callBase(radius, radius, cx, cy);
  1446. },
  1447. getRadius: function() {
  1448. return this.getRadiusX();
  1449. },
  1450. setRadius: function(radius) {
  1451. return this.callBase(radius, radius);
  1452. }
  1453. });
  1454. });
  1455. define("graphic/clip", [ "core/class", "core/config", "graphic/shape", "graphic/svg", "core/utils", "graphic/eventhandler", "graphic/styled", "graphic/data", "graphic/matrix", "graphic/pen", "graphic/shapecontainer", "graphic/container" ], function(require, exports, module) {
  1456. var Class = require("core/class");
  1457. var Shape = require("graphic/shape");
  1458. var Clip = Class.createClass("Clip", {
  1459. base: Shape,
  1460. mixins: [ require("graphic/shapecontainer") ],
  1461. constructor: function() {
  1462. this.callBase("clipPath");
  1463. },
  1464. clip: function(shape) {
  1465. shape.getNode().setAttribute("clip-path", "url(#" + this.getId() + ")");
  1466. return this;
  1467. }
  1468. });
  1469. Class.extendClass(Shape, {
  1470. clipWith: function(clip) {
  1471. clip.clip(this);
  1472. return this;
  1473. }
  1474. });
  1475. return Clip;
  1476. });
  1477. define("graphic/color", [ "core/utils", "graphic/standardcolor", "core/class", "core/config" ], function(require, exports, module) {
  1478. var Utils = require("core/utils"), StandardColor = require("graphic/standardcolor"), ColorUtils = {}, Color = require("core/class").createClass("Color", {
  1479. constructor: function() {
  1480. var colorValue = null;
  1481. //parse构造
  1482. if (typeof arguments[0] === "string") {
  1483. colorValue = ColorUtils.parseToValue(arguments[0]);
  1484. //解析失败
  1485. if (colorValue === null) {
  1486. colorValue = {
  1487. r: 0,
  1488. g: 0,
  1489. b: 0,
  1490. h: 0,
  1491. s: 0,
  1492. l: 0,
  1493. a: 1
  1494. };
  1495. }
  1496. } else {
  1497. colorValue = {
  1498. r: arguments[0] | 0,
  1499. g: arguments[1] | 0,
  1500. b: arguments[2] | 0,
  1501. //alpha 默认为1
  1502. a: parseFloat(arguments[3]) || 1
  1503. };
  1504. colorValue = ColorUtils.overflowFormat(colorValue);
  1505. //获取hsl分量
  1506. colorValue = Utils.extend(colorValue, ColorUtils.rgbValueToHslValue(colorValue));
  1507. }
  1508. this._color = colorValue;
  1509. },
  1510. set: function(name, value) {
  1511. var values = null;
  1512. //设置的值非法
  1513. if (!Color._MAX_VALUE[name]) {
  1514. throw new Error("Color set(): Illegal parameter");
  1515. }
  1516. if (name !== "a") {
  1517. value = Math.floor(value);
  1518. }
  1519. if (name == "h") {
  1520. value = (value + 360) % 360;
  1521. }
  1522. this._color[name] = Math.max(Color._MIN_VALUE[name], Math.min(Color._MAX_VALUE[name], value));
  1523. if ("rgb".indexOf(name) !== -1) {
  1524. this._color = Utils.extend(this._color, ColorUtils.rgbValueToHslValue(this._color));
  1525. } else if ("hsl".indexOf(name) !== -1) {
  1526. this._color = Utils.extend(this._color, ColorUtils.hslValueToRGBValue(this._color));
  1527. }
  1528. return this;
  1529. },
  1530. inc: function(name, value) {
  1531. value = this.get(name) + value;
  1532. if (name == "h") {
  1533. value = (value + 360) % 360;
  1534. } else {
  1535. value = Math.min(Color._MAX_VALUE[name], value);
  1536. value = Math.max(Color._MIN_VALUE[name], value);
  1537. }
  1538. return this.clone().set(name, value);
  1539. },
  1540. dec: function(name, value) {
  1541. return this.inc(name, -value);
  1542. },
  1543. clone: function() {
  1544. return new Color(this.toRGBA());
  1545. },
  1546. get: function(name) {
  1547. if (!Color._MAX_VALUE[name]) {
  1548. return null;
  1549. }
  1550. return this._color[name];
  1551. },
  1552. getValues: function() {
  1553. return Utils.clone(this._color);
  1554. },
  1555. toRGB: function() {
  1556. return ColorUtils.toString(this._color, "rgb");
  1557. },
  1558. toRGBA: function() {
  1559. return ColorUtils.toString(this._color, "rgba");
  1560. },
  1561. toHEX: function() {
  1562. return ColorUtils.toString(this._color, "hex");
  1563. },
  1564. toHSL: function() {
  1565. return ColorUtils.toString(this._color, "hsl");
  1566. },
  1567. toHSLA: function() {
  1568. return ColorUtils.toString(this._color, "hsla");
  1569. },
  1570. //默认实现是调用toRGB或者toRGBA
  1571. toString: function() {
  1572. if (this._color.a === 1) {
  1573. return this.toRGB();
  1574. }
  1575. return this.toRGBA();
  1576. }
  1577. });
  1578. //Color 静态方法
  1579. Utils.extend(Color, {
  1580. //各分量可表示的最大值
  1581. _MAX_VALUE: {
  1582. r: 255,
  1583. g: 255,
  1584. b: 255,
  1585. h: 360,
  1586. s: 100,
  1587. l: 100,
  1588. a: 1
  1589. },
  1590. //各分量最小值
  1591. _MIN_VALUE: {
  1592. r: 0,
  1593. g: 0,
  1594. b: 0,
  1595. h: 0,
  1596. s: 0,
  1597. l: 0,
  1598. a: 0
  1599. },
  1600. //分量常量
  1601. R: "r",
  1602. G: "g",
  1603. B: "b",
  1604. H: "h",
  1605. S: "s",
  1606. L: "l",
  1607. A: "a",
  1608. parse: function(valStr) {
  1609. var rgbValue = ColorUtils.parseToValue(valStr);
  1610. //解析失败, 返回一个默认color实例
  1611. if (rgbValue === null) {
  1612. return new Color();
  1613. }
  1614. return new Color(rgbValue.r, rgbValue.g, rgbValue.b, rgbValue.a);
  1615. },
  1616. createHSL: function(h, s, l) {
  1617. return Color.createHSLA(h, s, l, 1);
  1618. },
  1619. createHSLA: function(h, s, l, a) {
  1620. var colorValue = null;
  1621. s += "%";
  1622. l += "%";
  1623. colorValue = [ "hsla(" + h, s, l, a + ")" ];
  1624. return Color.parse(colorValue.join(", "));
  1625. },
  1626. createRGB: function(r, g, b) {
  1627. return Color.createRGBA(r, g, b, 1);
  1628. },
  1629. createRGBA: function(r, g, b, a) {
  1630. return new Color(r, g, b, a);
  1631. }
  1632. });
  1633. //内部工具对象
  1634. Utils.extend(ColorUtils, {
  1635. parseToValue: function(valStr) {
  1636. var rgbaValue = {};
  1637. /* 优先检测在调色板中是否有对应的颜色 */
  1638. valStr = StandardColor.EXTEND_STANDARD[valStr] || StandardColor.COLOR_STANDARD[valStr] || valStr;
  1639. /* 颜色转换 */
  1640. //hex格式
  1641. if (/^#([0-9a-f]{3}|[0-9a-f]{6})$/i.test(valStr)) {
  1642. rgbaValue = ColorUtils.hexToValue(valStr);
  1643. } else if (/^(rgba?)/i.test(valStr)) {
  1644. rgbaValue = ColorUtils.rgbaToValue(valStr);
  1645. } else if (/^(hsla?)/i.test(valStr)) {
  1646. rgbaValue = ColorUtils.hslaToValue(valStr);
  1647. } else {
  1648. return null;
  1649. }
  1650. return ColorUtils.overflowFormat(rgbaValue);
  1651. },
  1652. hexToValue: function(hexStr) {
  1653. var result = {}, keys = [ "r", "g", "b" ];
  1654. if (/^#([0-9a-f]{3}|[0-9a-f]{6})$/i.test(hexStr)) {
  1655. hexStr = RegExp.$1.split("");
  1656. Utils.each(keys, function(key, index) {
  1657. if (hexStr.length === 3) {
  1658. result[key] = ColorUtils.toNumber(hexStr[index] + hexStr[index]);
  1659. } else {
  1660. result[key] = ColorUtils.toNumber(hexStr[index * 2] + hexStr[index * 2 + 1]);
  1661. }
  1662. });
  1663. //转换出hsl值
  1664. result = Utils.extend(result, ColorUtils.rgbValueToHslValue(result));
  1665. result.a = 1;
  1666. return result;
  1667. }
  1668. return null;
  1669. },
  1670. rgbaToValue: function(rgbaStr) {
  1671. var result = {}, hasAlpha = false, keys = [ "r", "g", "b" ];
  1672. if (/^(rgba?)/i.test(rgbaStr)) {
  1673. hasAlpha = RegExp.$1.length === 4;
  1674. rgbaStr = rgbaStr.replace(/^rgba?/i, "").replace(/\s+/g, "").replace(/[^0-9,.]/g, "").split(",");
  1675. Utils.each(keys, function(key, index) {
  1676. result[key] = rgbaStr[index] | 0;
  1677. });
  1678. //转换出hsl值
  1679. result = Utils.extend(result, ColorUtils.rgbValueToHslValue(result));
  1680. result.a = hasAlpha ? parseFloat(rgbaStr[3]) : 1;
  1681. return result;
  1682. }
  1683. return null;
  1684. },
  1685. hslaToValue: function(hslaStr) {
  1686. var result = {}, hasAlpha = false;
  1687. if (/^(hsla?)/i.test(hslaStr)) {
  1688. hasAlpha = RegExp.$1.length === 4;
  1689. hslaStr = hslaStr.replace(/^hsla?/i, "").replace(/\s+/g, "").replace(/[^0-9,.]/g, "").split(",");
  1690. //记录hsl值
  1691. result.h = hslaStr[0] | 0;
  1692. result.s = hslaStr[1] | 0;
  1693. result.l = hslaStr[2] | 0;
  1694. //转换出rgb值
  1695. result = Utils.extend(result, ColorUtils.hslValueToRGBValue(result));
  1696. //hsl值转换为rgb值
  1697. result = ColorUtils.hslValueToRGBValue(result);
  1698. result.a = hasAlpha ? parseFloat(hslaStr[3]) : 1;
  1699. return result;
  1700. }
  1701. return null;
  1702. },
  1703. //hsl值对象转换为rgb值对象
  1704. hslValueToRGBValue: function(hslValue) {
  1705. var q = null, p = null, result = {};
  1706. hslValue = Utils.extend({}, hslValue);
  1707. hslValue.h = hslValue.h / 360;
  1708. hslValue.s = hslValue.s / 100;
  1709. hslValue.l = hslValue.l / 100;
  1710. //分量计算
  1711. if (hslValue.s === 0) {
  1712. result.r = result.g = result.b = hslValue.l;
  1713. } else {
  1714. if (hslValue.l < .5) {
  1715. q = hslValue.l * (1 + hslValue.s);
  1716. } else {
  1717. q = hslValue.l + hslValue.s - hslValue.l * hslValue.s;
  1718. }
  1719. p = 2 * hslValue.l - q;
  1720. result.r = trans(p, q, hslValue.h + 1 / 3);
  1721. result.g = trans(p, q, hslValue.h);
  1722. result.b = trans(p, q, hslValue.h - 1 / 3);
  1723. }
  1724. result.r = Math.min(Math.round(result.r * 255), 255);
  1725. result.g = Math.min(Math.round(result.g * 255), 255);
  1726. result.b = Math.min(Math.round(result.b * 255), 255);
  1727. return result;
  1728. function trans(v1, v2, vH) {
  1729. if (vH < 0) {
  1730. vH += 1;
  1731. } else if (vH > 1) {
  1732. vH -= 1;
  1733. }
  1734. if (6 * vH < 1) {
  1735. return v1 + (v2 - v1) * 6 * vH;
  1736. } else if (2 * vH < 1) {
  1737. return v2;
  1738. } else if (3 * vH < 2) {
  1739. return v1 + (v2 - v1) * (2 / 3 - vH) * 6;
  1740. }
  1741. return v1;
  1742. }
  1743. },
  1744. //rgb值对象转换为hsl值对象
  1745. rgbValueToHslValue: function(rgbValue) {
  1746. var max = null, min = null, result = {};
  1747. rgbValue = Utils.extend({}, rgbValue);
  1748. rgbValue.r = rgbValue.r / 255;
  1749. rgbValue.g = rgbValue.g / 255;
  1750. rgbValue.b = rgbValue.b / 255;
  1751. max = Math.max(rgbValue.r, rgbValue.g, rgbValue.b);
  1752. min = Math.min(rgbValue.r, rgbValue.g, rgbValue.b);
  1753. //h分量计算
  1754. if (max === min) {
  1755. result.h = 0;
  1756. } else if (max === rgbValue.r) {
  1757. if (rgbValue.g >= rgbValue.b) {
  1758. result.h = 60 * (rgbValue.g - rgbValue.b) / (max - min);
  1759. } else {
  1760. result.h = 60 * (rgbValue.g - rgbValue.b) / (max - min) + 360;
  1761. }
  1762. } else if (max === rgbValue.g) {
  1763. result.h = 60 * (rgbValue.b - rgbValue.r) / (max - min) + 120;
  1764. } else if (max === rgbValue.b) {
  1765. result.h = 60 * (rgbValue.r - rgbValue.g) / (max - min) + 240;
  1766. }
  1767. //l分量计算
  1768. result.l = (max + min) / 2;
  1769. //s分量计算
  1770. if (result.l === 0 || max === min) {
  1771. result.s = 0;
  1772. } else if (result.l > 0 && result.l <= .5) {
  1773. result.s = (max - min) / (max + min);
  1774. } else {
  1775. result.s = (max - min) / (2 - max - min);
  1776. }
  1777. //格式化hsl结果
  1778. result.h = Math.round(result.h);
  1779. result.s = Math.round(result.s * 100);
  1780. result.l = Math.round(result.l * 100);
  1781. return result;
  1782. },
  1783. toString: function(colorValue, type) {
  1784. var vals = [];
  1785. colorValue = Utils.extend({}, colorValue);
  1786. if (type.indexOf("hsl") !== -1) {
  1787. colorValue.s += "%";
  1788. colorValue.l += "%";
  1789. }
  1790. if (type !== "hex") {
  1791. Utils.each(type.split(""), function(key) {
  1792. vals.push(colorValue[key]);
  1793. });
  1794. return (type + "(" + vals.join(", ") + ")").toLowerCase();
  1795. } else {
  1796. vals.push(ColorUtils.toHexValue(+colorValue.r));
  1797. vals.push(ColorUtils.toHexValue(+colorValue.g));
  1798. vals.push(ColorUtils.toHexValue(+colorValue.b));
  1799. return ("#" + vals.join("")).toLowerCase();
  1800. }
  1801. },
  1802. //16进制的2个数字转化为10进制, 如果转化失败, 返回0
  1803. toNumber: function(value) {
  1804. return Number("0x" + value) | 0;
  1805. },
  1806. toHexValue: function(value) {
  1807. var result = value.toString(16);
  1808. return result.length === 1 ? "0" + result : result;
  1809. },
  1810. //溢出控制
  1811. overflowFormat: function(value) {
  1812. var tmpValue = Utils.extend({}, value), keys = "rgba";
  1813. Utils.each(keys.split(""), function(key) {
  1814. if (!tmpValue.hasOwnProperty(key)) {
  1815. return;
  1816. }
  1817. //上溢出
  1818. tmpValue[key] = Math.min(Color._MAX_VALUE[key], tmpValue[key]);
  1819. //下溢出
  1820. tmpValue[key] = Math.max(Color._MIN_VALUE[key], tmpValue[key]);
  1821. });
  1822. return tmpValue;
  1823. }
  1824. });
  1825. return Color;
  1826. });
  1827. define("graphic/container", [ "core/class", "core/config" ], function(require, exports, module) {
  1828. function itemRemove() {
  1829. this.container.removeItem(this);
  1830. return this;
  1831. }
  1832. return require("core/class").createClass("Container", {
  1833. getItems: function() {
  1834. return this.items || (this.items = []);
  1835. },
  1836. getItem: function(index) {
  1837. return this.getItems()[index];
  1838. },
  1839. getFirstItem: function() {
  1840. return this.getItem(0);
  1841. },
  1842. getLastItem: function() {
  1843. return this.getItem(this.getItems().length - 1);
  1844. },
  1845. indexOf: function(item) {
  1846. return this.getItems().indexOf(item);
  1847. },
  1848. eachItem: function(fn) {
  1849. var items = this.getItems(), length = items.length, i;
  1850. for (i = 0; i < length; i++) {
  1851. fn.call(this, i, items[i]);
  1852. }
  1853. return this;
  1854. },
  1855. addItem: function(item, pos, noEvent) {
  1856. var items = this.getItems(), length = items.length;
  1857. if (~items.indexOf(item)) {
  1858. return this;
  1859. }
  1860. if (!(pos >= 0 && pos < length)) {
  1861. pos = length;
  1862. }
  1863. items.splice(pos, 0, item);
  1864. if (typeof item === "object") {
  1865. item.container = this;
  1866. item.remove = itemRemove;
  1867. }
  1868. this.handleAdd(item, pos);
  1869. if (!noEvent) {
  1870. this.onContainerChanged("add", [ item ]);
  1871. }
  1872. return this;
  1873. },
  1874. addItems: function(items) {
  1875. for (var i = 0, l = items.length; i < l; i++) {
  1876. this.addItem(items[i], -1, true);
  1877. }
  1878. this.onContainerChanged("add", items);
  1879. return this;
  1880. },
  1881. setItems: function(items) {
  1882. // TODO: Optimize
  1883. return this.clear().addItems(items);
  1884. },
  1885. appendItem: function(item) {
  1886. return this.addItem(item);
  1887. },
  1888. prependItem: function(item) {
  1889. return this.addItem(item, 0);
  1890. },
  1891. removeItem: function(pos, noEvent) {
  1892. if (typeof pos !== "number") {
  1893. return this.removeItem(this.indexOf(pos));
  1894. }
  1895. var items = this.getItems(), length = items.length, item = items[pos];
  1896. if (item === undefined) {
  1897. return this;
  1898. }
  1899. items.splice(pos, 1);
  1900. if (item.container) {
  1901. delete item.container;
  1902. }
  1903. if (item.remove) {
  1904. delete item.remove;
  1905. }
  1906. this.handleRemove(item, pos);
  1907. if (!noEvent) {
  1908. this.onContainerChanged("remove", [ item ]);
  1909. }
  1910. return this;
  1911. },
  1912. clear: function() {
  1913. var removed = [];
  1914. var item;
  1915. while (item = this.getFirstItem()) {
  1916. removed.push(item);
  1917. this.removeItem(0, true);
  1918. }
  1919. this.onContainerChanged("remove", removed);
  1920. return this;
  1921. },
  1922. onContainerChanged: function(type, items) {},
  1923. handleAdd: function(item, index) {},
  1924. handleRemove: function(item, index) {}
  1925. });
  1926. });
  1927. /*
  1928. * 曲线
  1929. * */
  1930. define("graphic/curve", [ "core/utils", "core/class", "core/config", "graphic/path", "graphic/shape", "graphic/svg", "graphic/pointcontainer", "graphic/container" ], function(require, exports, module) {
  1931. var Utils = require("core/utils"), CurveUtil = {
  1932. /*
  1933. * 获取由两个以上的点组成的曲线的平移线
  1934. * @param points 曲线上的点的集合, 集合中的点的数量必须大于2
  1935. * @return 平移线数组
  1936. */
  1937. getCurvePanLines: function(points, smoothFactor) {
  1938. //计算原始点的中点坐标
  1939. var centerPoints = CurveUtil.getCenterPoints(points), //注意:计算中点连线的中点坐标, 得出平移线
  1940. panLines = CurveUtil.getPanLine(points.length, centerPoints);
  1941. //平移线移动到顶点
  1942. return CurveUtil.getMovedPanLines(points, panLines, smoothFactor);
  1943. },
  1944. /*
  1945. * 计算给定点集合的连线的中点
  1946. * @param points
  1947. */
  1948. getCenterPoints: function(points) {
  1949. var centerPoints = {}, key = null;
  1950. for (var i = 0, j = 0, len = points.length; i < len; i++) {
  1951. //j是下一个点的索引
  1952. j = i === len - 1 ? 0 : i + 1;
  1953. key = i + "," + j;
  1954. //计算中点坐标
  1955. centerPoints[key] = {
  1956. x: (points[i].getX() + points[j].getX()) / 2,
  1957. y: (points[i].getY() + points[j].getY()) / 2
  1958. };
  1959. }
  1960. return centerPoints;
  1961. },
  1962. /*
  1963. * 对getCenterPoints()接口获取到的数据做处理, 计算出各个顶点对应的平移线数据
  1964. * @param length 集合中点的个数
  1965. * @param points 点集合, 该集合应该是getCenterPoints()接口返回的数据
  1966. */
  1967. getPanLine: function(length, points) {
  1968. var result = {}, //顶点索引
  1969. pointIndex = null;
  1970. for (var i = 0, j; i < length; i++) {
  1971. var point1 = null, point2 = null;
  1972. //计算当前点
  1973. j = (i + 1) % length;
  1974. //保存当前处理的顶点索引
  1975. pointIndex = j;
  1976. point1 = points[i + "," + j];
  1977. //计算下一个点
  1978. i = j;
  1979. j = (i + 1) % length;
  1980. point2 = points[i + "," + j];
  1981. result[pointIndex] = {
  1982. points: [ {
  1983. x: point1.x,
  1984. y: point1.y
  1985. }, {
  1986. x: point2.x,
  1987. y: point2.y
  1988. } ],
  1989. center: {
  1990. x: (point1.x + point2.x) / 2,
  1991. y: (point1.y + point2.y) / 2
  1992. }
  1993. };
  1994. //还原i值
  1995. i = (pointIndex + length - 1) % length;
  1996. }
  1997. return result;
  1998. },
  1999. /*
  2000. * 计算平移线移动到顶点后的位置
  2001. * @param points 顶点集合
  2002. * @param panLines 平移线集合
  2003. */
  2004. getMovedPanLines: function(points, panLines, smoothFactor) {
  2005. var result = {};
  2006. Utils.each(points, function(point, index) {
  2007. //当前平移线
  2008. var currentPanLine = panLines[index], //平移线中点
  2009. center = currentPanLine.center, //移动距离
  2010. distance = {
  2011. x: center.x - point.getX(),
  2012. y: center.y - point.getY()
  2013. };
  2014. var currentResult = result[index] = {
  2015. points: [],
  2016. center: {
  2017. x: point.getX(),
  2018. y: point.getY()
  2019. }
  2020. };
  2021. //计算控制点到顶点的距离, 并且应用平滑系数到距离上
  2022. Utils.each(currentPanLine.points, function(controlPoint, index) {
  2023. var moved = {
  2024. x: controlPoint.x - distance.x,
  2025. y: controlPoint.y - distance.y
  2026. };
  2027. var vertex = currentResult.center;
  2028. var dx = moved.x - vertex.x;
  2029. var dy = moved.y - vertex.y;
  2030. moved.x = vertex.x + smoothFactor * dx;
  2031. moved.y = vertex.y + smoothFactor * dy;
  2032. currentResult.points.push(moved);
  2033. });
  2034. });
  2035. return result;
  2036. }
  2037. };
  2038. return require("core/class").createClass("Curve", {
  2039. base: require("graphic/path"),
  2040. mixins: [ require("graphic/pointcontainer") ],
  2041. constructor: function(points, isColse) {
  2042. this.callBase();
  2043. this.setPoints(points || []);
  2044. this.closeState = !!isColse;
  2045. this.changeable = true;
  2046. this.smoothFactor = 1;
  2047. this.update();
  2048. },
  2049. //当点集合发生变化时采取的动作
  2050. onContainerChanged: function() {
  2051. if (this.changeable) {
  2052. this.update();
  2053. }
  2054. },
  2055. setSmoothFactor: function(factor) {
  2056. this.smoothFactor = factor < 0 ? 0 : factor;
  2057. this.update();
  2058. return this;
  2059. },
  2060. getSmoothFactor: function() {
  2061. return this.smoothFactor;
  2062. },
  2063. update: function() {
  2064. var points = this.getPoints(), withControlPoints = null, drawer = this.getDrawer(), curPoint = null, curControlPoint = null, prevControlPoint = null;
  2065. drawer.clear();
  2066. if (points.length === 0) {
  2067. return this;
  2068. } else {
  2069. drawer.moveTo(points[0].getX(), points[0].getY());
  2070. }
  2071. if (points.length === 1) {
  2072. return this;
  2073. }
  2074. if (points.length === 2) {
  2075. drawer.lineTo(points[1].getX(), points[1].getY());
  2076. return this;
  2077. }
  2078. //获取已转换过后的带控制点的所有点
  2079. withControlPoints = CurveUtil.getCurvePanLines(points, this.getSmoothFactor());
  2080. for (var i = 1, len = points.length; i < len; i++) {
  2081. //当前顶点
  2082. curPoint = withControlPoints[i].center;
  2083. //当前控制点
  2084. if (this.closeState || i != len - 1) {
  2085. curControlPoint = withControlPoints[i].points[0];
  2086. } else {
  2087. //非闭合状态下最后一个点的处理
  2088. curControlPoint = withControlPoints[i].center;
  2089. }
  2090. if (this.closeState || i != 1) {
  2091. prevControlPoint = withControlPoints[i - 1].points[1];
  2092. } else {
  2093. //非闭合状态下第一个点的处理
  2094. prevControlPoint = withControlPoints[i - 1].center;
  2095. }
  2096. drawer.bezierTo(prevControlPoint.x, prevControlPoint.y, curControlPoint.x, curControlPoint.y, curPoint.x, curPoint.y);
  2097. }
  2098. //处理闭合
  2099. if (this.closeState) {
  2100. curPoint = withControlPoints[0].center;
  2101. curControlPoint = withControlPoints[0].points[0];
  2102. prevControlPoint = withControlPoints[points.length - 1].points[1];
  2103. drawer.bezierTo(prevControlPoint.x, prevControlPoint.y, curControlPoint.x, curControlPoint.y, curPoint.x, curPoint.y);
  2104. }
  2105. return this;
  2106. },
  2107. close: function() {
  2108. this.closeState = true;
  2109. return this.update();
  2110. },
  2111. open: function() {
  2112. this.closeState = false;
  2113. return this.update();
  2114. },
  2115. isClose: function() {
  2116. return !!this.closeState;
  2117. }
  2118. });
  2119. });
  2120. define("graphic/data", [ "core/class", "core/config" ], function(require, exports, module) {
  2121. return require("core/class").createClass("Data", {
  2122. constructor: function() {
  2123. this._data = {};
  2124. },
  2125. setData: function(name, value) {
  2126. this._data[name] = value;
  2127. return this;
  2128. },
  2129. getData: function(name) {
  2130. return this._data[name];
  2131. },
  2132. removeData: function(name) {
  2133. delete this._data[name];
  2134. return this;
  2135. }
  2136. });
  2137. });
  2138. define("graphic/defbrush", [ "graphic/svg", "core/class", "core/config" ], function(require, exports, module) {
  2139. var svg = require("graphic/svg");
  2140. return require("core/class").createClass("GradientBrush", {
  2141. constructor: function(nodeType) {
  2142. this.callBase();
  2143. this.node = svg.createNode(nodeType);
  2144. },
  2145. fill: function(path) {
  2146. var pathNode = path.node;
  2147. pathNode.setAttribute("fill", "url(#" + this.node.id + ")");
  2148. return this;
  2149. }
  2150. });
  2151. });
  2152. define("graphic/ellipse", [ "core/utils", "core/class", "core/config", "graphic/path", "graphic/shape", "graphic/svg" ], function(require, exports, module) {
  2153. var Utils = require("core/utils");
  2154. return require("core/class").createClass("Ellipse", {
  2155. base: require("graphic/path"),
  2156. constructor: function(rx, ry, cx, cy) {
  2157. this.callBase();
  2158. this.rx = rx || 0;
  2159. this.ry = ry || 0;
  2160. this.cx = cx || 0;
  2161. this.cy = cy || 0;
  2162. this.update();
  2163. },
  2164. update: function() {
  2165. var rx = this.rx, ry = this.ry;
  2166. x1 = this.cx + rx, x2 = this.cx - rx, y = this.cy;
  2167. var drawer = this.getDrawer();
  2168. drawer.clear();
  2169. drawer.moveTo(x1, y);
  2170. drawer.arcTo(rx, ry, 0, 1, 1, x2, y);
  2171. drawer.arcTo(rx, ry, 0, 1, 1, x1, y);
  2172. return this;
  2173. },
  2174. getRadius: function() {
  2175. return {
  2176. x: this.rx,
  2177. y: this.ry
  2178. };
  2179. },
  2180. getRadiusX: function() {
  2181. return this.rx;
  2182. },
  2183. getRadiusY: function() {
  2184. return this.ry;
  2185. },
  2186. getCenter: function() {
  2187. return {
  2188. x: this.cx,
  2189. y: this.cy
  2190. };
  2191. },
  2192. getCenterX: function() {
  2193. return this.cx;
  2194. },
  2195. getCenterY: function() {
  2196. return this.cy;
  2197. },
  2198. setRadius: function(rx, ry) {
  2199. this.rx = rx;
  2200. this.ry = ry;
  2201. return this.update();
  2202. },
  2203. setRadiusX: function(rx) {
  2204. this.rx = rx;
  2205. return this.update();
  2206. },
  2207. setRadiusY: function(ry) {
  2208. this.ry = ry;
  2209. return this.update();
  2210. },
  2211. setCenter: function(cx, cy) {
  2212. this.cx = cx;
  2213. this.cy = cy;
  2214. return this.update();
  2215. },
  2216. setCenterX: function(cx) {
  2217. this.cx = cx;
  2218. return this.update();
  2219. },
  2220. setCenterY: function(cy) {
  2221. this.cy = cy;
  2222. return this.update();
  2223. }
  2224. });
  2225. });
  2226. /*
  2227. * kity event 实现
  2228. */
  2229. define("graphic/eventhandler", [ "core/utils", "graphic/shapeevent", "graphic/matrix", "core/class", "core/config" ], function(require, exports, module) {
  2230. // polyfill
  2231. (function() {
  2232. function CustomEvent(event, params) {
  2233. params = params || {
  2234. bubbles: false,
  2235. cancelable: false,
  2236. detail: undefined
  2237. };
  2238. var evt = document.createEvent("CustomEvent");
  2239. evt.initCustomEvent(event, params.bubbles, params.cancelable, params.detail);
  2240. return evt;
  2241. }
  2242. CustomEvent.prototype = window.Event.prototype;
  2243. window.CustomEvent = CustomEvent;
  2244. })();
  2245. var Utils = require("core/utils"), ShapeEvent = require("graphic/shapeevent");
  2246. // 内部处理器缓存
  2247. var INNER_HANDLER_CACHE = {}, // 用户处理器缓存
  2248. USER_HANDLER_CACHE = {}, guid = 0;
  2249. // 添加事件统一入口
  2250. function _addEvent(type, handler, isOnce) {
  2251. isOnce = !!isOnce;
  2252. if (Utils.isString(type)) {
  2253. type = type.match(/\S+/g);
  2254. }
  2255. Utils.each(type, function(currentType) {
  2256. listen.call(this, this.node, currentType, handler, isOnce);
  2257. }, this);
  2258. return this;
  2259. }
  2260. // 移除事件统一入口
  2261. function _removeEvent(type, handler) {
  2262. var userHandlerList = null, eventId = this._EVNET_UID, isRemoveAll = handler === undefined;
  2263. try {
  2264. userHandlerList = USER_HANDLER_CACHE[eventId][type];
  2265. } catch (e) {
  2266. return;
  2267. }
  2268. //移除指定的监听器
  2269. if (!isRemoveAll) {
  2270. isRemoveAll = true;
  2271. Utils.each(userHandlerList, function(fn, index) {
  2272. if (fn === handler) {
  2273. // 不能结束, 需要查找完整个list, 避免丢失移除多次绑定同一个处理器的情况
  2274. delete userHandlerList[index];
  2275. } else {
  2276. isRemoveAll = false;
  2277. }
  2278. });
  2279. }
  2280. //删除所有监听器
  2281. if (isRemoveAll) {
  2282. deleteDomEvent(this.node, type, INNER_HANDLER_CACHE[eventId][type]);
  2283. delete USER_HANDLER_CACHE[eventId][type];
  2284. delete INNER_HANDLER_CACHE[eventId][type];
  2285. }
  2286. return this;
  2287. }
  2288. // 执行绑定, 该方法context为shape或者mixin了eventhandler的对象
  2289. function listen(node, type, handler, isOnce) {
  2290. var eid = this._EVNET_UID, targetObject = this;
  2291. // 初始化内部监听器
  2292. if (!INNER_HANDLER_CACHE[eid]) {
  2293. INNER_HANDLER_CACHE[eid] = {};
  2294. }
  2295. if (!INNER_HANDLER_CACHE[eid][type]) {
  2296. // 内部监听器
  2297. INNER_HANDLER_CACHE[eid][type] = function(e) {
  2298. e = new ShapeEvent(e || window.event);
  2299. Utils.each(USER_HANDLER_CACHE[eid][type], function(fn) {
  2300. var result;
  2301. if (fn) {
  2302. result = fn.call(targetObject, e);
  2303. //once 绑定, 执行完后删除
  2304. if (isOnce) {
  2305. targetObject.off(type, fn);
  2306. }
  2307. }
  2308. // 如果用户handler里return了false, 则该节点上的此后的同类型事件将不再执行
  2309. return result;
  2310. }, targetObject);
  2311. };
  2312. }
  2313. // 初始化用户监听器列表
  2314. if (!USER_HANDLER_CACHE[eid]) {
  2315. USER_HANDLER_CACHE[eid] = {};
  2316. }
  2317. if (!USER_HANDLER_CACHE[eid][type]) {
  2318. USER_HANDLER_CACHE[eid][type] = [ handler ];
  2319. // 绑定对应类型的事件
  2320. // dom对象利用dom event进行处理, 非dom对象, 由消息分发机制处理
  2321. if (!!node) {
  2322. bindDomEvent(node, type, INNER_HANDLER_CACHE[eid][type]);
  2323. }
  2324. } else {
  2325. USER_HANDLER_CACHE[eid][type].push(handler);
  2326. }
  2327. }
  2328. // 绑定dom事件
  2329. function bindDomEvent(node, type, handler) {
  2330. if (node.addEventListener) {
  2331. node.addEventListener(type, handler, false);
  2332. } else {
  2333. node.attachEvent("on" + type, handler);
  2334. }
  2335. }
  2336. // 删除dom事件
  2337. function deleteDomEvent(node, type, handler) {
  2338. if (node.removeEventListener) {
  2339. node.removeEventListener(type, handler, false);
  2340. } else {
  2341. node.detachEvent(type, handler);
  2342. }
  2343. }
  2344. // 触发dom事件
  2345. function triggerDomEvent(node, type, params) {
  2346. var event = new CustomEvent(type, {
  2347. bubbles: true,
  2348. cancelable: true
  2349. });
  2350. event.__kity_param = params;
  2351. node.dispatchEvent(event);
  2352. }
  2353. // 发送消息
  2354. function sendMessage(messageObj, type, msg) {
  2355. var event = null, handler = null;
  2356. try {
  2357. handler = INNER_HANDLER_CACHE[messageObj._EVNET_UID][type];
  2358. if (!handler) {
  2359. return;
  2360. }
  2361. } catch (exception) {
  2362. return;
  2363. }
  2364. event = Utils.extend({
  2365. type: type,
  2366. target: messageObj
  2367. }, msg || {});
  2368. handler.call(messageObj, event);
  2369. }
  2370. // 对外接口
  2371. return require("core/class").createClass("EventHandler", {
  2372. constructor: function() {
  2373. this._EVNET_UID = ++guid;
  2374. },
  2375. addEventListener: function(type, handler) {
  2376. return _addEvent.call(this, type, handler, false);
  2377. },
  2378. addOnceEventListener: function(type, handler) {
  2379. return _addEvent.call(this, type, handler, true);
  2380. },
  2381. removeEventListener: function(type, handler) {
  2382. return _removeEvent.call(this, type, handler);
  2383. },
  2384. on: function(type, handler) {
  2385. return this.addEventListener.apply(this, arguments);
  2386. },
  2387. once: function(type, handler) {
  2388. return this.addOnceEventListener.apply(this, arguments);
  2389. },
  2390. off: function() {
  2391. return this.removeEventListener.apply(this, arguments);
  2392. },
  2393. fire: function(type, params) {
  2394. return this.trigger.apply(this, arguments);
  2395. },
  2396. trigger: function(type, params) {
  2397. if (this.node) {
  2398. triggerDomEvent(this.node, type, params);
  2399. } else {
  2400. sendMessage(this, type, params);
  2401. }
  2402. return this;
  2403. }
  2404. });
  2405. });
  2406. define("graphic/gradientbrush", [ "graphic/svg", "graphic/defbrush", "core/class", "graphic/color", "core/utils", "graphic/standardcolor", "core/config" ], function(require, exports, module) {
  2407. var svg = require("graphic/svg");
  2408. var DefBrush = require("graphic/defbrush");
  2409. var Color = require("graphic/color");
  2410. return require("core/class").createClass("GradientBrush", {
  2411. base: DefBrush,
  2412. constructor: function(gradientNodeType) {
  2413. this.callBase(gradientNodeType);
  2414. this.stops = [];
  2415. },
  2416. addStop: function(offset, color, opacity) {
  2417. var gstop = svg.createNode("stop");
  2418. if (!(color instanceof Color)) {
  2419. color = Color.parse(color);
  2420. }
  2421. if (opacity === undefined) {
  2422. opacity = color.get("a");
  2423. }
  2424. gstop.setAttribute("offset", offset);
  2425. gstop.setAttribute("stop-color", color.toRGB());
  2426. if (opacity < 1) {
  2427. gstop.setAttribute("stop-opacity", opacity);
  2428. }
  2429. this.node.appendChild(gstop);
  2430. return this;
  2431. }
  2432. });
  2433. });
  2434. define("graphic/group", [ "graphic/shapecontainer", "graphic/container", "core/utils", "core/class", "graphic/shape", "core/config", "graphic/svg", "graphic/eventhandler", "graphic/styled", "graphic/data", "graphic/matrix", "graphic/pen" ], function(require, exports, module) {
  2435. var ShapeContainer = require("graphic/shapecontainer");
  2436. return require("core/class").createClass("Group", {
  2437. mixins: [ ShapeContainer ],
  2438. base: require("graphic/shape"),
  2439. constructor: function() {
  2440. this.callBase("g");
  2441. }
  2442. });
  2443. });
  2444. define("graphic/image", [ "core/class", "core/config", "graphic/shape", "graphic/svg", "core/utils", "graphic/eventhandler", "graphic/styled", "graphic/data", "graphic/matrix", "graphic/pen" ], function(require, exports, module) {
  2445. return require("core/class").createClass("Image", {
  2446. base: require("graphic/shape"),
  2447. constructor: function(url, width, height, x, y) {
  2448. this.callBase("image");
  2449. this.url = url;
  2450. this.width = width || 0;
  2451. this.height = height || 0;
  2452. this.x = x || 0;
  2453. this.y = y || 0;
  2454. this.update();
  2455. },
  2456. update: function() {
  2457. this.node.setAttributeNS("http://www.w3.org/1999/xlink", "xlink:href", this.url);
  2458. this.node.setAttribute("x", this.x);
  2459. this.node.setAttribute("y", this.y);
  2460. this.node.setAttribute("width", this.width);
  2461. this.node.setAttribute("height", this.height);
  2462. return this;
  2463. },
  2464. setUrl: function(url) {
  2465. this.url = url === "" ? null : url;
  2466. return this.update();
  2467. },
  2468. getUrl: function() {
  2469. return this.url;
  2470. },
  2471. setWidth: function(width) {
  2472. this.width = width;
  2473. return this.update();
  2474. },
  2475. getWidth: function() {
  2476. return this.width;
  2477. },
  2478. setHeight: function(height) {
  2479. this.height = height;
  2480. return this.update();
  2481. },
  2482. getHeight: function() {
  2483. return this.height;
  2484. },
  2485. setX: function(x) {
  2486. this.x = x;
  2487. return this.update();
  2488. },
  2489. getX: function() {
  2490. return this.x;
  2491. },
  2492. setY: function(y) {
  2493. this.y = y;
  2494. return this.update();
  2495. },
  2496. getY: function() {
  2497. return this.y;
  2498. }
  2499. });
  2500. });
  2501. define("graphic/line", [ "core/class", "core/config", "graphic/path", "core/utils", "graphic/shape", "graphic/svg" ], function(require, exports, module) {
  2502. return require("core/class").createClass("Line", {
  2503. base: require("graphic/path"),
  2504. constructor: function(x1, y1, x2, y2) {
  2505. this.callBase();
  2506. this.point1 = {
  2507. x: x1 || 0,
  2508. y: y1 || 0
  2509. };
  2510. this.point2 = {
  2511. x: x2 || 0,
  2512. y: y2 || 0
  2513. };
  2514. this.update();
  2515. },
  2516. setPoint1: function(x, y) {
  2517. this.point1.x = x;
  2518. this.point1.y = y;
  2519. return this.update();
  2520. },
  2521. setPoint2: function(x, y) {
  2522. this.point2.x = x;
  2523. this.point2.y = y;
  2524. return this.update();
  2525. },
  2526. getPoint1: function() {
  2527. return {
  2528. x: this.point1.x,
  2529. y: this.point1.y
  2530. };
  2531. },
  2532. getPoint2: function() {
  2533. return {
  2534. x: this.point2.x,
  2535. y: this.point2.y
  2536. };
  2537. },
  2538. update: function() {
  2539. var drawer = this.getDrawer();
  2540. drawer.clear();
  2541. drawer.moveTo(this.point1.x, this.point1.y);
  2542. drawer.lineTo(this.point2.x, this.point2.y);
  2543. return this;
  2544. }
  2545. });
  2546. });
  2547. define("graphic/lineargradientbrush", [ "graphic/svg", "graphic/gradientbrush", "graphic/defbrush", "graphic/color", "core/class", "core/config" ], function(require, exports, module) {
  2548. var className = "LinearGradientBrush";
  2549. var svg = require("graphic/svg");
  2550. var GradientBrush = require("graphic/gradientbrush");
  2551. return require("core/class").createClass(className, {
  2552. base: GradientBrush,
  2553. constructor: function(builder) {
  2554. this.callBase("linearGradient");
  2555. this.setStartPosition(0, 0);
  2556. this.setEndPosition(1, 0);
  2557. if (typeof builder == "function") {
  2558. builder.call(this, this);
  2559. }
  2560. },
  2561. setStartPosition: function(px, py) {
  2562. this.node.setAttribute("x1", px);
  2563. this.node.setAttribute("y1", py);
  2564. return this;
  2565. },
  2566. setEndPosition: function(px, py) {
  2567. this.node.setAttribute("x2", px);
  2568. this.node.setAttribute("y2", py);
  2569. return this;
  2570. },
  2571. getStartPosition: function() {
  2572. return {
  2573. x: +this.node.getAttribute("x1"),
  2574. y: +this.node.getAttribute("y1")
  2575. };
  2576. },
  2577. getEndPosition: function() {
  2578. return {
  2579. x: +this.node.getAttribute("x2"),
  2580. y: +this.node.getAttribute("y2")
  2581. };
  2582. }
  2583. });
  2584. });
  2585. /**
  2586. * 蒙板
  2587. */
  2588. define("graphic/mask", [ "core/class", "core/config", "graphic/shape", "graphic/svg", "core/utils", "graphic/eventhandler", "graphic/styled", "graphic/data", "graphic/matrix", "graphic/pen", "graphic/shapecontainer", "graphic/container" ], function(require, exports, module) {
  2589. var Class = require("core/class");
  2590. var Shape = require("graphic/shape");
  2591. var Mask = Class.createClass("Mask", {
  2592. base: Shape,
  2593. mixins: [ require("graphic/shapecontainer") ],
  2594. constructor: function() {
  2595. this.callBase("mask");
  2596. },
  2597. mask: function(shape) {
  2598. shape.getNode().setAttribute("mask", "url(#" + this.getId() + ")");
  2599. return this;
  2600. }
  2601. });
  2602. Class.extendClass(Shape, {
  2603. maskWith: function(mask) {
  2604. mask.mask(this);
  2605. return this;
  2606. }
  2607. });
  2608. return Mask;
  2609. });
  2610. define("graphic/matrix", [ "core/utils", "graphic/vector", "core/class", "core/config" ], function(require, exports, module) {
  2611. var utils = require("core/utils");
  2612. var mPattern = /matrix\((.+)\)/i;
  2613. var Vector = require("graphic/vector");
  2614. // 注意,合并的结果是先执行m2,再执行m1的结果
  2615. function mergeMatrixData(m2, m1) {
  2616. return {
  2617. a: m1.a * m2.a + m1.c * m2.b,
  2618. b: m1.b * m2.a + m1.d * m2.b,
  2619. c: m1.a * m2.c + m1.c * m2.d,
  2620. d: m1.b * m2.c + m1.d * m2.d,
  2621. e: m1.a * m2.e + m1.c * m2.f + m1.e,
  2622. f: m1.b * m2.e + m1.d * m2.f + m1.f
  2623. };
  2624. }
  2625. function d2r(deg) {
  2626. return deg * Math.PI / 180;
  2627. }
  2628. var Matrix = require("core/class").createClass("Matrix", {
  2629. constructor: function() {
  2630. if (arguments.length) {
  2631. this.setMatrix.apply(this, arguments);
  2632. } else {
  2633. this.setMatrix(1, 0, 0, 1, 0, 0);
  2634. }
  2635. },
  2636. translate: function(x, y) {
  2637. this.m = mergeMatrixData(this.m, {
  2638. a: 1,
  2639. c: 0,
  2640. e: x,
  2641. b: 0,
  2642. d: 1,
  2643. f: y
  2644. });
  2645. return this;
  2646. },
  2647. rotate: function(deg) {
  2648. var rad = d2r(deg);
  2649. var sin = Math.sin(rad), cos = Math.cos(rad);
  2650. this.m = mergeMatrixData(this.m, {
  2651. a: cos,
  2652. c: -sin,
  2653. e: 0,
  2654. b: sin,
  2655. d: cos,
  2656. f: 0
  2657. });
  2658. return this;
  2659. },
  2660. scale: function(sx, sy) {
  2661. if (sy === undefined) {
  2662. sy = sx;
  2663. }
  2664. this.m = mergeMatrixData(this.m, {
  2665. a: sx,
  2666. c: 0,
  2667. e: 0,
  2668. b: 0,
  2669. d: sy,
  2670. f: 0
  2671. });
  2672. return this;
  2673. },
  2674. skew: function(degX, degY) {
  2675. if (degY === undefined) {
  2676. degY = degX;
  2677. }
  2678. var tx = Math.tan(d2r(degX)), ty = Math.tan(d2r(degY));
  2679. this.m = mergeMatrixData(this.m, {
  2680. a: 1,
  2681. c: tx,
  2682. e: 0,
  2683. b: ty,
  2684. d: 1,
  2685. f: 0
  2686. });
  2687. return this;
  2688. },
  2689. setMatrix: function(a, b, c, d, e, f) {
  2690. if (arguments.length === 1) {
  2691. this.m = utils.clone(arguments[0]);
  2692. } else {
  2693. this.m = {
  2694. a: a,
  2695. b: b,
  2696. c: c,
  2697. d: d,
  2698. e: e,
  2699. f: f
  2700. };
  2701. }
  2702. return this;
  2703. },
  2704. getMatrix: function() {
  2705. return utils.clone(this.m);
  2706. },
  2707. getTranslate: function() {
  2708. var m = this.m;
  2709. return {
  2710. x: m.e / m.a,
  2711. y: m.f / m.d
  2712. };
  2713. },
  2714. mergeMatrix: function(matrix) {
  2715. return new Matrix(mergeMatrixData(this.m, matrix.m));
  2716. },
  2717. merge: function(matrix) {
  2718. return this.mergeMatrix(matrix);
  2719. },
  2720. toString: function() {
  2721. var m = this.m;
  2722. return "matrix(" + [ m.a, m.b, m.c, m.d, m.e, m.f ].join(", ") + ")";
  2723. },
  2724. transformPoint: function(x, y) {
  2725. return Matrix.transformPoint(x, y, this.m);
  2726. },
  2727. transformBox: function(box) {
  2728. return Matrix.transformBox(box, this.m);
  2729. }
  2730. });
  2731. Matrix.parse = function(str) {
  2732. var match;
  2733. var f = parseFloat;
  2734. if (match = mPattern.exec(str)) {
  2735. var values = match[1].split(",");
  2736. if (values.length != 6) {
  2737. values = match[1].split(" ");
  2738. }
  2739. return new Matrix({
  2740. a: f(values[0]),
  2741. b: f(values[1]),
  2742. c: f(values[2]),
  2743. d: f(values[3]),
  2744. e: f(values[4]),
  2745. f: f(values[5])
  2746. });
  2747. }
  2748. return new Matrix();
  2749. };
  2750. Matrix.transformPoint = function(x, y, m) {
  2751. return new Vector(m.a * x + m.c * y + m.e, m.b * x + m.d * y + m.f);
  2752. };
  2753. Matrix.transformBox = function(box, matrix) {
  2754. var xMin = Number.MAX_VALUE, xMax = -Number.MAX_VALUE, yMin = Number.MAX_VALUE, yMax = -Number.MAX_VALUE;
  2755. var bps = [ [ box.x, box.y ], [ box.x + box.width, box.y ], [ box.x, box.y + box.height ], [ box.x + box.width, box.y + box.height ] ];
  2756. var bp, rp, rps = [];
  2757. while (bp = bps.pop()) {
  2758. rp = Matrix.transformPoint(bp[0], bp[1], matrix);
  2759. rps.push(rp);
  2760. xMin = Math.min(xMin, rp.x);
  2761. xMax = Math.max(xMax, rp.x);
  2762. yMin = Math.min(yMin, rp.y);
  2763. yMax = Math.max(yMax, rp.y);
  2764. }
  2765. return {
  2766. x: xMin,
  2767. y: yMin,
  2768. width: xMax - xMin,
  2769. height: yMax - yMin,
  2770. closurePoints: rps,
  2771. left: xMin,
  2772. right: xMax,
  2773. top: yMin,
  2774. bottom: yMax
  2775. };
  2776. };
  2777. return Matrix;
  2778. });
  2779. /**
  2780. * 调色板
  2781. */
  2782. define("graphic/palette", [ "graphic/standardcolor", "graphic/color", "core/utils", "core/class", "core/config" ], function(require, exports, module) {
  2783. //标准color
  2784. var StandardColor = require("graphic/standardcolor"), Color = require("graphic/color"), Utils = require("core/utils");
  2785. var Palette = require("core/class").createClass("Palette", {
  2786. constructor: function() {
  2787. this.color = {};
  2788. },
  2789. /*
  2790. * 获取颜色名称所对应的颜色值的Color对象
  2791. * @param name 需要获取的颜色名称
  2792. * @return 对应颜色名称的color对象, 如果未找到对应的名称, 则返回null
  2793. */
  2794. get: function(name) {
  2795. var colorValue = this.color[name] || StandardColor.EXTEND_STANDARD[name] || StandardColor.COLOR_STANDARD[name] || "";
  2796. if (colorValue) {
  2797. return new Color(colorValue);
  2798. }
  2799. return null;
  2800. },
  2801. /*
  2802. * 获取给定名称的颜色的hex值表示
  2803. * @param name 需要获取的颜色名称
  2804. * @return 如果找到对应的名称, 则返回该名称所对应的hex格式的值, 否则, 返回一个空字符串
  2805. */
  2806. getColorValue: function(name) {
  2807. return this.color[name] || StandardColor.EXTEND_STANDARD[name] || StandardColor.COLOR_STANDARD[name] || "";
  2808. },
  2809. /*
  2810. * 向调色板实例添加自己独有的颜色名称,对已存在的颜色名称, 将会覆盖掉
  2811. * @param name 新添加的颜色名称
  2812. * @param value 新添加的颜色名称所对应的值, 可以是一个合法的颜色字符串或者是一个color对象
  2813. * @return 新添加的颜色的值
  2814. */
  2815. add: function(name, value) {
  2816. if (typeof value === "string") {
  2817. this.color[name] = new Color(value).toRGBA();
  2818. } else {
  2819. this.color[name] = value.toRGBA();
  2820. }
  2821. return value;
  2822. },
  2823. /*
  2824. * 删除调色板实例上用户自己添加的颜色, 该方法不能删除内置的颜色
  2825. * @param name 需要删除的颜色名称
  2826. * @return 删除是否成功的bool值
  2827. */
  2828. remove: function(name) {
  2829. if (this.color.hasOwnProperty(name)) {
  2830. delete this.color[name];
  2831. return true;
  2832. }
  2833. return false;
  2834. }
  2835. });
  2836. Utils.extend(Palette, {
  2837. getColor: function(name) {
  2838. var colorValue = StandardColor.EXTEND_STANDARD[name] || StandardColor.COLOR_STANDARD[name];
  2839. if (colorValue) {
  2840. return new Color(colorValue);
  2841. }
  2842. return null;
  2843. },
  2844. /*
  2845. * 通过给定的名字获取标准的颜色值表示, 返回的值以hex的方式提供
  2846. * @param name 需要获取的标准颜色名称
  2847. * @return 名字所对应的颜色值的hex表示, 如果未找到对应名称的值, 则返回一个空字符串
  2848. */
  2849. getColorValue: function(name) {
  2850. return StandardColor.EXTEND_STANDARD[name] || StandardColor.COLOR_STANDARD[name] || "";
  2851. },
  2852. /*
  2853. * 向调色板添加颜色名称,新添加的颜色对所有的调色板对象都可见
  2854. * 对已存在的颜色名称, 将会覆盖掉
  2855. * @param name 新添加的颜色名称
  2856. * @param value 新添加的颜色名称所对于的值, 应该是一个hex格式的颜色字符串, 如: ”#ff0000“
  2857. * @return 新添加的颜色的值
  2858. */
  2859. addColor: function(name, value) {
  2860. if (typeof value === "string") {
  2861. StandardColor.EXTEND_STANDARD[name] = new Color(value).toRGBA();
  2862. } else {
  2863. StandardColor.EXTEND_STANDARD[name] = value.toRGBA();
  2864. }
  2865. return value;
  2866. },
  2867. /*
  2868. * 删除用户自己添加的颜色, 该方法不能删除内置的颜色, 该方法不会影响调色板实例自由的颜色
  2869. * @param name 需要删除的颜色名称
  2870. * @return 删除是否成功的bool值
  2871. */
  2872. removeColor: function(name) {
  2873. if (StandardColor.EXTEND_STANDARD.hasOwnProperty(name)) {
  2874. delete StandardColor.EXTEND_STANDARD[name];
  2875. return true;
  2876. }
  2877. return false;
  2878. }
  2879. });
  2880. return Palette;
  2881. });
  2882. define("graphic/paper", [ "core/class", "core/config", "core/utils", "graphic/svg", "graphic/container", "graphic/shapecontainer", "graphic/shape", "graphic/viewbox", "graphic/eventhandler", "graphic/shapeevent", "graphic/styled", "graphic/matrix", "graphic/vector", "graphic/data", "graphic/pen" ], function(require, exports, module) {
  2883. var Class = require("core/class");
  2884. var utils = require("core/utils");
  2885. var svg = require("graphic/svg");
  2886. var Container = require("graphic/container");
  2887. var ShapeContainer = require("graphic/shapecontainer");
  2888. var ViewBox = require("graphic/viewbox");
  2889. var EventHandler = require("graphic/eventhandler");
  2890. var Styled = require("graphic/styled");
  2891. var Matrix = require("graphic/matrix");
  2892. var Paper = Class.createClass("Paper", {
  2893. mixins: [ ShapeContainer, EventHandler, Styled, ViewBox ],
  2894. constructor: function(container) {
  2895. this.callBase();
  2896. this.node = this.createSVGNode();
  2897. this.node.paper = this;
  2898. this.node.appendChild(this.resourceNode = svg.createNode("defs"));
  2899. this.node.appendChild(this.shapeNode = svg.createNode("g"));
  2900. this.resources = new Container();
  2901. this.setWidth("100%").setHeight("100%");
  2902. if (container) {
  2903. this.renderTo(container);
  2904. }
  2905. this.callMixin();
  2906. },
  2907. renderTo: function(container) {
  2908. if (utils.isString(container)) {
  2909. container = document.getElementById(container);
  2910. }
  2911. this.container = container;
  2912. container.appendChild(this.node);
  2913. },
  2914. createSVGNode: function() {
  2915. var node = svg.createNode("svg");
  2916. node.setAttribute("xmlns", "http://www.w3.org/2000/svg");
  2917. node.setAttribute("xmlns:xlink", "http://www.w3.org/1999/xlink");
  2918. return node;
  2919. },
  2920. getNode: function() {
  2921. return this.node;
  2922. },
  2923. getContainer: function() {
  2924. return this.container;
  2925. },
  2926. getWidth: function() {
  2927. return +this.node.getAttribute("width");
  2928. },
  2929. setWidth: function(width) {
  2930. this.node.setAttribute("width", width);
  2931. return this;
  2932. },
  2933. getHeight: function() {
  2934. return +this.node.getAttribute("height");
  2935. },
  2936. setHeight: function(height) {
  2937. this.node.setAttribute("height", height);
  2938. return this;
  2939. },
  2940. setViewPort: function(cx, cy, zoom) {
  2941. var viewport, box;
  2942. if (arguments.length == 1) {
  2943. viewport = arguments[0];
  2944. cx = viewport.center.x;
  2945. cy = viewport.center.y;
  2946. zoom = viewport.zoom;
  2947. }
  2948. zoom = zoom || 1;
  2949. box = this.getViewBox();
  2950. var matrix = new Matrix();
  2951. var dx = box.x + box.width / 2 - cx, dy = box.y + box.height / 2 - cy;
  2952. matrix.translate(-cx, -cy);
  2953. matrix.scale(zoom);
  2954. matrix.translate(cx, cy);
  2955. matrix.translate(dx, dy)
  2956. this.shapeNode.setAttribute("transform", matrix);
  2957. this.viewport = {
  2958. center: {
  2959. x: cx,
  2960. y: cy
  2961. },
  2962. offset: {
  2963. x: dx,
  2964. y: dy
  2965. },
  2966. zoom: zoom
  2967. };
  2968. return this;
  2969. },
  2970. getViewPort: function() {
  2971. if (!this.viewport) {
  2972. var box = this.getViewBox();
  2973. this.viewport = {
  2974. zoom: 1,
  2975. center: {
  2976. x: box.x + box.width / 2,
  2977. y: box.y + box.height / 2
  2978. },
  2979. offset: {
  2980. x: 0,
  2981. y: 0
  2982. }
  2983. };
  2984. }
  2985. return this.viewport;
  2986. },
  2987. addResource: function(resource) {
  2988. this.resources.appendItem(resource);
  2989. if (resource.node) {
  2990. this.resourceNode.appendChild(resource.node);
  2991. }
  2992. return this;
  2993. },
  2994. removeResource: function(resource) {
  2995. if (resource.remove) {
  2996. resource.remove();
  2997. }
  2998. if (resource.node) {
  2999. this.resourceNode.removeChild(resource.node);
  3000. }
  3001. return this;
  3002. },
  3003. getPaper: function() {
  3004. return this;
  3005. }
  3006. });
  3007. var Shape = require("graphic/shape");
  3008. Class.extendClass(Shape, {
  3009. getPaper: function() {
  3010. var parent = this.container;
  3011. while (parent && parent instanceof Paper === false) {
  3012. parent = parent.container;
  3013. }
  3014. return parent;
  3015. }
  3016. });
  3017. return Paper;
  3018. });
  3019. define("graphic/path", [ "core/utils", "core/class", "core/config", "graphic/shape", "graphic/svg", "graphic/eventhandler", "graphic/styled", "graphic/data", "graphic/matrix", "graphic/pen" ], function(require, exports, module) {
  3020. var Utils = require("core/utils");
  3021. var createClass = require("core/class").createClass;
  3022. var Shape = require("graphic/shape");
  3023. var svg = require("graphic/svg");
  3024. var config = require("core/config");
  3025. var PathDrawer = createClass("PathDrawer", {
  3026. constructor: function(path) {
  3027. this.path = path;
  3028. this.__clear = false;
  3029. },
  3030. appendData: function(data) {
  3031. var originData = this.path.getPathData();
  3032. if (this.__clear) {
  3033. originData = "";
  3034. this.__clear = false;
  3035. }
  3036. if (originData) {
  3037. this.path.setPathData(originData + " " + data.join(" "));
  3038. } else {
  3039. this.path.setPathData(data.join(" "));
  3040. }
  3041. return this;
  3042. },
  3043. moveTo: function(x, y) {
  3044. return this.appendData([ "M", x, y ]);
  3045. },
  3046. moveBy: function(dx, dy) {
  3047. return this.appendData([ "m", dx, dy ]);
  3048. },
  3049. lineTo: function(x, y) {
  3050. return this.appendData([ "L", x, y ]);
  3051. },
  3052. lineBy: function(dx, dy) {
  3053. return this.appendData([ "l", dx, dy ]);
  3054. },
  3055. arcTo: function(rx, ry, xr, laf, sf, x, y) {
  3056. return this.appendData([ "A", rx, ry, xr, laf, sf, x, y ]);
  3057. },
  3058. arcBy: function(rx, ry, xr, laf, sf, dx, dy) {
  3059. return this.appendData([ "a", rx, ry, xr, laf, sf, dx, dy ]);
  3060. },
  3061. carcTo: function(r, x, y, laf, sf) {
  3062. return this.arcTo(r, r, 0, laf || 0, sf || 0, x, y);
  3063. },
  3064. carcBy: function(r, dx, dy, laf, sf) {
  3065. return this.arcBy(r, r, 0, laf || 0, sf || 0, dx, dy);
  3066. },
  3067. bezierTo: function(x1, y1, x2, y2, x, y) {
  3068. return this.appendData([ "C", x1, y1, x2, y2, x, y ]);
  3069. },
  3070. bezierBy: function(dx1, dy1, dx2, dy2, dx, dy) {
  3071. return this.appendData([ "c", dx1, dy1, dx2, dy2, dx, dy ]);
  3072. },
  3073. close: function() {
  3074. return this.appendData([ "z" ]);
  3075. },
  3076. clear: function() {
  3077. this.__clear = true;
  3078. this.path.setPathData("M 0 0");
  3079. return this;
  3080. }
  3081. });
  3082. function flatten(arr) {
  3083. var result = [], length = arr.length;
  3084. for (var i = 0; i < length; i++) {
  3085. if (arr[i] instanceof Array) {
  3086. result = result.concat(flatten(arr[i]));
  3087. } else {
  3088. result.push(arr[i]);
  3089. }
  3090. }
  3091. return result;
  3092. }
  3093. return createClass("Path", {
  3094. base: Shape,
  3095. constructor: function(data) {
  3096. this.callBase("path");
  3097. if (data) {
  3098. this.setPathData(data);
  3099. }
  3100. this.node.setAttribute("fill", svg.defaults.fill);
  3101. this.node.setAttribute("stroke", svg.defaults.stroke);
  3102. },
  3103. setPathData: function(data) {
  3104. if (!data) {
  3105. return;
  3106. }
  3107. // add support for path segment
  3108. if (data instanceof Array) {
  3109. data = flatten(data).join(" ");
  3110. }
  3111. this.pathdata = data;
  3112. var path = this;
  3113. if (config.debug) {
  3114. path.node.setAttribute("d", data);
  3115. this.trigger("shapeupdate", {
  3116. type: "pathdata"
  3117. });
  3118. } else {
  3119. // lazy dump data attribute
  3120. clearTimeout(this.lazyDumpId);
  3121. this.lazyDumpId = setTimeout(function() {
  3122. path.node.setAttribute("d", data);
  3123. this.trigger("shapeupdate", {
  3124. type: "pathdata"
  3125. });
  3126. });
  3127. }
  3128. return this;
  3129. },
  3130. getPathData: function() {
  3131. return this.pathdata || "";
  3132. },
  3133. getDrawer: function() {
  3134. return new PathDrawer(this);
  3135. },
  3136. isClosed: function() {
  3137. var data = this.getPathData();
  3138. return !!~data.indexOf("z") || !!~data.indexOf("Z");
  3139. }
  3140. });
  3141. });
  3142. define("graphic/patternbrush", [ "graphic/defbrush", "graphic/svg", "core/class", "graphic/shapecontainer", "graphic/container", "core/utils", "graphic/shape", "core/config" ], function(require, exports, module) {
  3143. var DefBrush = require("graphic/defbrush");
  3144. var ShapeContainer = require("graphic/shapecontainer");
  3145. var svg = require("graphic/svg");
  3146. return require("core/class").createClass("PatternBrush", {
  3147. base: DefBrush,
  3148. mixins: [ ShapeContainer ],
  3149. constructor: function() {
  3150. this.callBase("pattern");
  3151. this.node.setAttribute("patternUnits", "userSpaceOnUse");
  3152. },
  3153. setX: function(x) {
  3154. this.x = x;
  3155. this.node.setAttribute("x", x);
  3156. return this;
  3157. },
  3158. setY: function(y) {
  3159. this.y = y;
  3160. this.node.setAttribute("y", y);
  3161. return this;
  3162. },
  3163. setWidth: function(width) {
  3164. this.width = width;
  3165. this.node.setAttribute("width", width);
  3166. return this;
  3167. },
  3168. setHeight: function(height) {
  3169. this.height = height;
  3170. this.node.setAttribute("height", height);
  3171. return this;
  3172. },
  3173. getWidth: function() {
  3174. return this.width;
  3175. },
  3176. getHeight: function() {
  3177. return this.height;
  3178. }
  3179. });
  3180. });
  3181. define("graphic/pen", [ "graphic/color", "core/utils", "graphic/standardcolor", "core/class", "core/config" ], function(require, exports, module) {
  3182. var Color = require("graphic/color");
  3183. return require("core/class").createClass("Pen", {
  3184. constructor: function(color, width) {
  3185. this.color = color instanceof Color ? color : new Color(color);
  3186. this.width = width || 1;
  3187. this.linecap = null;
  3188. this.linejoin = null;
  3189. this.dashArray = null;
  3190. this.opacity = this.color.get("a");
  3191. },
  3192. getColor: function() {
  3193. return this.color;
  3194. },
  3195. setColor: function(color) {
  3196. if (typeof color == "string") {
  3197. color = new Color(color);
  3198. }
  3199. this.color = color;
  3200. this.opacity = this.color.get("a");
  3201. return this;
  3202. },
  3203. getWidth: function() {
  3204. return this.width;
  3205. },
  3206. setWidth: function(width) {
  3207. this.width = width;
  3208. return this;
  3209. },
  3210. getOpacity: function() {
  3211. return this.opacity;
  3212. },
  3213. setOpacity: function(opacity) {
  3214. this.opacity = opacity;
  3215. },
  3216. getLineCap: function() {
  3217. return this.linecap;
  3218. },
  3219. setLineCap: function(linecap) {
  3220. this.linecap = linecap;
  3221. return this;
  3222. },
  3223. getLineJoin: function() {
  3224. return this.linejoin;
  3225. },
  3226. setLineJoin: function(linejoin) {
  3227. this.linejoin = linejoin;
  3228. return this;
  3229. },
  3230. getDashArray: function() {
  3231. return this.dashArray;
  3232. },
  3233. setDashArray: function(dashArray) {
  3234. this.dashArray = dashArray;
  3235. return this;
  3236. },
  3237. stroke: function(shape) {
  3238. var node = shape.node;
  3239. node.setAttribute("stroke", this.getColor().toString());
  3240. node.setAttribute("stroke-width", this.getWidth());
  3241. if (this.getOpacity() < 1) {
  3242. node.setAttribute("stroke-opacity", this.getOpacity());
  3243. }
  3244. if (this.getLineCap()) {
  3245. node.setAttribute("stroke-linecap", this.getLineCap());
  3246. }
  3247. if (this.getLineJoin()) {
  3248. node.setAttribute("stroke-linejoin", this.getLineJoin());
  3249. }
  3250. if (this.getDashArray()) {
  3251. node.setAttribute("stroke-dasharray", this.getDashArray());
  3252. }
  3253. }
  3254. });
  3255. });
  3256. /*
  3257. * 点对象抽象
  3258. */
  3259. define("graphic/point", [ "core/class", "core/config" ], function(require, exports, module) {
  3260. return require("core/class").createClass("Point", {
  3261. constructor: function(x, y) {
  3262. this.px = x || 0;
  3263. this.py = y || 0;
  3264. },
  3265. setPoint: function(x, y) {
  3266. this.px = x;
  3267. this.py = y;
  3268. return this;
  3269. },
  3270. getPoint: function() {
  3271. return {
  3272. x: this.px,
  3273. y: this.py
  3274. };
  3275. },
  3276. setX: function(x) {
  3277. this.px = x;
  3278. return this;
  3279. },
  3280. getX: function() {
  3281. return this.px;
  3282. },
  3283. setY: function(y) {
  3284. this.py = y;
  3285. return this;
  3286. },
  3287. getY: function() {
  3288. return this.py;
  3289. }
  3290. });
  3291. });
  3292. /**
  3293. * 点集合容器
  3294. */
  3295. define("graphic/pointcontainer", [ "core/class", "core/config", "graphic/container" ], function(require, exports, module) {
  3296. return require("core/class").createClass("PointContainer", {
  3297. base: require("graphic/container"),
  3298. constructor: function() {
  3299. this.callBase();
  3300. },
  3301. addPoint: function(point, pos) {
  3302. return this.addItem.apply(this, arguments);
  3303. },
  3304. prependPoint: function() {
  3305. return this.prependItem.apply(this, arguments);
  3306. },
  3307. appendPoint: function() {
  3308. return this.appendItem.apply(this, arguments);
  3309. },
  3310. removePoint: function(pos) {
  3311. return this.removeItem.apply(this, arguments);
  3312. },
  3313. addPoints: function() {
  3314. return this.addItems.apply(this, arguments);
  3315. },
  3316. setPoints: function() {
  3317. return this.setItems.apply(this, arguments);
  3318. },
  3319. getPoint: function() {
  3320. return this.getItem.apply(this, arguments);
  3321. },
  3322. getPoints: function() {
  3323. return this.getItems.apply(this, arguments);
  3324. },
  3325. getFirstPoint: function() {
  3326. return this.getFirstItem.apply(this, arguments);
  3327. },
  3328. getLastPoint: function() {
  3329. return this.getLastItem.apply(this, arguments);
  3330. }
  3331. });
  3332. });
  3333. /*
  3334. * 通过点来决定图形的公共父类
  3335. */
  3336. define("graphic/poly", [ "core/utils", "core/class", "core/config", "graphic/path", "graphic/shape", "graphic/svg", "graphic/pointcontainer", "graphic/container" ], function(require, exports, module) {
  3337. var Utils = require("core/utils");
  3338. return require("core/class").createClass("Poly", {
  3339. base: require("graphic/path"),
  3340. mixins: [ require("graphic/pointcontainer") ],
  3341. constructor: function(points, closeable) {
  3342. this.callBase();
  3343. //是否可闭合
  3344. this.closeable = !!closeable;
  3345. this.setPoints(points || []);
  3346. this.changeable = true;
  3347. this.update();
  3348. },
  3349. //当点集合发生变化时采取的动作
  3350. onContainerChanged: function() {
  3351. if (this.changeable) {
  3352. this.update();
  3353. }
  3354. },
  3355. update: function() {
  3356. var drawer = this.getDrawer(), points = this.getPoints();
  3357. drawer.clear();
  3358. if (!points.length) {
  3359. return this;
  3360. }
  3361. drawer.moveTo(points[0].getX(), points[0].getY());
  3362. for (var i = 1, point, len = points.length; i < len; i++) {
  3363. point = points[i];
  3364. drawer.lineTo(point.getX(), point.getY());
  3365. }
  3366. if (this.closeable && points.length > 2) {
  3367. drawer.close();
  3368. }
  3369. return this;
  3370. }
  3371. });
  3372. });
  3373. define("graphic/polygon", [ "core/class", "core/config", "graphic/poly", "core/utils", "graphic/path", "graphic/pointcontainer" ], function(require, exports, module) {
  3374. return require("core/class").createClass("Polygon", {
  3375. base: require("graphic/poly"),
  3376. constructor: function(points) {
  3377. this.callBase(points, true);
  3378. }
  3379. });
  3380. });
  3381. define("graphic/polyline", [ "core/class", "core/config", "graphic/poly", "core/utils", "graphic/path", "graphic/pointcontainer" ], function(require, exports, module) {
  3382. return require("core/class").createClass("Polyline", {
  3383. base: require("graphic/poly"),
  3384. constructor: function(points) {
  3385. this.callBase(points);
  3386. }
  3387. });
  3388. });
  3389. define("graphic/radialgradientbrush", [ "graphic/gradientbrush", "graphic/svg", "graphic/defbrush", "graphic/color", "core/class", "core/config" ], function(require, exports, module) {
  3390. var GradientBrush = require("graphic/gradientbrush");
  3391. return require("core/class").createClass("RadialGradientBrush", {
  3392. base: GradientBrush,
  3393. constructor: function(builder) {
  3394. this.callBase("radialGradient");
  3395. this.setCenter(.5, .5);
  3396. this.setFocal(.5, .5);
  3397. this.setRadius(.5);
  3398. if (typeof builder == "function") {
  3399. builder.call(this, this);
  3400. }
  3401. },
  3402. setCenter: function(cx, cy) {
  3403. this.node.setAttribute("cx", cx);
  3404. this.node.setAttribute("cy", cy);
  3405. return this;
  3406. },
  3407. getCenter: function() {
  3408. return {
  3409. x: +this.node.getAttribute("cx"),
  3410. y: +this.node.getAttribute("cy")
  3411. };
  3412. },
  3413. setFocal: function(fx, fy) {
  3414. this.node.setAttribute("fx", fx);
  3415. this.node.setAttribute("fy", fy);
  3416. return this;
  3417. },
  3418. getFocal: function() {
  3419. return {
  3420. x: +this.node.getAttribute("fx"),
  3421. y: +this.node.getAttribute("fy")
  3422. };
  3423. },
  3424. setRadius: function(r) {
  3425. this.node.setAttribute("r", r);
  3426. return this;
  3427. },
  3428. getRadius: function() {
  3429. return +this.node.getAttribute("r");
  3430. }
  3431. });
  3432. });
  3433. define("graphic/rect", [ "core/utils", "core/class", "core/config", "graphic/path", "graphic/shape", "graphic/svg" ], function(require, exports, module) {
  3434. var RectUtils = {}, Utils = require("core/utils");
  3435. Utils.extend(RectUtils, {
  3436. //根据传递进来的width、height和radius属性,
  3437. //获取最适合的radius值
  3438. formatRadius: function(width, height, radius) {
  3439. var minValue = Math.floor(Math.min(width / 2, height / 2));
  3440. return Math.min(minValue, radius);
  3441. },
  3442. getPathData: function(x, y, width, height, radius) {
  3443. var pathData = null;
  3444. //直角
  3445. if (radius === 0) {
  3446. pathData = [ "M " + x + "," + y, " h " + width, " v " + height, " h " + -width, " Z" ];
  3447. } else {
  3448. width -= 2 * radius;
  3449. height -= 2 * radius;
  3450. pathData = [ "M " + (x + radius) + "," + y, " h " + width, " a " + radius + " " + radius + " 0 0 1 " + radius + " " + radius, " v " + height, " a " + radius + " " + radius + " 0 0 1 " + -radius + " " + radius, " h " + -width, " a " + radius + " " + radius + " 0 0 1 " + -radius + " " + -radius, " v " + -height, " a " + radius + " " + radius + " 0 0 1 " + radius + " " + -radius, " Z" ];
  3451. }
  3452. return pathData.join("");
  3453. }
  3454. });
  3455. return require("core/class").createClass("Rect", {
  3456. base: require("graphic/path"),
  3457. constructor: function(width, height, x, y, radius) {
  3458. this.callBase();
  3459. this.x = x || 0;
  3460. this.y = y || 0;
  3461. this.width = width || 0;
  3462. this.height = height || 0;
  3463. this.radius = RectUtils.formatRadius(this.width, this.height, radius || 0);
  3464. this.update();
  3465. },
  3466. update: function() {
  3467. var pathData = RectUtils.getPathData(this.x, this.y, this.width, this.height, this.radius);
  3468. this.setPathData(pathData);
  3469. return this;
  3470. },
  3471. setWidth: function(width) {
  3472. this.width = width;
  3473. return this.update();
  3474. },
  3475. setHeight: function(height) {
  3476. this.height = height;
  3477. return this.update();
  3478. },
  3479. setSize: function(width, height) {
  3480. this.width = width;
  3481. this.height = height;
  3482. return this.update();
  3483. },
  3484. getRadius: function() {
  3485. return this.radius;
  3486. },
  3487. setRadius: function(radius) {
  3488. this.radius = radius;
  3489. return this.update();
  3490. },
  3491. getPosition: function() {
  3492. return {
  3493. x: this.x,
  3494. y: this.y
  3495. };
  3496. },
  3497. setPosition: function(x, y) {
  3498. this.x = x;
  3499. this.y = y;
  3500. return this.update();
  3501. },
  3502. getWidth: function() {
  3503. return this.width;
  3504. },
  3505. getHeight: function() {
  3506. return this.height;
  3507. },
  3508. getPositionX: function() {
  3509. return this.x;
  3510. },
  3511. getPositionY: function() {
  3512. return this.y;
  3513. },
  3514. setPositionX: function(x) {
  3515. this.x = x;
  3516. return this.update();
  3517. },
  3518. setPositionY: function(y) {
  3519. this.y = y;
  3520. return this.update();
  3521. }
  3522. });
  3523. });
  3524. define("graphic/shape", [ "graphic/svg", "core/utils", "graphic/eventhandler", "graphic/shapeevent", "core/class", "graphic/styled", "graphic/data", "graphic/matrix", "graphic/vector", "graphic/pen", "graphic/color", "core/config" ], function(require, exports, module) {
  3525. var svg = require("graphic/svg");
  3526. var utils = require("core/utils");
  3527. var EventHandler = require("graphic/eventhandler");
  3528. var Styled = require("graphic/styled");
  3529. var Data = require("graphic/data");
  3530. var Matrix = require("graphic/matrix");
  3531. var Pen = require("graphic/pen");
  3532. return require("core/class").createClass("Shape", {
  3533. mixins: [ EventHandler, Styled, Data ],
  3534. constructor: function(tagName) {
  3535. this.node = svg.createNode(tagName);
  3536. this.node.shape = this;
  3537. this.callMixin();
  3538. },
  3539. getId: function() {
  3540. return this.node.id;
  3541. },
  3542. setId: function(id) {
  3543. this.node.id = id;
  3544. return this;
  3545. },
  3546. getNode: function() {
  3547. return this.node;
  3548. },
  3549. getBoundaryBox: function() {
  3550. var box;
  3551. try {
  3552. box = this.node.getBBox();
  3553. } catch (e) {
  3554. box = {
  3555. x: this.node.clientLeft,
  3556. y: this.node.clientTop,
  3557. width: this.node.clientWidth,
  3558. height: this.node.clientHeight
  3559. };
  3560. }
  3561. return box;
  3562. },
  3563. getRenderBox: function(refer) {
  3564. function isAncestorOf(container, shape) {
  3565. var parent = shape.container;
  3566. while (parent && parent != container) {
  3567. parent = parent.container;
  3568. }
  3569. return !!parent;
  3570. }
  3571. if (refer === undefined) {
  3572. refer = this;
  3573. } else if (refer === "top") {
  3574. refer = this.getPaper() || this;
  3575. } else if (!isAncestorOf(refer, this)) {
  3576. refer = this;
  3577. }
  3578. var box = this.getBoundaryBox();
  3579. var current = this;
  3580. var matrix = current.getTransform();
  3581. while (current != refer) {
  3582. current = current.container;
  3583. if (current.getTransform) {
  3584. matrix = matrix.merge(current.getTransform());
  3585. }
  3586. }
  3587. return matrix.transformBox(box);
  3588. },
  3589. getWidth: function() {
  3590. return this.getRenderBox().width;
  3591. },
  3592. getHeight: function() {
  3593. return this.getRenderBox().height;
  3594. },
  3595. getSize: function() {
  3596. var box = this.getRenderBox();
  3597. delete box.x;
  3598. delete box.y;
  3599. return box;
  3600. },
  3601. setOpacity: function(value) {
  3602. this.node.setAttribute("opacity", value);
  3603. return this;
  3604. },
  3605. getOpacity: function() {
  3606. var opacity = this.node.getAttribute("opacity");
  3607. return opacity ? +opacity : 1;
  3608. },
  3609. getTransform: function() {
  3610. return Matrix.parse(this.node.getAttribute("transform"));
  3611. },
  3612. setTransform: function(matrix) {
  3613. this.node.setAttribute("transform", matrix.toString());
  3614. this.trigger("shapeupdate", {
  3615. type: "transform"
  3616. });
  3617. return this;
  3618. },
  3619. resetTransform: function() {
  3620. this.node.removeAttribute("transform");
  3621. this.trigger("shapeupdate", {
  3622. type: "transform"
  3623. });
  3624. return this;
  3625. },
  3626. mergeTransform: function(matrix) {
  3627. return this.setTransform(this.getTransform().mergeMatrix(matrix));
  3628. },
  3629. getAnchor: function() {
  3630. if (this.anchor && this.anchor.x !== undefined) {
  3631. return this.anchor;
  3632. }
  3633. var anchor = anchor || "center";
  3634. var rbox = this.getRenderBox();
  3635. var value = {
  3636. x: rbox.x + rbox.width / 2,
  3637. y: rbox.y + rbox.height / 2
  3638. };
  3639. if (~anchor.indexOf("left")) {
  3640. value.x = rbox.x;
  3641. }
  3642. if (~anchor.indexOf("right")) {
  3643. value.x = rbox.x + rbox.width;
  3644. }
  3645. if (~anchor.indexOf("top")) {
  3646. value.y = rbox.y;
  3647. }
  3648. if (~anchor.indexOf("bottom")) {
  3649. value.y = rbox.y + rbox.height;
  3650. }
  3651. return value;
  3652. },
  3653. setAnchor: function(ax, ay) {
  3654. if (arguments.length === 1) {
  3655. this.anchor = ax;
  3656. } else {
  3657. this.anchor = {
  3658. x: ax,
  3659. y: ay
  3660. };
  3661. }
  3662. return this;
  3663. },
  3664. resetAnchor: function() {
  3665. delete this.anchor;
  3666. return this;
  3667. },
  3668. translate: function(dx, dy) {
  3669. if (dy === undefined) {
  3670. dy = 0;
  3671. }
  3672. return this.mergeTransform(new Matrix().translate(dx, dy));
  3673. },
  3674. rotate: function(deg) {
  3675. var a = this.getAnchor();
  3676. return this.mergeTransform(new Matrix().translate(-a.x, -a.y).rotate(deg).translate(a.x, a.y));
  3677. },
  3678. scale: function(sx, sy) {
  3679. var a = this.getAnchor();
  3680. if (sy === undefined) {
  3681. sy = sx;
  3682. }
  3683. return this.mergeTransform(new Matrix().translate(-a.x, -a.y).scale(sx, sy).translate(a.x, a.y));
  3684. },
  3685. skew: function(sx, sy) {
  3686. var a = this.getAnchor();
  3687. if (sy === undefined) {
  3688. sy = sx;
  3689. }
  3690. return this.mergeTransform(new Matrix().translate(-a.x, -a.y).skew(sx, sy).translate(a.x, a.y));
  3691. },
  3692. stroke: function(pen, width) {
  3693. if (pen && pen.stroke) {
  3694. pen.stroke(this);
  3695. } else {
  3696. // 字符串或重写了 toString 的对象
  3697. this.node.setAttribute("stroke", pen.toString());
  3698. if (width) {
  3699. this.node.setAttribute("stroke-width", width);
  3700. }
  3701. }
  3702. return this;
  3703. },
  3704. fill: function(brush) {
  3705. if (brush && brush.fill) {
  3706. brush.fill(this);
  3707. } else {
  3708. // 字符串或重写了 toString 的对象
  3709. this.node.setAttribute("fill", brush.toString());
  3710. }
  3711. return this;
  3712. },
  3713. setAttr: function(a, v) {
  3714. var me = this;
  3715. if (utils.isObject(a)) {
  3716. utils.each(a, function(val, key) {
  3717. me.setAttr(key, val);
  3718. });
  3719. }
  3720. if (v === undefined || v === null || v === "") {
  3721. this.node.removeAttribute(a);
  3722. } else {
  3723. this.node.setAttribute(a, v);
  3724. }
  3725. },
  3726. getAttr: function(a) {
  3727. return this.node.getAttribute(a);
  3728. }
  3729. });
  3730. });
  3731. define("graphic/shapecontainer", [ "graphic/container", "core/class", "core/utils", "core/config", "graphic/shape", "graphic/svg", "graphic/eventhandler", "graphic/styled", "graphic/data", "graphic/matrix", "graphic/pen" ], function(require, exports, module) {
  3732. var Container = require("graphic/container");
  3733. var utils = require("core/utils");
  3734. var ShapeContainer = require("core/class").createClass("ShapeContainer", {
  3735. base: Container,
  3736. isShapeContainer: true,
  3737. /* private */
  3738. handleAdd: function(shape, index) {
  3739. var parent = this.getShapeNode();
  3740. parent.insertBefore(shape.node, parent.childNodes[index] || null);
  3741. shape.trigger("add", {
  3742. container: this
  3743. });
  3744. if (shape.notifyTreeModification) {
  3745. shape.notifyTreeModification("treeadd", this);
  3746. }
  3747. },
  3748. /* private */
  3749. handleRemove: function(shape, index) {
  3750. var parent = this.getShapeNode();
  3751. parent.removeChild(shape.node);
  3752. shape.trigger("remove", {
  3753. container: this
  3754. });
  3755. if (shape.notifyTreeModification) {
  3756. shape.notifyTreeModification("treeremove", this);
  3757. }
  3758. },
  3759. /* private */
  3760. notifyTreeModification: function(type, container) {
  3761. this.eachItem(function(index, shape) {
  3762. if (shape instanceof ShapeContainer) {
  3763. shape.notifyTreeModification(type, container);
  3764. }
  3765. shape.trigger(type, {
  3766. container: container
  3767. });
  3768. });
  3769. },
  3770. /* public */
  3771. getShape: function(index) {
  3772. return this.getItem(index);
  3773. },
  3774. /* public */
  3775. addShape: function(shape, index) {
  3776. return this.addItem(shape, index);
  3777. },
  3778. appendShape: function(shape) {
  3779. return this.addShape(shape);
  3780. },
  3781. prependShape: function(shape) {
  3782. return this.addShape(shape, 0);
  3783. },
  3784. replaceShape: function(replacer, origin) {
  3785. var index = this.indexOf(origin);
  3786. if (index === -1) {
  3787. return;
  3788. }
  3789. this.removeShape(index);
  3790. this.addShape(replacer, index);
  3791. return this;
  3792. },
  3793. addShapeBefore: function(shape, refer) {
  3794. var index = this.indexOf(refer);
  3795. return this.addShape(shape, index);
  3796. },
  3797. addShapeAfter: function(shape, refer) {
  3798. var index = this.indexOf(refer);
  3799. return this.addShape(shape, index === -1 ? undefined : index + 1);
  3800. },
  3801. /* public */
  3802. addShapes: function(shapes) {
  3803. return this.addItems(shapes);
  3804. },
  3805. /* public */
  3806. removeShape: function(index) {
  3807. return this.removeItem(index);
  3808. },
  3809. getShapes: function() {
  3810. return this.getItems();
  3811. },
  3812. getShapesByType: function(name) {
  3813. var shapes = [];
  3814. function getShapes(shape) {
  3815. if (name.toLowerCase() == shape.getType().toLowerCase()) {
  3816. shapes.push(shape);
  3817. }
  3818. if (shape.isShapeContainer) {
  3819. utils.each(shape.getShapes(), function(n) {
  3820. getShapes(n);
  3821. });
  3822. }
  3823. }
  3824. getShapes(this);
  3825. return shapes;
  3826. },
  3827. /* public */
  3828. getShapeById: function(id) {
  3829. return this.getShapeNode().getElementById(id).shape;
  3830. },
  3831. arrangeShape: function(shape, index) {
  3832. return this.removeShape(shape).addShape(shape, index);
  3833. },
  3834. /* protected */
  3835. getShapeNode: function() {
  3836. return this.shapeNode || this.node;
  3837. }
  3838. });
  3839. var Shape = require("graphic/shape");
  3840. require("core/class").extendClass(Shape, {
  3841. bringTo: function(index) {
  3842. this.container.arrangeShape(this, index);
  3843. return this;
  3844. },
  3845. bringFront: function() {
  3846. return this.bringTo(this.container.indexOf(this) + 1);
  3847. },
  3848. bringBack: function() {
  3849. return this.bringTo(this.container.indexOf(this) - 1);
  3850. },
  3851. bringTop: function() {
  3852. this.container.removeShape(this).addShape(this);
  3853. return this;
  3854. },
  3855. bringRear: function() {
  3856. return this.bringTo(0);
  3857. },
  3858. bringRefer: function(referShape, offset) {
  3859. if (referShape.container) {
  3860. if (this.remove) {
  3861. this.remove();
  3862. }
  3863. referShape.container.addShape(this, referShape.container.indexOf(referShape) + (offset || 0));
  3864. }
  3865. return this;
  3866. },
  3867. bringAbove: function(referShape) {
  3868. return this.bringRefer(referShape);
  3869. },
  3870. bringBelow: function(referShape) {
  3871. return this.bringRefer(referShape, 1);
  3872. },
  3873. replaceBy: function(newShape) {
  3874. if (this.container) {
  3875. newShape.bringAbove(this);
  3876. this.remove();
  3877. }
  3878. return this;
  3879. }
  3880. });
  3881. return ShapeContainer;
  3882. });
  3883. /*
  3884. * 图形事件包装类
  3885. * */
  3886. define("graphic/shapeevent", [ "graphic/matrix", "core/utils", "graphic/vector", "core/class", "core/config" ], function(require, exprots, module) {
  3887. var Matrix = require("graphic/matrix"), Utils = require("core/utils");
  3888. return require("core/class").createClass("ShapeEvent", {
  3889. constructor: function(event) {
  3890. var target = null;
  3891. // dom 事件封装对象
  3892. if (!Utils.isObject(event.target)) {
  3893. this.type = event.type;
  3894. target = event.target;
  3895. // use标签有特殊属性, 需要区别对待
  3896. if (target.correspondingUseElement) {
  3897. target = target.correspondingUseElement;
  3898. }
  3899. this.originEvent = event;
  3900. this.targetShape = target.shape || target.paper || event.currentTarget && (event.currentTarget.shape || event.currentTarget.paper);
  3901. if (event.__kity_param) {
  3902. Utils.extend(this, event.__kity_param);
  3903. }
  3904. } else {
  3905. Utils.extend(this, event);
  3906. }
  3907. },
  3908. preventDefault: function() {
  3909. var evt = this.originEvent;
  3910. if (!evt) {
  3911. return true;
  3912. }
  3913. if (evt.preventDefault) {
  3914. evt.preventDefault();
  3915. return evt.cancelable;
  3916. } else {
  3917. evt.returnValue = false;
  3918. return true;
  3919. }
  3920. },
  3921. //当前鼠标事件在用户坐标系中点击的点的坐标位置
  3922. getPosition: function(touch_index) {
  3923. if (!this.originEvent) {
  3924. return null;
  3925. }
  3926. var eventClient = this.originEvent.touches ? this.originEvent.touches[touch_index || 0] : this.originEvent;
  3927. var clientX = eventClient.clientX, clientY = eventClient.clientY, paper = this.targetShape.getPaper(), //转换过后的点
  3928. transPoint = Matrix.transformPoint(clientX, clientY, paper.node.getScreenCTM().inverse());
  3929. var viewport = paper.getViewPort();
  3930. return {
  3931. x: transPoint.x / viewport.zoom - viewport.offset.x,
  3932. y: transPoint.y / viewport.zoom - viewport.offset.y
  3933. };
  3934. },
  3935. stopPropagation: function() {
  3936. var evt = this.originEvent;
  3937. if (!evt) {
  3938. return true;
  3939. }
  3940. if (evt.stopPropagation) {
  3941. evt.stopPropagation();
  3942. } else {
  3943. evt.cancelBubble = false;
  3944. }
  3945. }
  3946. });
  3947. });
  3948. /*
  3949. * 图形上的点抽象
  3950. */
  3951. define("graphic/shapepoint", [ "core/class", "core/config", "graphic/point" ], function(require, exports, module) {
  3952. return require("core/class").createClass("ShapePoint", {
  3953. base: require("graphic/point"),
  3954. constructor: function(px, py) {
  3955. this.callBase(px, py);
  3956. },
  3957. setX: function(x) {
  3958. this.callBase(x);
  3959. this.update();
  3960. return this;
  3961. },
  3962. setY: function(y) {
  3963. this.callBase(y);
  3964. this.update();
  3965. return this;
  3966. },
  3967. setPoint: function(x, y) {
  3968. this.callBase(x, y);
  3969. this.update();
  3970. return this;
  3971. },
  3972. update: function() {
  3973. if (this.container && this.container.update) {
  3974. this.container.update();
  3975. }
  3976. return this;
  3977. }
  3978. });
  3979. });
  3980. /**
  3981. * 标准颜色映射
  3982. */
  3983. define("graphic/standardcolor", [], {
  3984. COLOR_STANDARD: {
  3985. aliceblue: "#f0f8ff",
  3986. antiquewhite: "#faebd7",
  3987. aqua: "#00ffff",
  3988. aquamarine: "#7fffd4",
  3989. azure: "#f0ffff",
  3990. beige: "#f5f5dc",
  3991. bisque: "#ffe4c4",
  3992. black: "#000000",
  3993. blanchedalmond: "#ffebcd",
  3994. blue: "#0000ff",
  3995. blueviolet: "#8a2be2",
  3996. brown: "#a52a2a",
  3997. burlywood: "#deb887",
  3998. cadetblue: "#5f9ea0",
  3999. chartreuse: "#7fff00",
  4000. chocolate: "#d2691e",
  4001. coral: "#ff7f50",
  4002. cornflowerblue: "#6495ed",
  4003. cornsilk: "#fff8dc",
  4004. crimson: "#dc143c",
  4005. cyan: "#00ffff",
  4006. darkblue: "#00008b",
  4007. darkcyan: "#008b8b",
  4008. darkgoldenrod: "#b8860b",
  4009. darkgray: "#a9a9a9",
  4010. darkgreen: "#006400",
  4011. darkgrey: "#a9a9a9",
  4012. darkkhaki: "#bdb76b",
  4013. darkmagenta: "#8b008b",
  4014. darkolivegreen: "#556b2f",
  4015. darkorange: "#ff8c00",
  4016. darkorchid: "#9932cc",
  4017. darkred: "#8b0000",
  4018. darksalmon: "#e9967a",
  4019. darkseagreen: "#8fbc8f",
  4020. darkslateblue: "#483d8b",
  4021. darkslategray: "#2f4f4f",
  4022. darkslategrey: "#2f4f4f",
  4023. darkturquoise: "#00ced1",
  4024. darkviolet: "#9400d3",
  4025. deeppink: "#ff1493",
  4026. deepskyblue: "#00bfff",
  4027. dimgray: "#696969",
  4028. dimgrey: "#696969",
  4029. dodgerblue: "#1e90ff",
  4030. firebrick: "#b22222",
  4031. floralwhite: "#fffaf0",
  4032. forestgreen: "#228b22",
  4033. fuchsia: "#ff00ff",
  4034. gainsboro: "#dcdcdc",
  4035. ghostwhite: "#f8f8ff",
  4036. gold: "#ffd700",
  4037. goldenrod: "#daa520",
  4038. gray: "#808080",
  4039. green: "#008000",
  4040. greenyellow: "#adff2f",
  4041. grey: "#808080",
  4042. honeydew: "#f0fff0",
  4043. hotpink: "#ff69b4",
  4044. indianred: "#cd5c5c",
  4045. indigo: "#4b0082",
  4046. ivory: "#fffff0",
  4047. khaki: "#f0e68c",
  4048. lavender: "#e6e6fa",
  4049. lavenderblush: "#fff0f5",
  4050. lawngreen: "#7cfc00",
  4051. lemonchiffon: "#fffacd",
  4052. lightblue: "#add8e6",
  4053. lightcoral: "#f08080",
  4054. lightcyan: "#e0ffff",
  4055. lightgoldenrodyellow: "#fafad2",
  4056. lightgray: "#d3d3d3",
  4057. lightgreen: "#90ee90",
  4058. lightgrey: "#d3d3d3",
  4059. lightpink: "#ffb6c1",
  4060. lightsalmon: "#ffa07a",
  4061. lightseagreen: "#20b2aa",
  4062. lightskyblue: "#87cefa",
  4063. lightslategray: "#778899",
  4064. lightslategrey: "#778899",
  4065. lightsteelblue: "#b0c4de",
  4066. lightyellow: "#ffffe0",
  4067. lime: "#00ff00",
  4068. limegreen: "#32cd32",
  4069. linen: "#faf0e6",
  4070. magenta: "#ff00ff",
  4071. maroon: "#800000",
  4072. mediumaquamarine: "#66cdaa",
  4073. mediumblue: "#0000cd",
  4074. mediumorchid: "#ba55d3",
  4075. mediumpurple: "#9370db",
  4076. mediumseagreen: "#3cb371",
  4077. mediumslateblue: "#7b68ee",
  4078. mediumspringgreen: "#00fa9a",
  4079. mediumturquoise: "#48d1cc",
  4080. mediumvioletred: "#c71585",
  4081. midnightblue: "#191970",
  4082. mintcream: "#f5fffa",
  4083. mistyrose: "#ffe4e1",
  4084. moccasin: "#ffe4b5",
  4085. navajowhite: "#ffdead",
  4086. navy: "#000080",
  4087. oldlace: "#fdf5e6",
  4088. olive: "#808000",
  4089. olivedrab: "#6b8e23",
  4090. orange: "#ffa500",
  4091. orangered: "#ff4500",
  4092. orchid: "#da70d6",
  4093. palegoldenrod: "#eee8aa",
  4094. palegreen: "#98fb98",
  4095. paleturquoise: "#afeeee",
  4096. palevioletred: "#db7093",
  4097. papayawhip: "#ffefd5",
  4098. peachpuff: "#ffdab9",
  4099. peru: "#cd853f",
  4100. pink: "#ffc0cb",
  4101. plum: "#dda0dd",
  4102. powderblue: "#b0e0e6",
  4103. purple: "#800080",
  4104. red: "#ff0000",
  4105. rosybrown: "#bc8f8f",
  4106. royalblue: "#4169e1",
  4107. saddlebrown: "#8b4513",
  4108. salmon: "#fa8072",
  4109. sandybrown: "#f4a460",
  4110. seagreen: "#2e8b57",
  4111. seashell: "#fff5ee",
  4112. sienna: "#a0522d",
  4113. silver: "#c0c0c0",
  4114. skyblue: "#87ceeb",
  4115. slateblue: "#6a5acd",
  4116. slategray: "#708090",
  4117. slategrey: "#708090",
  4118. snow: "#fffafa",
  4119. springgreen: "#00ff7f",
  4120. steelblue: "#4682b4",
  4121. tan: "#d2b48c",
  4122. teal: "#008080",
  4123. thistle: "#d8bfd8",
  4124. tomato: "#ff6347",
  4125. turquoise: "#40e0d0",
  4126. violet: "#ee82ee",
  4127. wheat: "#f5deb3",
  4128. white: "#ffffff",
  4129. whitesmoke: "#f5f5f5",
  4130. yellow: "#ffff00"
  4131. },
  4132. //标准扩展
  4133. EXTEND_STANDARD: {}
  4134. });
  4135. define("graphic/styled", [ "core/class", "core/config" ], function(require, exports, module) {
  4136. // polyfill for ie
  4137. var ClassList = require("core/class").createClass("ClassList", {
  4138. constructor: function(node) {
  4139. this._node = node;
  4140. this._list = node.className.toString().split(" ");
  4141. },
  4142. _update: function() {
  4143. this._node.className = this._list.join(" ");
  4144. },
  4145. add: function(name) {
  4146. this._list.push(name);
  4147. this._update();
  4148. },
  4149. remove: function(name) {
  4150. var index = this._list.indexOf(name);
  4151. if (~index) {
  4152. this._list.splice(index, 1);
  4153. }
  4154. this._update();
  4155. },
  4156. contains: function(name) {
  4157. return ~this._list.indexOf(name);
  4158. }
  4159. });
  4160. function getClassList(node) {
  4161. if (!node.classList) {
  4162. node.classList = new ClassList(node);
  4163. }
  4164. return node.classList;
  4165. }
  4166. return require("core/class").createClass("Styled", {
  4167. addClass: function(name) {
  4168. getClassList(this.node).add(name);
  4169. return this;
  4170. },
  4171. removeClass: function(name) {
  4172. getClassList(this.node).remove(name);
  4173. return this;
  4174. },
  4175. hasClass: function(name) {
  4176. return getClassList(this.node).contains(name);
  4177. },
  4178. setStyle: function(styles) {
  4179. if (arguments.length == 2) {
  4180. this.node.style[arguments[0]] = arguments[1];
  4181. return this;
  4182. }
  4183. for (var name in styles) {
  4184. if (styles.hasOwnProperty(name)) {
  4185. this.node.style[name] = styles[name];
  4186. }
  4187. }
  4188. return this;
  4189. }
  4190. });
  4191. });
  4192. define("graphic/svg", [], function(require, exports, module) {
  4193. var doc = document;
  4194. var id = 0;
  4195. var svg = {
  4196. createNode: function(name) {
  4197. var node = doc.createElementNS(svg.ns, name);
  4198. node.id = "kity_" + name + "_" + id++;
  4199. return node;
  4200. },
  4201. defaults: {
  4202. stroke: "none",
  4203. fill: "none"
  4204. },
  4205. xlink: "http://www.w3.org/1999/xlink",
  4206. ns: "http://www.w3.org/2000/svg"
  4207. };
  4208. return svg;
  4209. });
  4210. define("graphic/text", [ "graphic/textcontent", "graphic/shape", "core/class", "graphic/shapecontainer", "graphic/container", "core/utils", "graphic/svg", "core/config" ], function(require, exports, module) {
  4211. var TextContent = require("graphic/textcontent");
  4212. var ShapeContainer = require("graphic/shapecontainer");
  4213. var svg = require("graphic/svg");
  4214. return require("core/class").createClass("Text", {
  4215. base: TextContent,
  4216. mixins: [ ShapeContainer ],
  4217. constructor: function(content) {
  4218. this.callBase("text");
  4219. if (content !== undefined) {
  4220. this.setContent(content);
  4221. }
  4222. },
  4223. setX: function(x) {
  4224. this.node.setAttribute("x", x);
  4225. return this;
  4226. },
  4227. setPosition: function(x, y) {
  4228. return this.setX(x).setY(y);
  4229. },
  4230. setY: function(y) {
  4231. this.node.setAttribute("y", y);
  4232. return this;
  4233. },
  4234. getX: function() {
  4235. return +this.node.getAttribute("x");
  4236. },
  4237. getY: function() {
  4238. return +this.node.getAttribute("y");
  4239. },
  4240. setTextAnchor: function(anchor) {
  4241. if (anchor == "center") {
  4242. anchor = "middle";
  4243. }
  4244. this.node.setAttribute("text-anchor", anchor);
  4245. // text path
  4246. if (this.shapeNode != this.node) {
  4247. this.shapeNode.setAttribute("startOffset", {
  4248. start: "0",
  4249. middle: "50%",
  4250. end: "100%"
  4251. }[anchor]);
  4252. }
  4253. return this;
  4254. },
  4255. getTextAnchor: function() {
  4256. return this.node.getAttribute("text-anchor") || "start";
  4257. },
  4258. addSpan: function(span) {
  4259. this.addShape(span);
  4260. return this;
  4261. },
  4262. setPath: function(path) {
  4263. var textpath = this.shapeNode;
  4264. if (this.shapeNode == this.node) {
  4265. // 当前还不是 textpath
  4266. textpath = this.shapeNode = svg.createNode("textPath");
  4267. while (this.node.firstChild) {
  4268. this.shapeNode.appendChild(this.node.firstChild);
  4269. }
  4270. this.node.appendChild(textpath);
  4271. }
  4272. textpath.setAttributeNS(svg.xlink, "xlink:href", "#" + path.node.id);
  4273. this.setAnchor(this.getAnchor());
  4274. return this;
  4275. }
  4276. });
  4277. });
  4278. define("graphic/textcontent", [ "graphic/shape", "graphic/svg", "core/utils", "graphic/eventhandler", "graphic/styled", "graphic/data", "graphic/matrix", "graphic/pen", "core/class", "core/config" ], function(require, exports, module) {
  4279. var Shape = require("graphic/shape");
  4280. return require("core/class").createClass("TextContent", {
  4281. base: Shape,
  4282. constructor: function(nodeType) {
  4283. // call shape constructor
  4284. this.callBase(nodeType);
  4285. this.shapeNode = this.shapeNode || this.node;
  4286. },
  4287. clearContent: function() {
  4288. while (this.shapeNode.firstChild) {
  4289. this.shapeNode.removeChild(this.shapeNode.firstChild);
  4290. }
  4291. return this;
  4292. },
  4293. setContent: function(content) {
  4294. this.shapeNode.textContent = content;
  4295. return this;
  4296. },
  4297. getContent: function() {
  4298. return this.shapeNode.textContent;
  4299. },
  4300. appendContent: function(content) {
  4301. this.shapeNode.textContent += content;
  4302. return this;
  4303. },
  4304. setSize: function(value) {
  4305. this.fontsize = value;
  4306. this.node.setAttribute("font-size", value);
  4307. return this;
  4308. },
  4309. getSize: function() {
  4310. return this.fontsize;
  4311. },
  4312. getExtentOfChar: function(index) {
  4313. return this.node.getExtentOfChar(index);
  4314. },
  4315. getRotationOfChar: function(index) {
  4316. return this.node.getRotationOfChar(index);
  4317. },
  4318. getCharNumAtPosition: function(x, y) {
  4319. return this.node.getCharNumAtPosition(this.node.viewportElement.createSVGPoint(x, y));
  4320. }
  4321. });
  4322. });
  4323. define("graphic/textspan", [ "graphic/textcontent", "graphic/shape", "core/class", "graphic/styled", "core/config" ], function(require, exports, module) {
  4324. var TextContent = require("graphic/textcontent");
  4325. var Styled = require("graphic/styled");
  4326. return require("core/class").createClass("TextSpan", {
  4327. base: TextContent,
  4328. mixins: [ Styled ],
  4329. constructor: function(content) {
  4330. this.callBase("tspan");
  4331. this.setContent(content);
  4332. }
  4333. });
  4334. });
  4335. /*
  4336. * USE 功能
  4337. */
  4338. define("graphic/use", [ "graphic/svg", "core/class", "core/config", "graphic/shape", "core/utils", "graphic/eventhandler", "graphic/styled", "graphic/data", "graphic/matrix", "graphic/pen" ], function(require, exports, module) {
  4339. var Svg = require("graphic/svg");
  4340. var Class = require("core/class");
  4341. var Use = Class.createClass("Use", {
  4342. base: require("graphic/shape"),
  4343. constructor: function(shape) {
  4344. var shapeId = null;
  4345. this.callBase("use");
  4346. shapeId = shape.getId();
  4347. if (shapeId) {
  4348. this.node.setAttributeNS(Svg.xlink, "xlink:href", "#" + shapeId);
  4349. }
  4350. // by techird
  4351. // 作为 Use 的图形,如果没有 fill 和 stroke,移除默认的 'none' 值,用于 Use 覆盖
  4352. if (shape.node.getAttribute("fill") === "none") {
  4353. shape.node.removeAttribute("fill");
  4354. }
  4355. if (shape.node.getAttribute("stroke") === "none") {
  4356. shape.node.removeAttribute("stroke");
  4357. }
  4358. }
  4359. });
  4360. var Shape = require("graphic/shape");
  4361. Class.extendClass(Shape, {
  4362. // fast-use
  4363. use: function() {
  4364. return new Use(this);
  4365. }
  4366. });
  4367. return Use;
  4368. });
  4369. define("graphic/vector", [ "core/class", "core/config" ], function(require, exports, module) {
  4370. var Vector = require("core/class").createClass("Vector", {
  4371. constructor: function(x, y) {
  4372. this.x = x || 0;
  4373. this.y = y || 0;
  4374. },
  4375. length: function() {
  4376. return Math.sqrt(Vector.square(this));
  4377. }
  4378. });
  4379. Vector.add = function(p, q) {
  4380. return new Vector(p.x + q.x, p.y + q.y);
  4381. };
  4382. Vector.square = function(p) {
  4383. return p.x * p.x + p.y * p.y;
  4384. };
  4385. Vector.normalize = function(p, l) {
  4386. if (l === undefined) {
  4387. l = 1;
  4388. }
  4389. var factor = l / p.length();
  4390. return new Vector(p.x * factor, p.y * factor);
  4391. };
  4392. Vector.verticalVector = function(p) {
  4393. return new Vector(p.y, -p.x);
  4394. };
  4395. Vector.verticalNormalize = function(p) {
  4396. return Vector.normalize(Vector.verticalVector(p));
  4397. };
  4398. Vector.multipy = function(p, s) {
  4399. return new Vector(p.x * s, p.y * s);
  4400. };
  4401. Vector.reverse = function(p) {
  4402. return Vector.multipy(p, -1);
  4403. };
  4404. Vector.dot = function(p, q) {
  4405. return p.x * q.x + p.y * q.y;
  4406. };
  4407. Vector.minus = function(p, q) {
  4408. return new Vector(p.x - q.x, p.y - q.y);
  4409. };
  4410. // p 在 q 上的投影
  4411. Vector.projection = function(p, q) {
  4412. var factor = Vector.dot(p, q) / Vector.square(q);
  4413. return Vector.multipy(q, factor);
  4414. };
  4415. // from p1 to p2
  4416. Vector.fromPoints = function(p1, p2) {
  4417. return new Vector(p2.x - p1.x, p2.y - p1.y);
  4418. };
  4419. Vector.fromPolar = function(d, a, isRad) {
  4420. if (isRad !== true) {
  4421. a = a * Math.PI / 180;
  4422. }
  4423. return new Vector(d * Math.cos(a), d * Math.sin(a));
  4424. };
  4425. return Vector;
  4426. });
  4427. define("graphic/view", [ "graphic/shapecontainer", "graphic/container", "core/utils", "core/class", "graphic/shape", "graphic/viewbox", "core/config", "graphic/view" ], function(require, exports, module) {
  4428. var ShapeContainer = require("graphic/shapecontainer");
  4429. var ViewBox = require("graphic/viewbox");
  4430. return require("core/class").createClass("View", {
  4431. mixins: [ ShapeContainer, ViewBox ],
  4432. base: require("graphic/view"),
  4433. constructor: function() {
  4434. this.callBase("view");
  4435. }
  4436. });
  4437. });
  4438. define("graphic/viewbox", [ "core/class", "core/config" ], function(require, exports, module) {
  4439. return require("core/class").createClass("ViewBox", {
  4440. getViewBox: function() {
  4441. var attr = this.node.getAttribute("viewBox");
  4442. if (attr === null) {
  4443. // firefox:
  4444. // 1. viewBox 没有设置过的时候获得的是 null
  4445. // 2. svg 标签没有指定绝对大小的时候 clientWidth 和 clientHeigt 为 0,需要在父容器上查找
  4446. // TODO: 第 2 条取得的不准确(假如有 padding 之类的)
  4447. return {
  4448. x: 0,
  4449. y: 0,
  4450. width: this.node.clientWidth || this.node.parentNode.clientWidth,
  4451. height: this.node.clientHeight || this.node.parentNode.clientHeight
  4452. };
  4453. } else {
  4454. attr = attr.split(" ");
  4455. return {
  4456. x: +attr[0],
  4457. y: +attr[1],
  4458. width: +attr[2],
  4459. height: +attr[3]
  4460. };
  4461. }
  4462. },
  4463. setViewBox: function(x, y, width, height) {
  4464. this.node.setAttribute("viewBox", [ x, y, width, height ].join(" "));
  4465. return this;
  4466. }
  4467. });
  4468. });
  4469. /**
  4470. * 模块暴露
  4471. */
  4472. ( function ( global ) {
  4473. define( 'kity.start', function ( require ) {
  4474. var kity = global.kity = require( 'core/class' );
  4475. require( 'core/utils' ).extend( kity, {
  4476. // core
  4477. Utils: require( "core/utils" ),
  4478. Browser:require("core/browser"),
  4479. // shape
  4480. Bezier: require( 'graphic/bezier' ),
  4481. BezierPoint: require( 'graphic/bezierpoint' ),
  4482. Circle: require( 'graphic/circle' ),
  4483. Clip: require( 'graphic/clip' ),
  4484. Color: require( 'graphic/color' ),
  4485. Curve: require( 'graphic/curve' ),
  4486. Ellipse: require( 'graphic/ellipse' ),
  4487. GradientBrush: require( 'graphic/gradientbrush' ),
  4488. Group: require( 'graphic/group' ),
  4489. Image: require( 'graphic/image' ),
  4490. Line: require( 'graphic/line' ),
  4491. LinearGradientBrush: require( 'graphic/lineargradientbrush' ),
  4492. Mask: require( 'graphic/mask' ),
  4493. Matrix: require( 'graphic/matrix' ),
  4494. Palette: require( 'graphic/palette' ),
  4495. Paper: require( 'graphic/paper' ),
  4496. Path: require( 'graphic/path' ),
  4497. PatternBrush: require( 'graphic/patternbrush' ),
  4498. Pen: require( 'graphic/pen' ),
  4499. Point: require( 'graphic/point' ),
  4500. Polygon: require( 'graphic/polygon' ),
  4501. Polyline: require( 'graphic/polyline' ),
  4502. RadialGradientBrush: require( 'graphic/radialgradientbrush' ),
  4503. Rect: require( 'graphic/rect' ),
  4504. Shape: require( 'graphic/shape' ),
  4505. ShapePoint: require( 'graphic/shapepoint' ),
  4506. Text: require( 'graphic/text' ),
  4507. TextSpan: require( 'graphic/textspan' ),
  4508. Use: require( 'graphic/use' ),
  4509. Vector: require( 'graphic/vector' ),
  4510. // animate
  4511. Animator: require( 'animate/animator' ),
  4512. Easing: require( 'animate/easing' ),
  4513. OpacityAnimator: require( 'animate/opacityanimator' ),
  4514. RotateAnimator: require( 'animate/rotateanimator' ),
  4515. ScaleAnimator: require( 'animate/scaleanimator' ),
  4516. Timeline: require( 'animate/timeline' ),
  4517. TranslateAnimator: require( 'animate/translateanimator' ),
  4518. // filter
  4519. Filter: require( 'filter/filter' ),
  4520. GaussianblurFilter: require( 'filter/gaussianblurfilter' ),
  4521. ProjectionFilter: require( 'filter/projectionfilter' ),
  4522. // effect
  4523. ColorMatrixEffect: require( 'filter/effect/colormatrixeffect' ),
  4524. CompositeEffect: require( 'filter/effect/compositeeffect' ),
  4525. ConvolveMatrixEffect: require( 'filter/effect/convolvematrixeffect' ),
  4526. Effect: require( 'filter/effect/effect' ),
  4527. GaussianblurEffect: require( 'filter/effect/gaussianblureffect' ),
  4528. OffsetEffect: require( 'filter/effect/offseteffect' )
  4529. } );
  4530. } );
  4531. // build环境中才含有use
  4532. try {
  4533. use( 'kity.start' );
  4534. } catch ( e ) {
  4535. }
  4536. } )( this );
  4537. })();