diff --git a/404.html b/404.html new file mode 100644 index 0000000..0ec90bc --- /dev/null +++ b/404.html @@ -0,0 +1,23 @@ + + + + + + 404 | KLineChart + + + + + + + + + + + + +
+ + + + \ No newline at end of file diff --git a/CNAME b/CNAME new file mode 100644 index 0000000..92fb39c --- /dev/null +++ b/CNAME @@ -0,0 +1 @@ +v9.klinecharts.com \ No newline at end of file diff --git a/assets/app.Bwcp49g2.js b/assets/app.Bwcp49g2.js new file mode 100644 index 0000000..fa2f48e --- /dev/null +++ b/assets/app.Bwcp49g2.js @@ -0,0 +1 @@ +import{R as p}from"./chunks/theme.TzJERBRK.js";import{R as o,aa as u,ab as l,ac as c,ad as f,ae as d,af as m,ag as h,ah as g,ai as A,aj as v,d as P,u as R,v as w,s as y,ak as C,al as b,am as E,a8 as S}from"./chunks/framework.DSL-p2JV.js";function i(e){if(e.extends){const a=i(e.extends);return{...a,...e,async enhanceApp(t){a.enhanceApp&&await a.enhanceApp(t),e.enhanceApp&&await e.enhanceApp(t)}}}return e}const s=i(p),T=P({name:"VitePressApp",setup(){const{site:e,lang:a,dir:t}=R();return w(()=>{y(()=>{document.documentElement.lang=a.value,document.documentElement.dir=t.value})}),e.value.router.prefetchLinks&&C(),b(),E(),s.setup&&s.setup(),()=>S(s.Layout)}});async function j(){globalThis.__VITEPRESS__=!0;const e=_(),a=D();a.provide(l,e);const t=c(e.route);return a.provide(f,t),a.component("Content",d),a.component("ClientOnly",m),Object.defineProperties(a.config.globalProperties,{$frontmatter:{get(){return t.frontmatter.value}},$params:{get(){return t.page.value.params}}}),s.enhanceApp&&await s.enhanceApp({app:a,router:e,siteData:h}),{app:a,router:e,data:t}}function D(){return g(T)}function _(){let e=o,a;return A(t=>{let n=v(t),r=null;return n&&(e&&(a=n),(e||a===n)&&(n=n.replace(/\.js$/,".lean.js")),r=import(n)),o&&(e=!1),r},s.NotFound)}o&&j().then(({app:e,router:a,data:t})=>{a.go().then(()=>{u(a.route,t.site),e.mount("#app")})});export{j as createApp}; diff --git a/assets/chunks/@localSearchIndexen-US.KlCGKX-t.js b/assets/chunks/@localSearchIndexen-US.KlCGKX-t.js new file mode 100644 index 0000000..cf1fb9c --- /dev/null +++ b/assets/chunks/@localSearchIndexen-US.KlCGKX-t.js @@ -0,0 +1 @@ +const e='{"documentCount":227,"nextId":227,"documentIds":{"0":"/en-US/guide/changelog#📠-change-log","1":"/en-US/guide/changelog#_9-8-10","2":"/en-US/guide/changelog#_9-8-9","3":"/en-US/guide/changelog#_9-8-8","4":"/en-US/guide/changelog#_9-8-7","5":"/en-US/guide/changelog#_9-8-6","6":"/en-US/guide/changelog#_9-8-5","7":"/en-US/guide/changelog#_9-8-3","8":"/en-US/guide/changelog#_9-8-2","9":"/en-US/guide/changelog#_9-8-1","10":"/en-US/guide/changelog#_9-8-0","11":"/en-US/guide/changelog#_9-7-1","12":"/en-US/guide/changelog#_9-7-0","13":"/en-US/guide/changelog#_9-6-0","14":"/en-US/guide/changelog#_9-5-4","15":"/en-US/guide/changelog#_9-5-3","16":"/en-US/guide/changelog#_9-5-2","17":"/en-US/guide/changelog#_9-5-1","18":"/en-US/guide/changelog#_9-5-0","19":"/en-US/guide/changelog#_9-4-0","20":"/en-US/guide/changelog#_9-3-0","21":"/en-US/guide/changelog#_9-2-2","22":"/en-US/guide/changelog#_9-2-1","23":"/en-US/guide/changelog#_9-2-0","24":"/en-US/guide/changelog#_9-1-3","25":"/en-US/guide/changelog#_9-1-2","26":"/en-US/guide/changelog#_9-1-1","27":"/en-US/guide/changelog#_9-1-0","28":"/en-US/guide/changelog#_9-0-1","29":"/en-US/guide/changelog#_9-0-0","30":"/en-US/guide/changelog#_8-x","31":"/en-US/guide/changelog#_7-x","32":"/en-US/guide/changelog#_6-x","33":"/en-US/guide/changelog#_5-x","34":"/en-US/guide/changelog#_4-x","35":"/en-US/guide/chart-api#chart-api","36":"/en-US/guide/chart-api#init-ds-options","37":"/en-US/guide/chart-api#dispose-dcs","38":"/en-US/guide/chart-api#registerlocale-locale-locales","39":"/en-US/guide/chart-api#getoverlayclass","40":"/en-US/guide/chart-api#getsupportedlocales","41":"/en-US/guide/chart-api#registerstyles-name-styles","42":"/en-US/guide/chart-api#registerfigure-figure","43":"/en-US/guide/chart-api#getsupportedfigures","44":"/en-US/guide/chart-api#getfigureclass-name","45":"/en-US/guide/chart-api#registerindicator-indicator","46":"/en-US/guide/chart-api#getsupportedindicators","47":"/en-US/guide/chart-api#registeroverlay-overlay","48":"/en-US/guide/chart-api#getsupportedoverlays","49":"/en-US/guide/chart-api#registerxaxis-axis-9-8-0","50":"/en-US/guide/chart-api#registeryaxis-axis-9-8-0","51":"/en-US/guide/chart-api#version","52":"/en-US/guide/chart-api#utils","53":"/en-US/guide/chart-api#utils-clone-target","54":"/en-US/guide/chart-api#utils-merge-target-source","55":"/en-US/guide/chart-api#utils-isstring-value","56":"/en-US/guide/chart-api#utils-isnumber-value","57":"/en-US/guide/chart-api#utils-isvalid-value","58":"/en-US/guide/chart-api#utils-isobject-value","59":"/en-US/guide/chart-api#utils-isfunction-value","60":"/en-US/guide/chart-api#utils-isboolean-value","61":"/en-US/guide/chart-api#utils-formatvalue-value-key-defaultvalue","62":"/en-US/guide/chart-api#utils-formatprecision-value","63":"/en-US/guide/chart-api#utils-formatbignumber-value","64":"/en-US/guide/chart-api#utils-formatdate-datetimeformat-timestamp-format","65":"/en-US/guide/chart-api#utils-formatthousands-value-sign","66":"/en-US/guide/chart-api#utils-formatfolddecimal-value-threshold-9-8-0","67":"/en-US/guide/chart-api#utils-calctextwidth-text-size-weight-family-9-3-0","68":"/en-US/guide/chart-api#utils-getlinearslopeintercept-coordinate1-coordinate2","69":"/en-US/guide/chart-api#utils-getlinearyfromcoordinates-coordinate1-coordinate2-targetcoordinate","70":"/en-US/guide/chart-api#utils-getlinearyfromslopeintercept-kb-targetcoordinate","71":"/en-US/guide/chart-api#utils-checkcoordinateonarc-coordinate-arc","72":"/en-US/guide/chart-api#utils-checkcoordinateoncircle-coordinate-circle","73":"/en-US/guide/chart-api#utils-checkcoordinateonline-coordinate-line","74":"/en-US/guide/chart-api#utils-checkcoordinateonpolygon-coordinate-polygon","75":"/en-US/guide/chart-api#utils-checkcoordinateonrect-coordinate-rect","76":"/en-US/guide/chart-api#utils-checkcoordinateontext-coordinate-text-styles","77":"/en-US/guide/chart-api#utils-drawarc-ctx-arc-styles","78":"/en-US/guide/chart-api#utils-drawcircle-ctx-circle-styles","79":"/en-US/guide/chart-api#utils-drawline-ctx-line-styles","80":"/en-US/guide/chart-api#utils-drawpolygon-ctx-polygon-styles","81":"/en-US/guide/chart-api#utils-drawrect-ctx-rect-styles","82":"/en-US/guide/chart-api#utils-drawrecttext-ctx-recttext-styles","83":"/en-US/guide/chart-api#utils-drawrecttext-ctx-recttext-styles-1","84":"/en-US/guide/custom-axis#custom-axis-9-8-0","85":"/en-US/guide/custom-axis#input-params-introduction","86":"/en-US/guide/custom-axis#usage","87":"/en-US/guide/custom-axis#using-init-of-chart-api","88":"/en-US/guide/custom-axis#using-createindicator-of-instance-api","89":"/en-US/guide/custom-axis#using-setpaneoptions-of-instance-api","90":"/en-US/guide/data-source#📚-data","91":"/en-US/guide/environment#🏝️-environment","92":"/en-US/guide/environment#browser-support","93":"/en-US/guide/environment#polyfill","94":"/en-US/guide/figure#figure","95":"/en-US/guide/figure#example-of-use","96":"/en-US/guide/figure#built-in-figures","97":"/en-US/guide/figure#arc","98":"/en-US/guide/figure#circle","99":"/en-US/guide/figure#line","100":"/en-US/guide/figure#rect","101":"/en-US/guide/figure#text","102":"/en-US/guide/figure#recttext","103":"/en-US/guide/figure#customize-figure","104":"/en-US/guide/figure#attribute-description","105":"/en-US/guide/figure#example","106":"/en-US/guide/figure#step-1","107":"/en-US/guide/figure#step-2","108":"/en-US/guide/hot-key#⌨️-hot-key","109":"/en-US/guide/i18n#🌏-internationalization","110":"/en-US/guide/i18n#adding-new-language","111":"/en-US/guide/i18n#use-new-language","112":"/en-US/guide/indicator#technical-indicator","113":"/en-US/guide/indicator#built-in-technical-indicators","114":"/en-US/guide/indicator#custom-technical-indicators","115":"/en-US/guide/indicator#attribute-description","116":"/en-US/guide/indicator#step-1","117":"/en-US/guide/indicator#step-2","118":"/en-US/guide/instance-api#instance-api","119":"/en-US/guide/instance-api#getdom-paneid-position","120":"/en-US/guide/instance-api#getsize-paneid-position","121":"/en-US/guide/instance-api#setstyles-styles","122":"/en-US/guide/instance-api#getstyles","123":"/en-US/guide/instance-api#setpricevolumeprecision-priceprecision-volumeprecision","124":"/en-US/guide/instance-api#settimezone-timezone","125":"/en-US/guide/instance-api#gettimezone","126":"/en-US/guide/instance-api#setzoomenabled-enabled","127":"/en-US/guide/instance-api#iszoomenabled","128":"/en-US/guide/instance-api#setscrollenabled-enabled","129":"/en-US/guide/instance-api#isscrollenabled","130":"/en-US/guide/instance-api#setoffsetrightdistance-distance","131":"/en-US/guide/instance-api#getoffsetrightdistance-9-2-0","132":"/en-US/guide/instance-api#setmaxoffsetleftdistance-9-7-0","133":"/en-US/guide/instance-api#setmaxoffsetrightdistance-9-7-0","134":"/en-US/guide/instance-api#setleftminvisiblebarcount-barcount","135":"/en-US/guide/instance-api#setrightminvisiblebarcount-barcount","136":"/en-US/guide/instance-api#setbarspace-space","137":"/en-US/guide/instance-api#getbarspace","138":"/en-US/guide/instance-api#getvisiblerange","139":"/en-US/guide/instance-api#applynewdata-datalist-more-callback","140":"/en-US/guide/instance-api#applymoredata-datalist-more-callback","141":"/en-US/guide/instance-api#updatedata-data-callback","142":"/en-US/guide/instance-api#getdatalist","143":"/en-US/guide/instance-api#cleardata","144":"/en-US/guide/instance-api#loadmore-cb","145":"/en-US/guide/instance-api#setloaddatacallback-cb-9-8-0","146":"/en-US/guide/instance-api#createindicator-value-isstack-paneoptions-callback","147":"/en-US/guide/instance-api#overrideindicator-override-paneid-callback","148":"/en-US/guide/instance-api#getindicatorbypaneid-paneid-name","149":"/en-US/guide/instance-api#removeindicator-paneid-name","150":"/en-US/guide/instance-api#createoverlay-value-paneid","151":"/en-US/guide/instance-api#getoverlaybyid-id","152":"/en-US/guide/instance-api#overrideoverlay-override","153":"/en-US/guide/instance-api#removeoverlay-remove","154":"/en-US/guide/instance-api#scrollbydistance-distance-animationduration","155":"/en-US/guide/instance-api#scrolltorealtime-animationduration","156":"/en-US/guide/instance-api#scrolltodataindex-dataindex-animationduration","157":"/en-US/guide/instance-api#scrolltotimestamp-timestamp-animationduration","158":"/en-US/guide/instance-api#zoomatcoordinate-scale-coordinate-animationduration","159":"/en-US/guide/instance-api#zoomatdataindex-scale-dataindex-animationduration","160":"/en-US/guide/instance-api#zoomattimestamp-scale-timestamp-animationduration","161":"/en-US/guide/instance-api#setpaneoptions-options","162":"/en-US/guide/instance-api#executeaction-type-data-9-2-0","163":"/en-US/guide/instance-api#subscribeaction-type-callback","164":"/en-US/guide/instance-api#unsubscribeaction-type-callback","165":"/en-US/guide/instance-api#converttopixel-value-finder","166":"/en-US/guide/instance-api#convertfrompixel-coordinate-finder","167":"/en-US/guide/instance-api#getconvertpictureurl-includeoverlay-type-backgroundcolor","168":"/en-US/guide/instance-api#resize","169":"/en-US/guide/introduction#📃-introduction","170":"/en-US/guide/introduction#what-s-klinechart","171":"/en-US/guide/introduction#features","172":"/en-US/guide/overlay#overlay","173":"/en-US/guide/overlay#built-in-overlay-types","174":"/en-US/guide/overlay#custom-overlays","175":"/en-US/guide/overlay#attribute-description","176":"/en-US/guide/overlay#example","177":"/en-US/guide/quick-start#🚀-quick-start","178":"/en-US/guide/quick-start#get-klinechart","179":"/en-US/guide/quick-start#create-the-first-chart","180":"/en-US/guide/styles#🎨-style","181":"/en-US/guide/styles#picture-explanation","182":"/en-US/guide/styles#default-full-configuration","183":"/en-US/guide/v8-to-v9#🛠️-from-v8-to-v9","184":"/en-US/guide/v8-to-v9#import-adjustment","185":"/en-US/guide/v8-to-v9#design-adjustment","186":"/en-US/guide/v8-to-v9#style-configuration-adjustment","187":"/en-US/guide/v8-to-v9#api-adjustment","188":"/en-US/guide/v8-to-v9#chart-api","189":"/en-US/guide/v8-to-v9#instance-api","190":"/en-US/guide/v8-to-v9#shape-help-api","191":"/en-US/guide/v8-to-v9#customized-technical-indicator-adjustment","192":"/en-US/more/feedback#💬-feedback","193":"/en-US/more/feedback#github","194":"/en-US/more/feedback#telegram","195":"/en-US/more/feedback#wechat-discussion-group","196":"/en-US/more/local-development#local-development","197":"/en-US/more/local-development#introduction","198":"/en-US/more/local-development#notice","199":"/en-US/more/local-development#file-directory-description","200":"/en-US/more/local-development#module-dependencies","201":"/en-US/more/local-development#development","202":"/en-US/more/local-development#installation-dependencies","203":"/en-US/more/local-development#npm-execute-command-description","204":"/en-US/more/local-development#debug","205":"/en-US/more/faq#🙋-faq","206":"/en-US/more/faq#after-the-chart-is-initialized-only-one-line-can-be-seen","207":"/en-US/more/faq#the-candle-shows-a-line-no-fluctuation-what-to-do","208":"/en-US/more/faq#how-to-create-a-real-time-chart","209":"/en-US/more/faq#built-in-technical-indicators-calculated-data-is-not-what-you-want-how-to-do","210":"/en-US/more/faq#what-if-i-want-to-create-an-indicator-other-than-the-built-in-technical-indicator","211":"/en-US/more/faq#want-to-mark-the-point-of-sale-how-should-do","212":"/en-US/sample/axis#axis","213":"/en-US/sample/basic#basic","214":"/en-US/sample/candle-type#candle-type","215":"/en-US/sample/data#data","216":"/en-US/sample/i18n#i18n","217":"/en-US/sample/indicator#indicator","218":"/en-US/sample/overlay#overlay","219":"/en-US/sample/theme#theme","220":"/en-US/sample/timezone#timezone","221":"/en-US/sample/tooltip#tooltip","222":"/en-US/sponsor#❤️-sponsor","223":"/en-US/sponsor#sponsor-channels","224":"/en-US/sponsor#alipay","225":"/en-US/sponsor#wechat-pay","226":"/en-US/sponsor#cryptocurrency"},"fieldIds":{"title":0,"titles":1,"text":2},"fieldLength":{"0":[3,1,1],"1":[3,3,49],"2":[2,3,16],"3":[2,3,33],"4":[3,3,16],"5":[3,3,38],"6":[3,3,22],"7":[3,3,40],"8":[3,3,27],"9":[3,3,40],"10":[3,3,49],"11":[3,3,19],"12":[3,3,28],"13":[3,3,54],"14":[3,3,25],"15":[3,3,9],"16":[3,3,27],"17":[3,3,29],"18":[3,3,48],"19":[3,3,27],"20":[3,3,40],"21":[2,3,14],"22":[3,3,19],"23":[3,3,52],"24":[3,3,52],"25":[3,3,34],"26":[2,3,17],"27":[3,3,29],"28":[3,3,10],"29":[2,3,160],"30":[2,3,11],"31":[2,3,11],"32":[2,3,11],"33":[2,3,10],"34":[2,3,10],"35":[2,1,1],"36":[4,2,130],"37":[3,2,26],"38":[4,2,28],"39":[2,2,14],"40":[2,2,12],"41":[4,2,19],"42":[3,2,36],"43":[2,2,11],"44":[3,2,9],"45":[3,2,109],"46":[2,2,10],"47":[3,2,126],"48":[2,2,9],"49":[5,2,24],"50":[5,2,24],"51":[2,2,11],"52":[1,2,6],"53":[4,3,7],"54":[5,3,11],"55":[4,3,11],"56":[4,3,11],"57":[4,3,11],"58":[4,3,12],"59":[4,3,11],"60":[4,3,11],"61":[6,3,28],"62":[4,3,9],"63":[4,3,18],"64":[6,3,20],"65":[5,3,11],"66":[7,3,11],"67":[9,3,12],"68":[5,3,29],"69":[6,3,24],"70":[5,3,26],"71":[5,3,31],"72":[5,3,25],"73":[5,3,21],"74":[5,3,20],"75":[5,3,24],"76":[6,3,48],"77":[6,3,39],"78":[6,3,41],"79":[6,3,31],"80":[6,3,38],"81":[6,3,44],"82":[6,3,68],"83":[6,3,20],"84":[5,1,16],"85":[3,5,37],"86":[1,5,35],"87":[5,6,32],"88":[5,6,19],"89":[5,6,20],"90":[2,1,55],"91":[2,1,1],"92":[2,2,26],"93":[1,2,1],"94":[1,1,49],"95":[3,1,38],"96":[3,1,15],"97":[1,4,38],"98":[1,4,42],"99":[1,4,42],"100":[1,4,46],"101":[1,4,71],"102":[1,4,16],"103":[2,1,27],"104":[2,3,43],"105":[1,3,14],"106":[2,4,46],"107":[2,4,62],"108":[3,1,17],"109":[2,1,28],"110":[3,2,40],"111":[3,2,18],"112":[2,1,16],"113":[4,2,50],"114":[3,2,27],"115":[2,4,231],"116":[2,6,54],"117":[2,6,105],"118":[2,1,1],"119":[4,2,22],"120":[4,2,28],"121":[3,2,31],"122":[2,2,14],"123":[4,2,23],"124":[3,2,29],"125":[2,2,10],"126":[3,2,10],"127":[2,2,9],"128":[3,2,13],"129":[2,2,10],"130":[3,2,17],"131":[4,2,15],"132":[4,2,16],"133":[4,2,16],"134":[3,2,14],"135":[3,2,14],"136":[3,2,14],"137":[2,2,13],"138":[2,2,11],"139":[5,2,72],"140":[5,2,58],"141":[4,2,60],"142":[2,2,27],"143":[2,2,29],"144":[3,2,36],"145":[5,2,29],"146":[6,2,159],"147":[5,2,166],"148":[4,2,38],"149":[4,2,33],"150":[4,2,104],"151":[3,2,17],"152":[3,2,146],"153":[3,2,22],"154":[4,2,17],"155":[3,2,18],"156":[4,2,22],"157":[4,2,18],"158":[5,2,32],"159":[5,2,26],"160":[5,2,21],"161":[3,2,62],"162":[6,2,16],"163":[4,2,27],"164":[4,2,35],"165":[4,2,53],"166":[4,2,41],"167":[5,2,39],"168":[2,2,30],"169":[2,1,1],"170":[4,2,11],"171":[1,2,67],"172":[1,1,15],"173":[4,1,16],"174":[2,1,19],"175":[2,3,263],"176":[1,3,85],"177":[3,1,1],"178":[2,3,77],"179":[4,3,190],"180":[2,1,26],"181":[2,2,1],"182":[3,2,226],"183":[5,1,23],"184":[2,5,15],"185":[2,5,13],"186":[3,5,46],"187":[2,5,1],"188":[2,7,14],"189":[2,7,89],"190":[3,7,8],"191":[4,5,55],"192":[2,1,1],"193":[1,2,10],"194":[1,2,5],"195":[3,2,13],"196":[2,1,1],"197":[1,2,19],"198":[1,2,1],"199":[3,3,1],"200":[2,3,76],"201":[1,2,1],"202":[2,2,28],"203":[4,2,29],"204":[1,2,26],"205":[2,1,1],"206":[12,2,13],"207":[11,2,15],"208":[8,2,9],"209":[15,2,12],"210":[15,2,9],"211":[11,2,21],"212":[1,1,174],"213":[1,1,64],"214":[2,1,154],"215":[1,1,79],"216":[1,1,153],"217":[1,1,204],"218":[1,1,170],"219":[1,1,195],"220":[1,1,145],"221":[1,1,179],"222":[2,1,80],"223":[2,2,1],"224":[1,3,1],"225":[2,3,1],"226":[1,3,9]},"averageFieldLength":[3.2863436123348015,2.5110132158590313,38.44493392070485],"storedFields":{"0":{"title":"📠 Change Log","titles":[]},"1":{"title":"9.8.10","titles":["📠 Change Log"]},"2":{"title":"9.8.9","titles":["📠 Change Log"]},"3":{"title":"9.8.8","titles":["📠 Change Log"]},"4":{"title":"9.8.7","titles":["📠 Change Log"]},"5":{"title":"9.8.6","titles":["📠 Change Log"]},"6":{"title":"9.8.5","titles":["📠 Change Log"]},"7":{"title":"9.8.3","titles":["📠 Change Log"]},"8":{"title":"9.8.2","titles":["📠 Change Log"]},"9":{"title":"9.8.1","titles":["📠 Change Log"]},"10":{"title":"9.8.0","titles":["📠 Change Log"]},"11":{"title":"9.7.1","titles":["📠 Change Log"]},"12":{"title":"9.7.0","titles":["📠 Change Log"]},"13":{"title":"9.6.0","titles":["📠 Change Log"]},"14":{"title":"9.5.4","titles":["📠 Change Log"]},"15":{"title":"9.5.3","titles":["📠 Change Log"]},"16":{"title":"9.5.2","titles":["📠 Change Log"]},"17":{"title":"9.5.1","titles":["📠 Change Log"]},"18":{"title":"9.5.0","titles":["📠 Change Log"]},"19":{"title":"9.4.0","titles":["📠 Change Log"]},"20":{"title":"9.3.0","titles":["📠 Change Log"]},"21":{"title":"9.2.2","titles":["📠 Change Log"]},"22":{"title":"9.2.1","titles":["📠 Change Log"]},"23":{"title":"9.2.0","titles":["📠 Change Log"]},"24":{"title":"9.1.3","titles":["📠 Change Log"]},"25":{"title":"9.1.2","titles":["📠 Change Log"]},"26":{"title":"9.1.1","titles":["📠 Change Log"]},"27":{"title":"9.1.0","titles":["📠 Change Log"]},"28":{"title":"9.0.1","titles":["📠 Change Log"]},"29":{"title":"9.0.0","titles":["📠 Change Log"]},"30":{"title":"8.x","titles":["📠 Change Log"]},"31":{"title":"7.x","titles":["📠 Change Log"]},"32":{"title":"6.x","titles":["📠 Change Log"]},"33":{"title":"5.x","titles":["📠 Change Log"]},"34":{"title":"4.x","titles":["📠 Change Log"]},"35":{"title":"Chart API","titles":[]},"36":{"title":"init(ds, options)","titles":["Chart API"]},"37":{"title":"dispose(dcs)","titles":["Chart API"]},"38":{"title":"registerLocale(locale, locales)","titles":["Chart API"]},"39":{"title":"getOverlayClass()","titles":["Chart API"]},"40":{"title":"getSupportedLocales()","titles":["Chart API"]},"41":{"title":"registerStyles(name, styles)","titles":["Chart API"]},"42":{"title":"registerFigure(figure)","titles":["Chart API"]},"43":{"title":"getSupportedFigures()","titles":["Chart API"]},"44":{"title":"getFigureClass(name)","titles":["Chart API"]},"45":{"title":"registerIndicator(indicator)","titles":["Chart API"]},"46":{"title":"getSupportedIndicators()","titles":["Chart API"]},"47":{"title":"registerOverlay(overlay)","titles":["Chart API"]},"48":{"title":"getSupportedOverlays()","titles":["Chart API"]},"49":{"title":"registerXAxis(axis) ^9.8.0","titles":["Chart API"]},"50":{"title":"registerYAxis(axis) ^9.8.0","titles":["Chart API"]},"51":{"title":"version()","titles":["Chart API"]},"52":{"title":"utils","titles":["Chart API"]},"53":{"title":"utils.clone(target)","titles":["Chart API","utils"]},"54":{"title":"utils.merge(target, source)","titles":["Chart API","utils"]},"55":{"title":"utils.isString(value)","titles":["Chart API","utils"]},"56":{"title":"utils.isNumber(value)","titles":["Chart API","utils"]},"57":{"title":"utils.isValid(value)","titles":["Chart API","utils"]},"58":{"title":"utils.isObject(value)","titles":["Chart API","utils"]},"59":{"title":"utils.isFunction(value)","titles":["Chart API","utils"]},"60":{"title":"utils.isBoolean(value)","titles":["Chart API","utils"]},"61":{"title":"utils.formatValue(value, key, defaultValue)","titles":["Chart API","utils"]},"62":{"title":"utils.formatPrecision(value)","titles":["Chart API","utils"]},"63":{"title":"utils.formatBigNumber(value)","titles":["Chart API","utils"]},"64":{"title":"utils.formatDate(dateTimeFormat, timestamp, format)","titles":["Chart API","utils"]},"65":{"title":"utils.formatThousands(value, sign)","titles":["Chart API","utils"]},"66":{"title":"utils.formatFoldDecimal(value, threshold) ^9.8.0","titles":["Chart API","utils"]},"67":{"title":"utils.calcTextWidth(text, size, weight, family) ^9.3.0","titles":["Chart API","utils"]},"68":{"title":"utils.getLinearSlopeIntercept(coordinate1, coordinate2)","titles":["Chart API","utils"]},"69":{"title":"utils.getLinearYFromCoordinates(coordinate1, coordinate2, targetCoordinate)","titles":["Chart API","utils"]},"70":{"title":"utils.getLinearYFromSlopeIntercept(kb, targetCoordinate)","titles":["Chart API","utils"]},"71":{"title":"utils.checkCoordinateOnArc(coordinate, arc)","titles":["Chart API","utils"]},"72":{"title":"utils.checkCoordinateOnCircle(coordinate, circle)","titles":["Chart API","utils"]},"73":{"title":"utils.checkCoordinateOnLine(coordinate, line)","titles":["Chart API","utils"]},"74":{"title":"utils.checkCoordinateOnPolygon(coordinate, polygon)","titles":["Chart API","utils"]},"75":{"title":"utils.checkCoordinateOnRect(coordinate, rect)","titles":["Chart API","utils"]},"76":{"title":"utils.checkCoordinateOnText(coordinate, text, styles)","titles":["Chart API","utils"]},"77":{"title":"utils.drawArc(ctx, arc, styles)","titles":["Chart API","utils"]},"78":{"title":"utils.drawCircle(ctx, circle, styles)","titles":["Chart API","utils"]},"79":{"title":"utils.drawLine(ctx, line, styles)","titles":["Chart API","utils"]},"80":{"title":"utils.drawPolygon(ctx, polygon, styles)","titles":["Chart API","utils"]},"81":{"title":"utils.drawRect(ctx, rect, styles)","titles":["Chart API","utils"]},"82":{"title":"utils.drawRectText(ctx, rectText, styles)","titles":["Chart API","utils"]},"83":{"title":"utils.drawRectText(ctx, rectText, styles)","titles":["Chart API","utils"]},"84":{"title":"Custom Axis ^9.8.0","titles":[]},"85":{"title":"Input params introduction","titles":["Custom Axis ^9.8.0"]},"86":{"title":"Usage","titles":["Custom Axis ^9.8.0"]},"87":{"title":"Using init of chart api","titles":["Custom Axis ^9.8.0","Usage"]},"88":{"title":"Using createIndicator of instance api","titles":["Custom Axis ^9.8.0","Usage"]},"89":{"title":"Using setPaneOptions of instance api","titles":["Custom Axis ^9.8.0","Usage"]},"90":{"title":"📚 Data","titles":[]},"91":{"title":"🏝️ Environment","titles":[]},"92":{"title":"Browser support","titles":["🏝️ Environment"]},"93":{"title":"Polyfill","titles":["🏝️ Environment"]},"94":{"title":"Figure","titles":[]},"95":{"title":"Example of use","titles":["Figure"]},"96":{"title":"Built-in figures","titles":["Figure"]},"97":{"title":"arc","titles":["Figure","Built-in figures"]},"98":{"title":"circle","titles":["Figure","Built-in figures"]},"99":{"title":"line","titles":["Figure","Built-in figures"]},"100":{"title":"rect","titles":["Figure","Built-in figures"]},"101":{"title":"text","titles":["Figure","Built-in figures"]},"102":{"title":"rectText","titles":["Figure","Built-in figures"]},"103":{"title":"Customize figure","titles":["Figure"]},"104":{"title":"Attribute description","titles":["Figure","Customize figure"]},"105":{"title":"Example","titles":["Figure","Customize figure"]},"106":{"title":"Step.1","titles":["Figure","Customize figure","Example"]},"107":{"title":"Step.2","titles":["Figure","Customize figure","Example"]},"108":{"title":"⌨️ Hot Key","titles":[]},"109":{"title":"🌏 Internationalization","titles":[]},"110":{"title":"Adding new language","titles":["🌏 Internationalization"]},"111":{"title":"Use new language","titles":["🌏 Internationalization"]},"112":{"title":"Technical indicator","titles":[]},"113":{"title":"Built-in technical indicators","titles":["Technical indicator"]},"114":{"title":"Custom Technical Indicators","titles":["Technical indicator"]},"115":{"title":"Attribute description","titles":["Technical indicator","Custom Technical Indicators"]},"116":{"title":"Step.1","titles":["Technical indicator","Custom Technical Indicators","Attribute description"]},"117":{"title":"Step.2","titles":["Technical indicator","Custom Technical Indicators","Attribute description"]},"118":{"title":"Instance API","titles":[]},"119":{"title":"getDom(paneId, position)","titles":["Instance API"]},"120":{"title":"getSize(paneId, position)","titles":["Instance API"]},"121":{"title":"setStyles(styles)","titles":["Instance API"]},"122":{"title":"getStyles()","titles":["Instance API"]},"123":{"title":"setPriceVolumePrecision(pricePrecision, volumePrecision)","titles":["Instance API"]},"124":{"title":"setTimezone(timezone)","titles":["Instance API"]},"125":{"title":"getTimezone()","titles":["Instance API"]},"126":{"title":"setZoomEnabled(enabled)","titles":["Instance API"]},"127":{"title":"isZoomEnabled()","titles":["Instance API"]},"128":{"title":"setScrollEnabled(enabled)","titles":["Instance API"]},"129":{"title":"isScrollEnabled()","titles":["Instance API"]},"130":{"title":"setOffsetRightDistance(distance)","titles":["Instance API"]},"131":{"title":"getOffsetRightDistance() ^9.2.0","titles":["Instance API"]},"132":{"title":"setMaxOffsetLeftDistance() ^9.7.0","titles":["Instance API"]},"133":{"title":"setMaxOffsetRightDistance() ^9.7.0","titles":["Instance API"]},"134":{"title":"setLeftMinVisibleBarCount(barCount)","titles":["Instance API"]},"135":{"title":"setRightMinVisibleBarCount(barCount)","titles":["Instance API"]},"136":{"title":"setBarSpace(space)","titles":["Instance API"]},"137":{"title":"getBarSpace()","titles":["Instance API"]},"138":{"title":"getVisibleRange()","titles":["Instance API"]},"139":{"title":"applyNewData(dataList, more, callback)","titles":["Instance API"]},"140":{"title":"applyMoreData(dataList, more, callback)","titles":["Instance API"]},"141":{"title":"updateData(data, callback)","titles":["Instance API"]},"142":{"title":"getDataList()","titles":["Instance API"]},"143":{"title":"clearData()","titles":["Instance API"]},"144":{"title":"loadMore(cb)","titles":["Instance API"]},"145":{"title":"setLoadDataCallback(cb) ^9.8.0","titles":["Instance API"]},"146":{"title":"createIndicator(value, isStack, paneOptions, callback)","titles":["Instance API"]},"147":{"title":"overrideIndicator(override, paneId, callback)","titles":["Instance API"]},"148":{"title":"getIndicatorByPaneId(paneId, name)","titles":["Instance API"]},"149":{"title":"removeIndicator(paneId, name)","titles":["Instance API"]},"150":{"title":"createOverlay(value, paneId)","titles":["Instance API"]},"151":{"title":"getOverlayById(id)","titles":["Instance API"]},"152":{"title":"overrideOverlay(override)","titles":["Instance API"]},"153":{"title":"removeOverlay(remove)","titles":["Instance API"]},"154":{"title":"scrollByDistance(distance, animationDuration)","titles":["Instance API"]},"155":{"title":"scrollToRealTime(animationDuration)","titles":["Instance API"]},"156":{"title":"scrollToDataIndex(dataIndex, animationDuration)","titles":["Instance API"]},"157":{"title":"scrollToTimestamp(timestamp, animationDuration)","titles":["Instance API"]},"158":{"title":"zoomAtCoordinate(scale, coordinate, animationDuration)","titles":["Instance API"]},"159":{"title":"zoomAtDataIndex(scale, dataIndex, animationDuration)","titles":["Instance API"]},"160":{"title":"zoomAtTimestamp(scale, timestamp, animationDuration)","titles":["Instance API"]},"161":{"title":"setPaneOptions(options)","titles":["Instance API"]},"162":{"title":"executeAction(type, data) ^9.2.0","titles":["Instance API"]},"163":{"title":"subscribeAction(type, callback)","titles":["Instance API"]},"164":{"title":"unsubscribeAction(type, callback)","titles":["Instance API"]},"165":{"title":"convertToPixel(value, finder)","titles":["Instance API"]},"166":{"title":"convertFromPixel(coordinate, finder)","titles":["Instance API"]},"167":{"title":"getConvertPictureUrl(includeOverlay, type, backgroundColor)","titles":["Instance API"]},"168":{"title":"resize()","titles":["Instance API"]},"169":{"title":"📃 Introduction","titles":[]},"170":{"title":"What\'s KLineChart?","titles":["📃 Introduction"]},"171":{"title":"Features","titles":["📃 Introduction"]},"172":{"title":"Overlay","titles":[]},"173":{"title":"Built-in overlay types","titles":["Overlay"]},"174":{"title":"Custom overlays","titles":["Overlay"]},"175":{"title":"Attribute description","titles":["Overlay","Custom overlays"]},"176":{"title":"Example","titles":["Overlay","Custom overlays"]},"177":{"title":"🚀 Quick Start","titles":[]},"178":{"title":"Get KLineChart","titles":["🚀 Quick Start"]},"179":{"title":"Create the first chart","titles":["🚀 Quick Start"]},"180":{"title":"🎨 Style","titles":[]},"181":{"title":"Picture explanation","titles":["🎨 Style"]},"182":{"title":"Default full configuration","titles":["🎨 Style"]},"183":{"title":"🛠️ From V8 to V9","titles":[]},"184":{"title":"Import adjustment","titles":["🛠️ From V8 to V9"]},"185":{"title":"Design adjustment","titles":["🛠️ From V8 to V9"]},"186":{"title":"Style configuration adjustment","titles":["🛠️ From V8 to V9"]},"187":{"title":"API adjustment","titles":["🛠️ From V8 to V9"]},"188":{"title":"Chart API","titles":["🛠️ From V8 to V9","API adjustment"]},"189":{"title":"Instance API","titles":["🛠️ From V8 to V9","API adjustment"]},"190":{"title":"Shape help API","titles":["🛠️ From V8 to V9","API adjustment"]},"191":{"title":"Customized technical indicator adjustment","titles":["🛠️ From V8 to V9"]},"192":{"title":"💬 Feedback","titles":[]},"193":{"title":"Github","titles":["💬 Feedback"]},"194":{"title":"Telegram","titles":["💬 Feedback"]},"195":{"title":"Wechat discussion group","titles":["💬 Feedback"]},"196":{"title":"Local Development","titles":[]},"197":{"title":"Introduction","titles":["Local Development"]},"198":{"title":"Notice","titles":["Local Development"]},"199":{"title":"File directory description","titles":["Local Development","Notice"]},"200":{"title":"Module dependencies","titles":["Local Development","Notice"]},"201":{"title":"Development","titles":["Local Development"]},"202":{"title":"Installation dependencies","titles":["Local Development","Development"]},"203":{"title":"NPM Execute command description","titles":["Local Development","Development"]},"204":{"title":"Debug","titles":["Local Development","Development"]},"205":{"title":"🙋 FAQ","titles":[]},"206":{"title":"After the chart is initialized, only one line can be seen?","titles":["🙋 FAQ"]},"207":{"title":"The candle shows a line, no fluctuation, what to do?","titles":["🙋 FAQ"]},"208":{"title":"How to create a real-time chart?","titles":["🙋 FAQ"]},"209":{"title":"Built-in technical indicators, calculated data is not what you want, how to do?","titles":["🙋 FAQ"]},"210":{"title":"What if I want to create an indicator other than the built-in technical indicator?","titles":["🙋 FAQ"]},"211":{"title":"Want to mark the point of sale, how should do?","titles":["🙋 FAQ"]},"212":{"title":"Axis","titles":[]},"213":{"title":"Basic","titles":[]},"214":{"title":"Candle Type","titles":[]},"215":{"title":"Data","titles":[]},"216":{"title":"I18n","titles":[]},"217":{"title":"Indicator","titles":[]},"218":{"title":"Overlay","titles":[]},"219":{"title":"Theme","titles":[]},"220":{"title":"Timezone","titles":[]},"221":{"title":"Tooltip","titles":[]},"222":{"title":"❤️ Sponsor","titles":[]},"223":{"title":"Sponsor Channels","titles":["❤️ Sponsor"]},"224":{"title":"Alipay","titles":["❤️ Sponsor","Sponsor Channels"]},"225":{"title":"Wechat Pay","titles":["❤️ Sponsor","Sponsor Channels"]},"226":{"title":"Cryptocurrency","titles":["❤️ Sponsor","Sponsor Channels"]}},"dirtCount":0,"index":[["☕️",{"2":{"222":1}}],["❤️",{"0":{"222":1},"1":{"223":1,"224":1,"225":1,"226":1}}],["指标信息提示",{"2":{"221":1}}],["基础信息提示",{"2":{"221":1}}],["矩形框",{"2":{"221":1}}],["默认",{"2":{"221":1}}],["不显示",{"2":{"221":1}}],["跟随十字光标",{"2":{"221":1}}],["总是显示",{"2":{"221":1}}],["芝加哥",{"2":{"220":1}}],["柏林",{"2":{"220":1}}],["上海",{"2":{"220":1}}],["红涨绿跌",{"2":{"219":1}}],["绿涨红跌",{"2":{"219":1}}],["深色",{"2":{"219":1}}],["浅色",{"2":{"219":1}}],["自定义",{"2":{"218":1}}],["圆",{"2":{"218":1}}],["内置",{"2":{"218":1}}],["内部",{"2":{"212":1}}],["价格线",{"2":{"218":1}}],["副图指标",{"2":{"217":1}}],["主图指标",{"2":{"217":1}}],["🥑",{"2":{"217":1}}],["🥭",{"2":{"217":1}}],["🥝",{"2":{"217":1}}],["🥥",{"2":{"217":1}}],["繁体中文",{"2":{"216":1}}],["简体中文",{"2":{"216":1}}],["面积图",{"2":{"214":1}}],["跌空心",{"2":{"214":1}}],["涨空心",{"2":{"214":1}}],["全空心",{"2":{"214":1}}],["全实心",{"2":{"214":1}}],["反向",{"2":{"212":1}}],["正向",{"2":{"212":1}}],["对数轴",{"2":{"212":1}}],["百分比轴",{"2":{"212":1}}],["线性轴",{"2":{"212":1}}],["外部",{"2":{"212":1}}],["左侧",{"2":{"212":1}}],["右侧",{"2":{"212":1}}],["在实际项目中根据情况进行调整",{"2":{"212":1,"214":1,"216":1,"217":1,"218":1,"219":1,"220":1,"221":1}}],["以下仅仅是为了协助代码演示",{"2":{"212":1,"214":1,"216":1,"217":1,"218":1,"219":1,"220":1,"221":1}}],["销毁图表",{"2":{"179":1}}],["quick",{"0":{"177":1},"1":{"178":1,"179":1},"2":{"179":2}}],["quantity",{"2":{"175":1}}],["j++",{"2":{"212":1,"213":1,"214":1,"215":1,"216":1,"217":1,"218":1,"219":1,"220":1,"221":1}}],["join",{"2":{"195":1}}],["jsimport",{"2":{"212":1,"213":1,"214":1,"215":1,"216":1,"217":1,"218":1,"219":1,"220":1,"221":1}}],["jsximport",{"2":{"179":1}}],["js",{"2":{"178":1,"179":2,"202":2}}],["jsdelivr",{"2":{"178":1,"179":1}}],["just",{"2":{"178":1}}],["jpeg",{"2":{"167":2}}],["j",{"2":{"117":6,"212":2,"213":2,"214":2,"215":2,"216":2,"217":2,"218":2,"219":2,"220":2,"221":2}}],["javascripthtml",{"2":{"213":1,"215":1}}],["javascripthtmlcss",{"2":{"212":1,"214":1,"216":1,"217":1,"218":1,"219":1,"220":1,"221":1}}],["javascriptchart",{"2":{"146":1,"147":1,"150":1,"152":1,"161":1,"208":1}}],["javascript",{"2":{"95":1,"107":1,"116":1,"117":1,"175":1,"176":1,"178":1,"179":1,"182":1}}],["漲幅",{"2":{"110":1}}],["成交額",{"2":{"110":1}}],["成交量",{"2":{"110":1,"216":1}}],["收",{"2":{"110":1,"216":1}}],["低",{"2":{"110":1,"216":1}}],["高",{"2":{"110":1,"216":1}}],["開",{"2":{"110":1,"216":1}}],["時間",{"2":{"110":1,"216":1}}],["←",{"2":{"108":1}}],["→",{"2":{"108":1}}],["⌨️",{"0":{"108":1}}],["🌟",{"2":{"222":1}}],["🍍",{"2":{"217":1}}],["🍑",{"2":{"217":1}}],["🍒",{"2":{"217":1}}],["🍈",{"2":{"217":1}}],["🍓",{"2":{"217":1}}],["🍇",{"2":{"217":1}}],["🍉",{"2":{"217":1}}],["🍌",{"2":{"217":1}}],["🍋",{"2":{"217":1}}],["🍊",{"2":{"217":1}}],["🍐",{"2":{"217":1}}],["🍎",{"2":{"217":1}}],["🍏",{"2":{"217":2}}],["🎨",{"0":{"180":1},"1":{"181":1,"182":1},"2":{"171":1}}],["🌏",{"0":{"109":1},"1":{"110":1,"111":1}}],["🏝️",{"0":{"91":1},"1":{"92":1,"93":1}}],["🆕",{"2":{"10":4,"12":2,"13":3,"17":2,"18":2,"19":3,"20":3,"23":5,"27":2,"29":1}}],["`performeventmovefordrawing`",{"2":{"175":1}}],["`createpointfigures`",{"2":{"175":2}}],["`weak",{"2":{"175":1}}],["`normal`",{"2":{"175":1}}],["`ma$",{"2":{"117":2}}],["`strong",{"2":{"175":1}}],["`stroke",{"2":{"98":1,"99":1,"100":1,"101":1}}],["`stroke`",{"2":{"98":1,"99":1,"100":1,"101":1}}],["`solid`",{"2":{"97":1,"99":1}}],["`fill`",{"2":{"98":1,"99":1,"100":1,"101":1}}],["`dashed`",{"2":{"97":1,"99":1}}],["`",{"2":{"87":3,"88":1,"89":1,"117":2,"179":1}}],["`$",{"2":{"87":3,"88":1,"89":1}}],["+=",{"2":{"212":1,"213":1,"214":1,"215":3,"216":1,"217":1,"218":1,"219":1,"220":1,"221":1}}],["+098syuqtzi0ynzll",{"2":{"194":1}}],["+",{"2":{"68":1,"107":5,"108":5,"117":2,"176":1,"212":9,"213":9,"214":9,"215":9,"216":9,"217":11,"218":10,"219":9,"220":9,"221":9}}],["===",{"2":{"107":5,"176":1,"218":1,"219":2}}],["=",{"2":{"61":1,"68":1,"95":1,"107":14,"117":6,"139":1,"141":1,"176":3,"179":8,"212":31,"213":16,"214":22,"215":22,"216":22,"217":39,"218":25,"219":28,"220":22,"221":35}}],["=>",{"2":{"36":3,"37":1,"38":1,"39":1,"40":1,"41":1,"42":3,"43":1,"44":1,"45":9,"46":1,"47":20,"48":1,"49":2,"50":2,"51":1,"53":1,"54":1,"55":1,"56":1,"57":1,"58":1,"59":1,"60":1,"61":1,"62":1,"63":1,"64":1,"65":1,"66":1,"67":1,"68":1,"69":1,"70":1,"71":1,"72":1,"73":1,"74":1,"75":1,"76":1,"77":1,"78":1,"79":1,"80":1,"81":1,"82":1,"85":1,"97":1,"98":1,"99":2,"100":1,"101":1,"104":2,"107":2,"115":6,"117":5,"119":1,"120":1,"121":1,"122":1,"123":1,"124":1,"125":1,"126":1,"127":1,"128":1,"129":1,"130":1,"131":1,"132":1,"133":1,"134":1,"135":1,"136":1,"137":1,"138":1,"139":2,"140":2,"141":2,"142":1,"143":1,"144":2,"145":3,"146":10,"147":13,"148":1,"149":1,"150":29,"151":1,"152":15,"153":1,"154":1,"155":1,"156":1,"157":1,"158":1,"159":1,"160":1,"161":1,"162":2,"163":2,"164":2,"165":1,"166":1,"167":1,"168":1,"175":17,"176":1,"179":13,"212":8,"214":2,"215":3,"216":2,"217":7,"218":3,"219":2,"220":2,"221":8}}],["kinecharts",{"2":{"183":1}}],["kdj",{"2":{"113":1}}],["kb",{"0":{"70":1},"2":{"70":1}}],["kx",{"2":{"68":1}}],["k",{"2":{"68":1,"115":2,"139":1,"140":1,"141":1,"212":2,"213":2,"214":2,"215":2,"216":2,"217":2,"218":2,"219":4,"220":2,"221":2}}],["klinechart",{"0":{"170":1,"178":1},"2":{"170":1,"178":1,"193":2,"195":1,"197":1,"222":2}}],["klinecharts",{"2":{"23":2,"36":1,"94":1,"95":1,"103":1,"110":1,"114":1,"174":1,"175":1,"178":7,"179":8,"183":1,"184":3,"190":1,"212":1,"213":1,"214":1,"215":1,"216":1,"217":1,"218":1,"219":1,"220":1,"221":1,"222":1}}],["klinedata>",{"2":{"145":1}}],["klinedatalist",{"2":{"115":2,"117":4,"191":4,"217":2}}],["klinedata",{"2":{"45":1,"115":11,"117":2,"145":1,"146":1,"147":1,"217":2}}],["keywords",{"2":{"179":1}}],["key",{"0":{"61":1,"108":1},"2":{"45":2,"47":6,"61":1,"110":1,"111":1,"115":1,"116":2,"117":5,"146":2,"147":2,"175":2,"176":1,"182":1,"212":17,"214":8,"216":5,"217":1,"218":5,"219":6,"220":5,"221":13}}],["^9",{"0":{"49":1,"50":1,"66":1,"67":1,"84":1,"131":1,"132":1,"133":1,"145":1,"162":1},"1":{"85":1,"86":1,"87":1,"88":1,"89":1},"2":{"36":2,"47":2,"139":1,"140":1,"141":1,"146":3,"147":1,"152":2,"161":2}}],[">`",{"2":{"179":1}}],[">=",{"2":{"117":1}}],[">",{"2":{"36":1,"45":4,"47":4,"49":1,"50":1,"73":1,"74":1,"79":1,"80":1,"85":2,"99":2,"115":2,"139":1,"140":1,"142":1,"146":4,"147":4,"150":3,"152":1,"165":2,"166":1,"175":4,"178":1,"179":13,"195":1,"212":2,"213":1,"214":2,"215":1,"216":2,"217":2,"218":2,"219":2,"220":2,"221":2}}],["||",{"2":{"107":2,"117":1}}],["|",{"2":{"36":7,"37":2,"45":5,"47":17,"49":1,"50":1,"62":1,"63":1,"65":1,"66":1,"67":1,"76":10,"77":1,"78":4,"79":1,"80":4,"81":4,"82":13,"85":2,"97":1,"98":3,"99":4,"100":3,"101":5,"115":5,"119":2,"120":2,"121":1,"144":1,"145":1,"146":17,"147":14,"150":8,"152":3,"153":1,"163":7,"164":7,"165":2,"166":2,"175":9,"182":54}}],["hu",{"2":{"222":1}}],["https",{"2":{"175":1,"178":1,"179":1,"193":2,"194":1,"222":1}}],["htmlid",{"2":{"189":1}}],["html>",{"2":{"179":2}}],["html",{"2":{"178":1,"179":1,"189":1}}],["html5",{"2":{"92":1}}],["htmlelement",{"2":{"36":1,"37":1,"119":1,"121":1}}],["hide",{"2":{"221":1}}],["hierarchy",{"2":{"200":1}}],["historical",{"2":{"139":1,"140":2}}],["hint",{"2":{"115":1}}],["highly",{"2":{"170":1,"171":1}}],["highest",{"2":{"90":1}}],["high",{"2":{"38":1,"90":1,"100":1,"110":1,"115":2,"139":1,"140":1,"141":1,"142":1,"175":1,"179":70,"182":3,"212":3,"213":3,"214":3,"215":5,"216":4,"217":3,"218":3,"219":3,"220":3,"221":3}}],["hk",{"2":{"110":1,"216":2}}],["homepage",{"2":{"222":3}}],["hope",{"2":{"222":1}}],["hoped",{"2":{"117":1}}],["hooks",{"2":{"179":1}}],["hold",{"2":{"175":3}}],["hot",{"0":{"108":1}}],["how",{"0":{"208":1,"209":1,"211":1},"2":{"94":1,"112":1,"172":1,"175":1,"176":1,"222":1}}],["horizontalstraightline",{"2":{"173":1}}],["horizontalsegment",{"2":{"173":1}}],["horizontalrayline",{"2":{"173":1}}],["horizontal",{"2":{"29":1,"76":1,"82":1,"182":2}}],["hh",{"2":{"64":1}}],["help",{"0":{"190":1},"2":{"183":1}}],["helper",{"2":{"52":1}}],["helvetica",{"2":{"182":12,"217":1}}],["head>",{"2":{"179":2}}],["here",{"2":{"87":3,"88":1,"89":1,"117":2,"143":1}}],["height",{"2":{"29":2,"36":1,"75":3,"81":3,"82":3,"85":1,"100":1,"101":2,"106":3,"107":8,"115":2,"120":1,"146":6,"161":6,"175":1,"179":7,"186":2,"206":1,"212":1,"213":1,"214":1,"215":1,"216":1,"217":1,"218":1,"219":1,"220":1,"221":1}}],["halfgapbar",{"2":{"115":1,"175":1}}],["halfbar",{"2":{"115":1,"175":1}}],["handle",{"2":{"171":1,"175":2}}],["handling",{"2":{"27":1,"47":1}}],["hanging",{"2":{"76":1,"82":1}}],["has",{"2":{"29":1,"106":2,"109":1,"115":1,"139":1,"140":1,"141":1,"144":1,"176":1,"206":1,"211":1}}],["have",{"2":{"20":1,"38":1,"105":1,"152":1,"204":1}}],["↩️",{"2":{"17":1}}],["global",{"2":{"175":2,"178":1}}],["globally",{"2":{"103":1,"114":1,"115":3,"174":1}}],["gzip",{"2":{"171":1}}],["green",{"2":{"219":15}}],["grid",{"2":{"182":1,"200":1}}],["group",{"0":{"195":1},"2":{"152":1,"153":1,"195":1}}],["groupid",{"2":{"150":3,"152":3,"153":2}}],["graph",{"2":{"42":1,"43":2,"44":1,"104":2,"115":3}}],["graphic",{"2":{"20":1,"115":2,"175":3,"176":1}}],["graphics",{"2":{"1":1,"45":2,"104":1,"115":1,"147":2,"153":1,"175":6,"176":1}}],["gt",{"2":{"139":1,"141":1}}],["given",{"2":{"115":1}}],["github",{"0":{"193":1},"2":{"30":1,"31":1,"32":1,"33":1,"34":1,"193":2,"222":1}}],["good",{"2":{"222":1}}],["go",{"2":{"30":1,"31":1,"32":1,"33":1,"34":1}}],["gapbar",{"2":{"115":1,"175":1,"217":1}}],["gaps",{"2":{"115":1,"175":1}}],["gap",{"2":{"29":1,"36":1,"130":1,"131":1,"132":1,"133":1,"146":3,"161":3,"212":1,"214":1,"216":1,"217":1,"218":1,"219":1,"220":1,"221":1}}],["gendata",{"2":{"212":2,"213":2,"214":2,"215":4,"216":2,"217":2,"218":2,"219":2,"220":2,"221":2}}],["generally",{"2":{"115":1,"143":1}}],["generated",{"2":{"176":1}}],["generate",{"2":{"103":1,"114":1,"203":2}}],["generation",{"2":{"20":1}}],["getelementbyid",{"2":{"212":1,"214":1,"216":1,"217":1,"218":1,"219":3,"220":1,"221":1}}],["getalphablue",{"2":{"182":1}}],["getconvertpictureurl",{"0":{"167":1}}],["getdatalist",{"0":{"142":1},"2":{"215":1}}],["getdom",{"0":{"119":1},"2":{"189":3}}],["getbarspace",{"0":{"137":1}}],["gettime",{"2":{"212":1,"213":1,"214":1,"215":1,"216":1,"217":1,"218":1,"219":1,"220":1,"221":1}}],["gettimezone",{"0":{"125":1}}],["gettechnicalindicatortemplate",{"2":{"29":1}}],["gettechnicalindicatorbypaneid",{"2":{"29":1,"189":2}}],["getlinearyfromslopeintercept",{"0":{"70":1}}],["getlinearyfromcoordinates",{"0":{"69":1}}],["getlinearslopeintercept",{"0":{"68":1}}],["getlocal",{"2":{"29":1}}],["get",{"0":{"178":1},"2":{"36":1,"39":1,"40":1,"43":1,"44":1,"46":1,"48":1,"51":1,"61":1,"68":1,"69":1,"70":1,"95":1,"115":1,"119":1,"120":1,"122":1,"124":1,"125":1,"131":1,"138":1,"142":1,"151":1,"167":1,"171":1}}],["getheight",{"2":{"29":1,"189":1}}],["getwidth",{"2":{"29":1,"189":1}}],["getindicatorbypaneid",{"0":{"148":1},"2":{"29":1,"189":1}}],["getvisiblerange",{"0":{"138":1},"2":{"29":1}}],["gets",{"2":{"137":1}}],["getstyles",{"0":{"122":1},"2":{"29":1,"189":1}}],["getstyleoptions",{"2":{"29":1,"189":1}}],["getsize",{"0":{"120":1},"2":{"29":2,"189":1}}],["getsupportedoverlays",{"0":{"48":1}}],["getsupportedindicators",{"0":{"46":1}}],["getsupportedfigures",{"0":{"43":1}}],["getsupportedlocales",{"0":{"40":1}}],["getsupportlocales",{"2":{"29":1}}],["getsupportoverlays",{"2":{"29":1}}],["getsupportfigures",{"2":{"29":1,"175":1}}],["getfigureclass",{"0":{"44":1},"2":{"29":1,"94":1,"95":1}}],["getoverlaybyid",{"0":{"151":1},"2":{"29":1}}],["getoverlayclass",{"0":{"39":1},"2":{"17":1}}],["getoffsetrightdistance",{"0":{"131":1},"2":{"23":1}}],["4px",{"2":{"212":1,"214":1,"216":1,"217":1,"218":1,"219":1,"220":1,"221":1}}],["430px",{"2":{"212":1,"213":1,"214":1,"215":1,"216":1,"217":1,"218":1,"219":1,"220":1,"221":1}}],["45",{"2":{"182":3,"219":1}}],["42",{"2":{"179":7}}],["4986",{"2":{"179":7}}],["4980",{"2":{"179":7}}],["4988",{"2":{"179":7}}],["4985",{"2":{"179":7}}],["4981",{"2":{"179":14}}],["4964",{"2":{"179":21}}],["4961",{"2":{"179":35}}],["4963",{"2":{"179":7}}],["4962",{"2":{"179":7}}],["4968",{"2":{"179":14}}],["4966",{"2":{"179":14}}],["4975",{"2":{"179":7}}],["4974",{"2":{"179":7}}],["4973",{"2":{"179":14}}],["4971",{"2":{"179":7}}],["4979",{"2":{"179":21}}],["4972",{"2":{"179":21}}],["4970",{"2":{"179":7}}],["4977",{"2":{"179":42}}],["4976",{"2":{"179":14}}],["40k",{"2":{"171":1}}],["40",{"2":{"113":1,"182":3,"219":1}}],["4",{"0":{"14":1,"19":1,"34":1},"2":{"34":1,"115":1,"147":1,"182":48,"212":2,"213":2,"214":2,"215":2,"216":2,"217":2,"218":2,"219":2,"220":2,"221":2}}],["ue900",{"2":{"182":2}}],["utf",{"2":{"179":1}}],["utils",{"0":{"52":1,"53":1,"54":1,"55":1,"56":1,"57":1,"58":1,"59":1,"60":1,"61":1,"62":1,"63":1,"64":1,"65":1,"66":1,"67":1,"68":1,"69":1,"70":1,"71":1,"72":1,"73":1,"74":1,"75":1,"76":1,"77":1,"78":1,"79":1,"80":1,"81":1,"82":1,"83":1},"1":{"53":1,"54":1,"55":1,"56":1,"57":1,"58":1,"59":1,"60":1,"61":1,"62":1,"63":1,"64":1,"65":1,"66":1,"67":1,"68":1,"69":1,"70":1,"71":1,"72":1,"73":1,"74":1,"75":1,"76":1,"77":1,"78":1,"79":1,"80":1,"81":1,"82":1,"83":1},"2":{"13":2,"20":1,"23":2,"83":2,"190":1}}],["umd",{"2":{"178":2,"179":1,"203":13}}],["url",{"2":{"167":1}}],["usdt",{"2":{"226":2}}],["using",{"0":{"87":1,"88":1,"89":1}}],["usage",{"0":{"86":1},"1":{"87":1,"88":1,"89":1}}],["us",{"2":{"36":1,"38":1,"109":2,"175":1,"216":1}}],["useeffect",{"2":{"179":4}}],["used",{"2":{"87":2,"88":1,"89":1,"95":1,"115":3,"145":1,"175":2,"176":2,"211":1}}],["uses",{"2":{"87":3,"88":1,"89":1}}],["use",{"0":{"95":1,"111":1},"2":{"29":6,"83":1,"86":2,"92":1,"102":1,"103":1,"109":1,"114":1,"139":1,"141":1,"144":1,"174":1,"176":1,"178":2,"184":1,"186":1,"188":1,"189":3,"202":1,"204":2,"222":2}}],["upper",{"2":{"200":1}}],["upgrade",{"2":{"183":3}}],["upcolor",{"2":{"147":2,"182":5,"219":10}}],["up",{"2":{"115":1,"182":1,"203":1,"214":2}}],["update",{"2":{"141":1,"200":1}}],["updates",{"2":{"26":1}}],["updatedata",{"0":{"141":1},"2":{"23":1,"90":1,"215":4}}],["upwickcolor",{"2":{"23":1,"182":1,"219":2}}],["upbordercolor",{"2":{"23":1,"182":1,"219":2}}],["uniformly",{"2":{"184":1}}],["unique",{"2":{"42":1,"45":1,"47":1,"104":1,"147":1,"152":1,"175":1}}],["unsubscribe",{"2":{"164":1}}],["unsubscribeaction",{"0":{"164":1},"2":{"27":1,"189":1}}],["unsynchronized",{"2":{"4":1}}],["under",{"2":{"18":1,"171":1,"222":1}}],["zero",{"2":{"171":2}}],["z",{"2":{"115":1,"147":1}}],["zone",{"2":{"36":2,"124":4,"125":1}}],["zoom",{"2":{"29":1,"108":2,"146":1,"158":1,"161":1}}],["zoomattimestamp",{"0":{"160":1},"2":{"1":1}}],["zoomatdataindex",{"0":{"159":1},"2":{"1":1}}],["zoomatcoordinate",{"0":{"158":1},"2":{"1":1}}],["zooming",{"2":{"1":2,"108":1}}],["zh",{"2":{"36":1,"38":1,"109":1,"110":1,"216":3}}],["zlevel",{"2":{"12":2,"19":1,"47":2,"115":1,"146":1,"147":3,"150":3,"152":3,"175":1}}],["v2",{"2":{"222":1}}],["v9",{"0":{"183":1},"1":{"184":1,"185":1,"186":1,"187":1,"188":1,"189":1,"190":1,"191":1}}],["v8",{"0":{"183":1},"1":{"184":1,"185":1,"186":1,"187":1,"188":1,"189":1,"190":1,"191":1}}],["vue",{"2":{"179":1}}],["var",{"2":{"179":1}}],["variable",{"2":{"178":1}}],["valid",{"2":{"47":1,"57":1,"146":1,"152":1,"175":1}}],["values",{"2":{"45":1,"115":2,"146":1,"147":1,"165":1,"166":1,"175":3,"186":1,"191":1}}],["value",{"0":{"55":1,"56":1,"57":1,"58":1,"59":1,"60":1,"61":1,"62":1,"63":1,"65":1,"66":1,"146":1,"150":1,"165":1},"2":{"13":1,"20":1,"36":2,"45":3,"47":1,"49":1,"50":1,"55":2,"56":2,"57":2,"58":2,"59":2,"60":3,"61":3,"62":1,"63":1,"65":1,"66":1,"69":1,"70":1,"71":2,"72":2,"75":2,"76":2,"77":3,"78":3,"79":1,"80":1,"81":3,"82":3,"85":2,"86":1,"97":2,"98":2,"100":3,"101":3,"104":1,"106":3,"115":8,"116":2,"117":4,"146":6,"147":3,"150":6,"152":3,"161":2,"165":7,"166":2,"175":7,"182":14,"189":5,"191":3}}],["vr",{"2":{"113":1}}],["v10",{"2":{"83":1,"102":1}}],["void",{"2":{"37":1,"38":1,"41":1,"42":2,"45":1,"47":3,"49":1,"50":1,"54":1,"77":1,"78":1,"79":1,"80":1,"81":1,"82":1,"104":1,"123":1,"124":1,"126":1,"128":1,"130":1,"132":1,"133":1,"134":1,"135":1,"136":1,"139":2,"140":2,"141":2,"143":1,"144":2,"145":3,"146":1,"147":2,"153":1,"154":1,"155":1,"156":1,"157":1,"158":1,"159":1,"160":1,"161":1,"162":2,"163":2,"164":2,"168":1,"175":2,"179":2}}],["vol",{"2":{"9":1,"113":1,"217":1,"219":1,"221":1}}],["volumeprecision",{"0":{"123":1},"2":{"123":2,"207":1}}],["volume",{"2":{"4":1,"38":1,"45":2,"90":2,"110":1,"115":1,"123":3,"139":1,"140":1,"141":1,"142":1,"146":1,"147":2,"175":1,"179":70,"182":2,"212":3,"213":3,"214":3,"215":4,"216":4,"217":3,"218":3,"219":3,"220":3,"221":3}}],["vite",{"2":{"204":1}}],["via",{"2":{"180":1}}],["visible",{"2":{"45":3,"47":3,"115":4,"134":1,"135":1,"138":1,"146":1,"147":4,"150":3,"152":4,"175":2}}],["visiblerange",{"2":{"23":1,"115":2,"191":2,"217":2}}],["viewport",{"2":{"85":1,"179":1,"191":2}}],["view",{"2":{"33":1,"34":1,"200":2}}],["verify",{"2":{"203":1}}],["very",{"2":{"146":1,"222":1}}],["verticalstraightline",{"2":{"173":1}}],["verticalsegment",{"2":{"173":1}}],["verticalrayline",{"2":{"173":1}}],["vertical",{"2":{"14":1,"29":1,"76":1,"82":1,"182":2}}],["version",{"0":{"51":1},"2":{"11":1,"51":1,"139":1,"140":1,"141":1,"144":1,"178":1}}],["would",{"2":{"222":1}}],["works",{"2":{"165":1,"166":1}}],["was",{"2":{"197":1}}],["want",{"0":{"209":1,"210":1,"211":1},"2":{"182":1}}],["wrap",{"2":{"212":2,"214":2,"216":2,"217":2,"218":2,"219":2,"220":2,"221":2}}],["written",{"2":{"197":1}}],["wr",{"2":{"113":1}}],["what",{"0":{"170":1,"207":1,"209":1,"210":1}}],["while",{"2":{"123":1}}],["which",{"2":{"84":1,"115":1,"121":1,"146":1,"175":7,"176":1,"211":1}}],["whether",{"2":{"71":1,"72":1,"74":1,"75":1,"104":1,"126":1,"127":1,"128":1,"129":1,"139":1,"140":1,"146":1,"161":1,"175":2,"180":1}}],["wheel",{"2":{"9":1}}],["where",{"2":{"5":1,"9":1,"115":1,"175":1}}],["when",{"2":{"1":1,"3":1,"5":1,"9":2,"14":1,"24":2,"47":1,"87":2,"88":1,"89":1,"95":1,"115":1,"117":2,"121":1,"146":2,"148":1,"149":1,"150":1,"152":1,"164":1,"175":1,"182":1}}],["wechat",{"0":{"195":1,"225":1}}],["website",{"2":{"178":1,"222":1}}],["web",{"2":{"175":1}}],["webview",{"2":{"92":1}}],["we",{"2":{"106":1}}],["weight",{"0":{"67":1},"2":{"67":1,"76":3,"82":3,"101":1,"182":10}}],["weak",{"2":{"47":3,"150":3,"152":4,"175":3}}],["well",{"2":{"24":1}}],["widget",{"2":{"200":2}}],["width=device",{"2":{"179":1}}],["width",{"2":{"7":1,"9":1,"20":1,"67":1,"75":3,"81":3,"82":3,"85":1,"100":2,"101":2,"106":3,"107":8,"115":4,"120":1,"136":1,"137":1,"175":2,"179":8}}],["window",{"2":{"115":3,"119":1,"120":1,"146":8,"147":2,"148":4,"149":3,"150":2,"161":7,"165":1,"166":1,"175":1,"179":1}}],["will",{"2":{"36":1,"37":1,"83":1,"102":1,"115":5,"123":1,"124":1,"139":1,"141":3,"143":1,"148":1,"149":1,"152":1,"165":1,"168":2,"175":1,"183":1,"212":1,"214":1,"216":1,"217":1,"218":1,"219":1,"220":1,"221":1,"222":1}}],["with",{"2":{"12":1,"90":2,"105":1,"115":3,"117":3,"146":1,"150":1,"168":1,"171":1,"175":4,"200":1,"211":1,"222":1}}],["yarn",{"2":{"178":1,"202":1}}],["yaxis",{"2":{"2":1,"29":6,"45":3,"115":6,"119":2,"120":2,"146":1,"147":1,"175":2,"182":1,"186":6,"189":1,"191":4,"212":4,"217":2}}],["ydis",{"2":{"107":2,"176":3,"218":3}}],["your",{"2":{"179":1}}],["you",{"0":{"209":1},"2":{"86":1,"90":2,"94":1,"103":1,"106":1,"109":2,"110":1,"111":1,"114":1,"115":4,"171":1,"175":4,"178":3,"180":2,"183":2,"197":3,"202":1,"204":1,"209":1,"222":3}}],["yyyy",{"2":{"64":1}}],["y",{"2":{"7":1,"9":1,"24":1,"29":1,"47":2,"50":1,"68":3,"69":4,"70":2,"71":4,"72":4,"73":2,"74":2,"75":4,"76":4,"77":3,"78":3,"79":1,"80":1,"81":3,"82":3,"87":1,"88":1,"89":1,"97":2,"98":2,"99":2,"100":2,"101":2,"104":1,"106":3,"107":12,"115":2,"152":1,"158":1,"165":4,"166":3,"175":7,"176":2,"217":2,"218":2}}],["35",{"2":{"179":7,"182":2}}],["31",{"2":{"179":7}}],["33",{"2":{"179":7,"182":6}}],["34",{"2":{"113":1,"179":7}}],["30",{"2":{"113":3,"146":1,"179":7,"212":1,"213":1,"214":1,"215":1,"216":1,"217":1,"218":1,"219":1,"220":1,"221":1}}],["3",{"0":{"7":1,"15":1,"20":1,"24":1,"67":1},"2":{"113":3,"146":1,"161":2,"176":1,"182":4,"212":3,"213":3,"214":3,"215":3,"216":3,"217":3,"218":4,"219":3,"220":3,"221":3}}],["rgba",{"2":{"182":17,"219":2}}],["rise",{"2":{"219":6}}],["rippleradius",{"2":{"182":1}}],["ripplecolor",{"2":{"182":1}}],["rich",{"2":{"171":1,"178":1}}],["rigideroverlay",{"2":{"29":1}}],["right",{"2":{"6":1,"47":1,"76":1,"82":2,"85":1,"101":1,"108":1,"115":4,"120":1,"130":1,"131":1,"133":1,"135":1,"152":1,"175":4,"182":4,"212":2}}],["rsi",{"2":{"113":1}}],["round",{"2":{"212":3,"213":3,"214":3,"215":4,"216":3,"217":3,"218":3,"219":3,"220":3,"221":3}}],["root",{"2":{"119":3,"120":3,"189":1,"202":1}}],["roc",{"2":{"113":1}}],["rollback",{"2":{"17":1}}],["run",{"2":{"92":2,"202":1,"203":20}}],["rules",{"2":{"12":1,"203":1,"221":3}}],["random",{"2":{"212":4,"213":4,"214":4,"215":6,"216":4,"217":5,"218":4,"219":4,"220":4,"221":4}}],["range",{"2":{"85":3,"138":1}}],["rayline",{"2":{"173":1}}],["radius",{"2":{"71":1,"72":1,"77":1,"78":1,"81":1,"82":1,"97":1,"98":1,"176":2,"182":2,"212":1,"214":1,"216":1,"217":1,"218":3,"219":1,"220":1,"221":1}}],["ratio",{"2":{"20":2}}],["r",{"2":{"71":2,"72":2,"77":2,"78":2,"97":1,"98":1,"176":1,"218":1}}],["reward",{"2":{"222":1}}],["red",{"2":{"219":15}}],["redrawn",{"2":{"143":1}}],["requires",{"2":{"202":1,"204":1}}],["required",{"2":{"90":7,"104":1,"146":1,"162":1,"175":8,"176":1}}],["retrieve",{"2":{"200":1}}],["returns",{"2":{"175":1}}],["returning",{"2":{"145":1,"150":1}}],["returned",{"2":{"115":1,"117":1,"142":1,"148":2,"149":1,"153":1}}],["return",{"2":{"36":1,"104":1,"107":1,"115":1,"117":4,"122":1,"146":1,"150":1,"151":1,"152":1,"175":4,"176":2,"179":5,"182":1,"191":1,"212":1,"213":1,"214":1,"215":1,"216":1,"217":3,"218":3,"219":1,"220":1,"221":1}}],["reverse",{"2":{"182":1,"212":5}}],["repeated",{"2":{"143":1}}],["replace",{"2":{"117":1}}],["resizing",{"2":{"168":1}}],["resize",{"0":{"168":1}}],["respond",{"2":{"117":1}}],["response",{"2":{"18":1}}],["results",{"2":{"117":1}}],["result",{"2":{"115":1,"217":3}}],["react",{"2":{"179":1}}],["reactvueangularpreactsolidsveltevanilla",{"2":{"179":1}}],["read",{"2":{"94":1}}],["realdataindex",{"2":{"115":1}}],["realx",{"2":{"115":1}}],["real",{"0":{"208":1},"2":{"115":4}}],["realrange",{"2":{"85":1}}],["realto",{"2":{"23":1,"85":1,"115":1,"138":1}}],["realfrom",{"2":{"23":1,"85":1,"115":1,"138":1}}],["recalculate",{"2":{"168":1}}],["recommended",{"2":{"94":1,"178":1}}],["recttext",{"0":{"82":1,"83":1,"102":1},"2":{"82":2,"96":1,"182":1}}],["rectangle",{"2":{"75":2,"81":2}}],["rect",{"0":{"75":1,"81":1,"100":1},"2":{"1":1,"17":1,"23":2,"75":2,"81":2,"96":1,"115":1,"182":4,"200":1,"221":2}}],["relevant",{"2":{"200":1}}],["release",{"2":{"33":1,"34":1}}],["related",{"2":{"29":1}}],["regularity",{"2":{"212":1}}],["regenerate",{"2":{"45":1,"115":1,"147":1}}],["regeneratefigures",{"2":{"29":1,"45":2,"115":1,"117":1,"146":1,"147":3,"191":1}}],["regenerateplots",{"2":{"29":1,"191":1}}],["register",{"2":{"86":1}}],["registeryaxis",{"0":{"50":1},"2":{"84":1,"146":1}}],["registerxaxis",{"0":{"49":1},"2":{"84":1}}],["registered",{"2":{"36":1,"121":1}}],["registerstyles",{"0":{"41":1},"2":{"29":1,"36":1,"121":1,"219":3}}],["registerlocale",{"0":{"38":1},"2":{"29":1,"110":2,"216":2}}],["registerfigure",{"0":{"42":1},"2":{"29":1,"103":1}}],["registeroverlay",{"0":{"47":1},"2":{"5":1,"29":1,"174":1,"188":1,"218":2}}],["registerindicator",{"0":{"45":1},"2":{"5":1,"29":1,"114":1,"188":1,"217":2}}],["remove",{"0":{"153":1},"2":{"149":2,"153":2}}],["removehtml",{"2":{"29":1,"189":1}}],["removetag",{"2":{"29":1,"189":1}}],["removetechnicalindicator",{"2":{"29":1,"189":1}}],["removeannotation",{"2":{"29":1,"189":1}}],["removeshape",{"2":{"29":1,"189":1}}],["removeindicator",{"0":{"149":1},"2":{"29":1,"189":1}}],["removeoverlay",{"0":{"153":1},"2":{"29":2,"189":1}}],["reference",{"2":{"175":1}}],["refer",{"2":{"36":2,"41":1,"109":1,"115":7,"121":1,"122":1,"124":1,"139":1,"140":1,"141":1,"142":1,"183":1,"185":1}}],["refreshing",{"2":{"24":1}}],["refactoring",{"2":{"29":1}}],["refactor",{"2":{"13":1}}],["rendering",{"2":{"12":2,"26":1}}],["render",{"2":{"7":1,"29":1,"191":1}}],["55",{"2":{"179":7}}],["56",{"2":{"179":7}}],["53",{"2":{"179":14}}],["5000",{"2":{"212":1,"213":1,"214":1,"215":1,"216":1,"217":1,"218":1,"219":1,"220":1,"221":1}}],["50",{"2":{"113":1}}],["5",{"0":{"6":1,"14":1,"15":1,"16":1,"17":1,"18":1,"33":1},"2":{"33":1,"47":2,"113":3,"116":2,"117":1,"147":2,"152":2,"182":4}}],["n",{"2":{"182":2}}],["ngondestroy",{"2":{"179":1}}],["ngafterviewinit",{"2":{"179":1}}],["npmyarnpnpmbuncdn",{"2":{"178":1}}],["npm",{"0":{"203":1},"2":{"178":2,"179":1,"202":2,"203":10,"204":1}}],["neue",{"2":{"182":12,"217":1}}],["net",{"2":{"178":1,"179":1}}],["necessary",{"2":{"143":1,"175":5,"222":1}}],["next",{"2":{"115":2}}],["nesting",{"2":{"61":1}}],["needed",{"2":{"175":1,"200":1}}],["need",{"2":{"90":2,"94":1,"103":1,"109":1,"114":1,"115":4,"139":1,"147":1,"152":1,"175":4}}],["needdefaultyaxisfigure",{"2":{"47":2,"150":3,"152":3,"175":1,"218":1}}],["needdefaultxaxisfigure",{"2":{"47":2,"150":3,"152":3,"175":1,"218":1}}],["needdefaultpointfigure",{"2":{"47":2,"150":3,"152":3,"175":1,"218":1}}],["needs",{"2":{"45":1,"47":3,"92":2,"95":1,"116":1,"117":3,"147":1,"152":3,"166":1,"167":1,"175":1,"182":1}}],["newdata",{"2":{"215":10}}],["new",{"0":{"110":1,"111":1},"2":{"1":1,"29":4,"95":1,"110":1,"111":1,"139":1,"146":1,"204":1,"212":1,"213":1,"214":1,"215":1,"216":1,"217":1,"218":1,"219":1,"220":1,"221":1}}],["null",{"2":{"115":4,"144":1,"146":2,"147":3,"150":1,"152":1}}],["nullable",{"2":{"39":1,"145":1}}],["number>",{"2":{"70":1,"78":1,"80":1,"81":1}}],["numbers",{"2":{"36":1,"45":1,"63":1,"147":1}}],["number",{"2":{"36":8,"45":5,"47":6,"49":2,"50":2,"51":1,"56":1,"62":2,"63":1,"64":1,"65":1,"66":2,"67":3,"68":4,"69":7,"70":3,"71":7,"72":5,"73":4,"74":4,"75":6,"76":6,"77":7,"78":4,"79":4,"80":3,"81":6,"82":13,"85":16,"90":7,"97":7,"98":5,"99":8,"100":7,"101":13,"104":2,"115":30,"117":2,"120":6,"123":2,"130":1,"131":1,"132":1,"133":1,"134":2,"135":2,"136":1,"137":1,"138":4,"139":7,"140":7,"141":7,"142":7,"144":1,"146":10,"147":6,"150":10,"152":5,"154":2,"155":2,"156":2,"157":2,"158":4,"159":3,"160":3,"161":4,"165":10,"166":10,"175":29}}],["name=",{"2":{"179":4}}],["namely",{"2":{"68":1,"116":2}}],["name",{"0":{"41":1,"44":1,"148":1,"149":1},"2":{"36":3,"38":1,"39":2,"41":3,"42":3,"44":3,"45":5,"47":3,"49":3,"50":3,"85":2,"86":2,"87":4,"88":2,"89":2,"94":1,"95":3,"104":2,"107":1,"113":3,"115":7,"117":1,"121":1,"124":1,"125":1,"146":6,"147":6,"148":3,"149":3,"150":4,"152":4,"153":3,"161":4,"175":2,"176":2,"189":5,"191":1,"211":1,"217":11,"218":3}}],["naming",{"2":{"18":1}}],["none",{"2":{"113":2,"182":2,"212":2,"214":2,"216":2,"217":2,"218":2,"219":2,"220":2,"221":3}}],["non",{"2":{"90":1}}],["normal",{"2":{"45":2,"47":2,"115":2,"146":1,"147":2,"150":2,"152":2,"175":2,"182":14,"212":1}}],["no",{"0":{"207":1},"2":{"24":1,"29":1,"37":1,"115":1,"117":1,"139":1,"154":1,"155":1,"156":1,"157":1,"158":1,"159":1,"160":1,"175":1,"184":1,"222":1}}],["nochangecolor",{"2":{"147":2,"182":5,"219":4}}],["nochangewickcolor",{"2":{"23":1,"182":1}}],["nochangebordercolor",{"2":{"23":1,"182":1}}],["node",{"2":{"11":1,"202":2}}],["notify",{"2":{"200":1}}],["notice",{"0":{"198":1},"1":{"199":1,"200":1}}],["note",{"2":{"95":1,"117":1,"139":1,"140":1,"141":1,"144":1,"168":1,"195":1}}],["notes",{"2":{"33":1,"34":1}}],["not",{"0":{"209":1},"2":{"5":1,"8":1,"11":1,"14":1,"24":2,"36":1,"45":1,"47":1,"115":3,"117":1,"124":1,"143":2,"147":1,"152":1,"175":14,"178":1,"204":1}}],["mtm",{"2":{"113":1}}],["much",{"2":{"222":2}}],["must",{"2":{"90":1}}],["multiple",{"2":{"13":2,"171":2,"178":1}}],["migrated",{"2":{"190":1}}],["millisecond",{"2":{"90":1}}],["middle",{"2":{"76":1,"82":1,"158":1,"182":2}}],["min",{"2":{"178":1,"179":1,"215":1}}],["minimum",{"2":{"45":1,"115":1,"134":1,"135":1,"146":1,"147":1,"161":1}}],["minheight",{"2":{"36":1,"146":3,"161":3}}],["minvalue",{"2":{"10":1,"45":2,"115":1,"146":1,"147":3}}],["mm",{"2":{"64":2}}],["me",{"2":{"194":1}}],["meta",{"2":{"179":5}}],["metric",{"2":{"147":1}}],["method",{"2":{"1":2,"3":1,"27":1,"29":11,"42":1,"45":4,"47":2,"59":1,"94":1,"115":4,"139":2,"144":1,"146":1,"147":4,"148":1,"149":1,"151":1,"153":1,"163":1,"164":1,"168":1,"180":2,"182":2,"189":1,"191":4,"209":1}}],["methods",{"2":{"1":1,"11":1,"19":1,"29":6,"52":1,"107":1,"115":4,"175":2,"178":1,"191":1}}],["merging",{"2":{"121":1}}],["merged",{"2":{"185":1,"186":1,"191":1}}],["merge",{"0":{"54":1},"2":{"13":1,"54":1}}],["meaning",{"2":{"175":1}}],["mean",{"2":{"116":2}}],["median",{"2":{"115":1}}],["made",{"2":{"180":1,"212":1,"214":1,"216":1,"217":1,"218":1,"219":1,"220":1,"221":1}}],["manipulate",{"2":{"200":1}}],["manage",{"2":{"200":1}}],["management",{"2":{"178":2,"202":1}}],["manager",{"2":{"11":1,"202":1}}],["many",{"2":{"175":1}}],["manually",{"2":{"143":1}}],["matter",{"2":{"222":1}}],["matched",{"2":{"141":1}}],["math",{"2":{"107":2,"176":3,"212":8,"213":8,"214":8,"215":13,"216":8,"217":10,"218":11,"219":8,"220":8,"221":8}}],["maintitle",{"2":{"217":3}}],["mainindicators",{"2":{"217":2}}],["main",{"2":{"119":2,"120":2,"146":1,"147":1,"148":1,"149":1,"150":1,"161":1,"189":1,"217":1}}],["map",{"2":{"117":2,"217":1}}],["mapping",{"2":{"10":1}}],["ma5",{"2":{"116":2,"117":1}}],["ma2",{"2":{"116":2,"117":2}}],["ma10",{"2":{"116":3,"117":1}}],["ma1",{"2":{"116":3,"117":2}}],["macd",{"2":{"113":1,"217":1}}],["makes",{"2":{"178":1}}],["make",{"2":{"94":1}}],["ma",{"2":{"88":1,"113":1,"116":1,"117":5,"146":1,"217":1,"221":1}}],["magnet`",{"2":{"175":2}}],["magnet",{"2":{"47":5,"150":5,"152":6,"175":5}}],["max",{"2":{"215":1}}],["maximum",{"2":{"45":1,"115":1,"132":1,"133":1,"147":1}}],["maxvalue",{"2":{"10":1,"45":2,"115":1,"146":1,"147":3}}],["mark",{"0":{"211":1}}],["marginend",{"2":{"182":2,"186":2}}],["marginbottom",{"2":{"182":4}}],["marginright",{"2":{"182":4}}],["margintop",{"2":{"182":4}}],["marginleft",{"2":{"182":4}}],["marginstart",{"2":{"182":2}}],["margins",{"2":{"146":1,"161":1}}],["margin",{"2":{"29":2,"146":2,"161":2,"212":1,"214":1,"216":1,"217":1,"218":1,"219":1,"220":1,"221":2}}],["marinend",{"2":{"29":2}}],["marinstart",{"2":{"29":2,"186":2}}],["may",{"2":{"5":1,"8":1,"168":1,"197":1}}],["mozilla",{"2":{"175":1}}],["more",{"0":{"139":1,"140":1},"2":{"90":2,"139":3,"140":4,"144":1,"145":1}}],["mouse",{"2":{"47":2,"152":2,"175":2}}],["moving",{"2":{"47":1,"108":1}}],["movement",{"2":{"175":3}}],["moveto",{"2":{"107":2}}],["move",{"2":{"47":4,"108":2,"152":3,"175":2}}],["moved",{"2":{"5":1}}],["mobile",{"2":{"18":1,"92":1,"171":2}}],["model",{"2":{"175":1}}],["models",{"2":{"171":1}}],["mode",{"2":{"47":5,"150":3,"152":6,"175":5}}],["modesensitivity",{"2":{"18":1,"47":2,"150":3,"152":3,"175":1}}],["modules",{"2":{"200":1}}],["module",{"0":{"200":1},"2":{"13":1,"168":1,"203":7}}],["modify",{"2":{"9":1}}],["erc20",{"2":{"226":1}}],["error",{"2":{"1":1,"2":1,"11":2,"13":2,"15":1,"21":1}}],["eth",{"2":{"226":1}}],["etc",{"2":{"36":1,"45":1,"63":1,"95":1,"147":1,"178":1,"200":2}}],["europe",{"2":{"220":1}}],["esm",{"2":{"203":5}}],["e11d74",{"2":{"182":1}}],["ededed",{"2":{"182":2}}],["ecosystem",{"2":{"178":1}}],["easier",{"2":{"178":1}}],["each",{"2":{"117":2,"168":1}}],["else",{"2":{"107":1,"219":1}}],["elements",{"2":{"94":1}}],["element",{"2":{"36":2,"37":2}}],["emoji",{"2":{"217":3}}],["email",{"2":{"222":1}}],["ema",{"2":{"113":1}}],["emv",{"2":{"90":1,"113":1}}],["empty",{"2":{"24":1}}],["english",{"2":{"216":1}}],["enabled",{"0":{"126":1,"128":1},"2":{"126":1,"128":1}}],["entire",{"2":{"119":1,"120":1,"168":1}}],["enter",{"2":{"47":1,"152":1}}],["en",{"2":{"36":1,"38":1,"109":2,"175":1,"216":1}}],["endpoint",{"2":{"115":1}}],["endangle",{"2":{"71":2,"77":2,"97":1}}],["end",{"2":{"27":1,"47":2,"71":1,"76":1,"77":1,"82":1,"97":1,"115":2,"152":2,"175":2}}],["environment",{"0":{"91":1},"1":{"92":1,"93":1},"2":{"23":1,"202":1}}],["explanation",{"0":{"181":1}}],["export",{"2":{"179":4}}],["exist",{"2":{"165":1}}],["exists",{"2":{"152":1}}],["execution",{"2":{"162":1}}],["execute",{"0":{"203":1},"2":{"162":1}}],["executeaction",{"0":{"162":1},"2":{"23":1}}],["example",{"0":{"95":1,"105":1,"176":1},"1":{"106":1,"107":1},"2":{"45":1,"110":1,"115":5,"146":1,"147":2,"150":1,"152":1,"161":1,"182":1}}],["extended",{"2":{"45":1,"47":1,"115":1,"147":1,"152":1,"171":1,"175":1}}],["extenddata",{"2":{"5":1,"45":2,"47":2,"115":1,"146":1,"147":3,"150":3,"152":3,"175":1}}],["extension",{"2":{"29":4,"175":1,"188":2}}],["ef5350",{"2":{"22":1,"147":2}}],["effect",{"2":{"5":1,"11":1}}],["events",{"2":{"18":1,"25":3,"175":1}}],["event",{"2":{"9":1,"17":2,"18":1,"21":1,"24":1,"25":1,"27":1,"42":1,"47":30,"104":2,"150":56,"152":56,"175":31,"200":1}}],["6px",{"2":{"212":1,"214":1,"216":1,"217":1,"218":1,"219":1,"220":1,"221":1}}],["686d76",{"2":{"182":4}}],["62",{"2":{"179":7}}],["66",{"2":{"179":14}}],["64",{"2":{"179":7}}],["61",{"2":{"179":14}}],["600px",{"2":{"179":10}}],["600",{"2":{"179":4,"215":1}}],["60",{"2":{"113":2,"212":5,"213":5,"214":5,"215":5,"216":5,"217":5,"218":5,"219":5,"220":5,"221":5}}],["6",{"0":{"5":1,"13":1,"32":1},"2":{"32":1,"36":1,"113":9,"146":1,"182":6}}],["76808f",{"2":{"182":2}}],["76",{"2":{"179":7}}],["72",{"2":{"179":7}}],["70",{"2":{"179":7}}],["74",{"2":{"179":7}}],["77",{"2":{"179":7}}],["7",{"0":{"4":1,"11":1,"12":1,"31":1,"132":1,"133":1},"2":{"31":1,"147":1,"182":6,"183":1,"219":2}}],["flex",{"2":{"212":2,"214":2,"216":2,"217":2,"218":2,"219":2,"220":2,"221":2}}],["floor",{"2":{"212":1,"213":1,"214":1,"215":1,"216":1,"217":2,"218":1,"219":1,"220":1,"221":1}}],["fluctuation",{"0":{"207":1}}],["flag",{"2":{"146":1,"161":1}}],["feedback",{"0":{"192":1},"1":{"193":1,"194":1,"195":1}}],["fefefe",{"2":{"182":1}}],["features",{"0":{"171":1},"2":{"29":1}}],["f2f3f5",{"2":{"182":1}}],["fff",{"2":{"212":1,"214":1,"216":1,"217":1,"218":1,"219":1,"220":1,"221":1}}],["ffffff",{"2":{"167":1,"182":6,"219":1}}],["ff9600",{"2":{"147":1,"182":1}}],["f00",{"2":{"150":1,"152":1}}],["full",{"0":{"182":1}}],["functions",{"2":{"171":1}}],["function",{"2":{"144":1,"150":14,"152":14,"171":1,"179":1,"212":5,"213":1,"214":2,"215":2,"216":2,"217":3,"218":2,"219":2,"220":2,"221":5}}],["future",{"2":{"8":1,"10":1}}],["fall",{"2":{"219":6}}],["false",{"2":{"88":1,"146":1,"147":1,"150":5,"152":5,"182":11,"212":2,"217":1,"221":1}}],["faq",{"0":{"205":1},"1":{"206":1,"207":1,"208":1,"209":1,"210":1,"211":1}}],["fast",{"2":{"171":1}}],["factor",{"2":{"158":1,"159":1,"160":1}}],["family",{"0":{"67":1},"2":{"67":1,"76":2,"82":2,"101":1,"182":10}}],["fail",{"2":{"9":1}}],["f92855",{"2":{"22":1,"182":4,"219":1}}],["fruits",{"2":{"217":2}}],["frequent",{"2":{"168":1}}],["free",{"2":{"16":1,"222":1}}],["from",{"0":{"183":1},"1":{"184":1,"185":1,"186":1,"187":1,"188":1,"189":1,"190":1,"191":1},"2":{"61":1,"85":1,"115":7,"138":1,"164":1,"175":2,"178":1,"179":11,"183":1,"184":1,"200":2,"212":1,"213":1,"214":1,"215":1,"216":1,"217":3,"218":1,"219":1,"220":1,"221":1}}],["frame",{"2":{"18":1,"98":1,"99":1,"100":1,"101":1}}],["foxmail",{"2":{"222":1}}],["follow",{"2":{"182":2,"221":2}}],["following",{"2":{"109":1,"212":1,"214":1,"216":1,"217":1,"218":1,"219":1,"220":1,"221":1}}],["fold",{"2":{"9":1,"36":1,"66":1,"175":1}}],["folding",{"2":{"3":1,"5":1,"10":1}}],["fontfamily",{"2":{"182":2}}],["font",{"2":{"76":1,"82":1,"101":1,"212":1,"214":1,"216":1,"217":2,"218":1,"219":1,"220":1,"221":1}}],["foreach",{"2":{"117":1,"212":4,"214":1,"216":1,"217":2,"218":1,"219":1,"220":1,"221":4}}],["form",{"2":{"200":1}}],["formed",{"2":{"69":1,"70":1}}],["formatfolddecimal",{"0":{"66":1}}],["formatthousands",{"0":{"65":1}}],["formatting",{"2":{"10":1,"62":1}}],["formatprecision",{"0":{"62":1}}],["formatvalue",{"0":{"61":1},"2":{"61":1}}],["formats",{"2":{"36":1}}],["format",{"0":{"64":1},"2":{"36":2,"45":1,"63":1,"64":3,"65":1,"66":1,"90":1,"115":2,"117":1,"147":1,"175":1}}],["formatdate",{"0":{"64":1},"2":{"36":2}}],["formatbignumber",{"0":{"63":1},"2":{"23":1,"36":2}}],["force",{"2":{"27":1}}],["forward",{"2":{"10":1,"145":2}}],["for",{"2":{"7":1,"10":1,"12":1,"23":1,"25":2,"30":1,"31":1,"32":1,"36":2,"41":1,"42":1,"45":3,"46":1,"47":3,"48":1,"90":1,"104":1,"110":1,"115":9,"121":1,"139":1,"140":1,"141":1,"142":1,"145":1,"146":1,"147":3,"152":1,"162":1,"175":4,"178":1,"182":1,"185":1,"202":1,"210":1,"212":3,"213":2,"214":3,"215":2,"216":3,"217":4,"218":3,"219":3,"220":3,"221":3,"222":1}}],["fish2016",{"2":{"197":1}}],["final",{"2":{"200":1}}],["financial",{"2":{"170":1}}],["finder",{"0":{"165":1,"166":1},"2":{"165":2,"166":2,"189":4}}],["file",{"0":{"199":1}}],["files",{"2":{"171":1,"203":3}}],["filter",{"2":{"165":1,"166":1}}],["filltext",{"2":{"217":1}}],["fills",{"2":{"206":1}}],["fillstyle",{"2":{"107":1}}],["filled",{"2":{"107":1,"176":1}}],["fillet",{"2":{"100":1,"101":1}}],["fill`",{"2":{"98":1,"99":1,"100":1,"101":1}}],["fill",{"2":{"78":2,"80":2,"81":2,"82":2,"90":1,"98":2,"99":2,"100":2,"101":2,"106":4,"107":5,"146":4,"147":6,"168":1,"176":2,"182":34,"218":1,"219":4}}],["field",{"2":{"90":6,"104":1,"175":1}}],["fields",{"2":{"90":2,"175":1}}],["first",{"0":{"179":1},"2":{"25":1,"106":1,"116":2,"144":1,"179":1}}],["figureindex",{"2":{"24":1}}],["figurekey",{"2":{"24":1}}],["figure",{"0":{"42":1,"94":1,"103":1},"1":{"95":1,"96":1,"97":1,"98":1,"99":1,"100":1,"101":1,"102":1,"103":1,"104":2,"105":2,"106":2,"107":2},"2":{"7":1,"16":1,"17":1,"21":1,"25":2,"26":1,"42":5,"44":1,"45":1,"47":3,"94":3,"95":4,"97":1,"98":1,"99":2,"100":1,"101":1,"103":2,"104":3,"107":1,"115":1,"147":1,"152":3,"200":1}}],["figures",{"0":{"96":1},"1":{"97":1,"98":1,"99":1,"100":1,"101":1,"102":1},"2":{"1":1,"29":1,"45":2,"47":3,"94":2,"96":1,"103":1,"115":3,"116":3,"117":4,"146":1,"147":3,"191":1,"217":1}}],["fixed",{"2":{"90":1,"101":2,"182":2}}],["fix",{"2":{"1":3,"2":2,"3":2,"4":1,"5":3,"6":2,"7":1,"8":1,"9":2,"10":3,"11":2,"12":2,"13":2,"14":2,"15":1,"16":1,"18":1,"21":1,"24":2,"25":2,"26":1,"28":1}}],["1b1b1f",{"2":{"219":1}}],["1m",{"2":{"36":1,"45":1,"63":1,"147":1}}],["1k",{"2":{"36":1,"45":1,"63":1,"147":1}}],["16px",{"2":{"217":1}}],["1677ff",{"2":{"182":11,"212":1,"214":1,"216":1,"217":1,"218":1,"219":1,"220":1,"221":1}}],["16098",{"2":{"150":1,"152":1}}],["1614171202000",{"2":{"150":1,"152":1}}],["1614171282000",{"2":{"150":1,"152":1}}],["16",{"2":{"29":1,"179":7}}],["17",{"2":{"28":1,"217":1}}],["150",{"2":{"182":6}}],["1587660540000",{"2":{"179":7}}],["1587660480000",{"2":{"179":7}}],["1587660420000",{"2":{"179":7}}],["1587660360000",{"2":{"179":7}}],["1587660300000",{"2":{"179":7}}],["1587660240000",{"2":{"179":7}}],["1587660180000",{"2":{"179":7}}],["1587660120000",{"2":{"179":7}}],["1587660060000",{"2":{"179":7}}],["1587660000000",{"2":{"179":7}}],["15",{"2":{"18":1,"24":1,"182":1}}],["192",{"2":{"182":3,"219":1}}],["191",{"2":{"179":7}}],["197",{"2":{"179":7}}],["194",{"2":{"179":7}}],["19",{"2":{"15":1,"179":7}}],["119",{"2":{"182":4}}],["11",{"2":{"13":1}}],["184",{"2":{"179":7}}],["18987",{"2":{"150":1,"152":1}}],["18",{"2":{"11":1,"16":1}}],["135",{"2":{"179":7}}],["13",{"2":{"9":1,"20":1,"113":1}}],["1",{"0":{"9":1,"11":1,"17":1,"22":1,"24":1,"25":1,"26":2,"27":1,"28":1,"106":1,"116":1},"2":{"61":1,"107":1,"117":3,"146":4,"147":4,"150":1,"152":1,"161":4,"176":2,"182":37,"213":1,"215":2,"218":2,"219":4}}],["12px",{"2":{"212":1,"214":1,"216":1,"217":1,"218":1,"219":1,"220":1,"221":1}}],["12345678910111213141516171819202122",{"2":{"221":1}}],["1234567891011121314151617181920212223242526html",{"2":{"179":1}}],["12345678910111213141516171819202122232425262728html",{"2":{"213":1}}],["12345678910111213141516171819202122232425262728svelte",{"2":{"179":1}}],["123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051html",{"2":{"220":1}}],["1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677html",{"2":{"218":1}}],["123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126html",{"2":{"221":1}}],["123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150html",{"2":{"219":1}}],["123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110html",{"2":{"212":1}}],["123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107html",{"2":{"217":1}}],["123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960html",{"2":{"216":1}}],["1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556html",{"2":{"214":1}}],["12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849html",{"2":{"215":1}}],["123456789101112131415161718192021222324252627282930313233",{"2":{"179":1}}],["1234567891011121314151617181920212223242526272829jsximport",{"2":{"179":1}}],["1234567891011121314151617181920212223242526272829tsimport",{"2":{"179":1}}],["123456789101112131415161718192021222324252627jsximport",{"2":{"179":1}}],["1234567891011121314151617181920212223242526vue",{"2":{"179":1}}],["123456789101112131415161718",{"2":{"212":1,"214":1,"216":1,"217":1,"218":1,"219":1,"220":1}}],["123css",{"2":{"212":1,"214":1,"216":1,"217":1,"218":1,"219":1,"220":1,"221":1}}],["12",{"2":{"7":1,"10":1,"11":1,"12":2,"113":9,"179":7,"182":12}}],["142",{"2":{"182":3,"219":1}}],["14",{"2":{"3":1,"6":1,"13":1,"17":1,"26":1,"113":3,"179":7}}],["10px",{"2":{"212":2,"214":2,"216":2,"217":2,"218":2,"219":2,"220":2,"221":2}}],["105",{"2":{"179":7}}],["100",{"2":{"146":1,"161":1,"212":1,"213":1,"214":1,"215":1,"216":1,"217":1,"218":1,"219":1,"220":1,"221":1}}],["100k",{"2":{"115":1}}],["100000",{"2":{"115":1}}],["1000000",{"2":{"36":1,"45":1,"63":1,"147":1}}],["1000",{"2":{"36":1,"45":1,"63":1,"115":1,"147":1,"182":1,"212":4,"213":4,"214":4,"215":4,"216":4,"217":4,"218":4,"219":4,"220":4,"221":4}}],["10",{"0":{"1":1},"2":{"4":1,"25":1,"113":7,"116":2,"117":1,"182":2,"212":1,"213":1,"214":1,"215":3,"216":1,"217":1,"218":1,"219":1,"220":1,"221":1}}],["svelte",{"2":{"179":1}}],["src=",{"2":{"178":1,"179":1}}],["sqrt",{"2":{"176":1,"218":1}}],["sma",{"2":{"113":1}}],["smooth",{"2":{"8":1,"171":1,"182":7}}],["switching",{"2":{"111":1}}],["scan",{"2":{"195":1}}],["scalable",{"2":{"171":1}}],["scaling",{"2":{"158":1,"159":1,"160":1}}],["scale=1",{"2":{"179":1}}],["scaled",{"2":{"127":1}}],["scale",{"0":{"158":1,"159":1,"160":1},"2":{"126":1,"158":3,"159":3,"160":3}}],["scoordinates",{"2":{"176":1}}],["scheme",{"2":{"109":1}}],["script>",{"2":{"178":1,"179":6}}],["script",{"2":{"178":1,"179":2}}],["scrolltotimestamp",{"0":{"157":1}}],["scrolltodataindex",{"0":{"156":1}}],["scrolltorealtime",{"0":{"155":1}}],["scrollbydistance",{"0":{"154":1}}],["scrollzoomenabled",{"2":{"36":1,"146":3,"161":3}}],["scroll",{"2":{"29":1,"146":1,"154":1,"155":1,"156":1,"157":1,"161":1}}],["scrolling",{"2":{"18":1,"128":1,"129":1}}],["screen",{"2":{"20":1}}],["sale",{"0":{"211":1}}],["sample",{"2":{"182":2}}],["samplecircle",{"2":{"176":2}}],["same",{"2":{"83":1,"102":1,"117":1,"141":1,"146":1,"165":1}}],["sar",{"2":{"113":1}}],["saved",{"2":{"29":1}}],["slope",{"2":{"68":1,"70":1}}],["ss",{"2":{"64":1}}],["shift",{"2":{"108":4}}],["shows",{"0":{"207":1},"2":{"200":1}}],["showparams",{"2":{"182":1}}],["showtype",{"2":{"182":2,"221":4}}],["showrule",{"2":{"182":2,"221":4}}],["show",{"2":{"182":27}}],["showname",{"2":{"147":1,"182":1}}],["short",{"2":{"45":1,"115":1,"147":1}}],["shortname",{"2":{"45":2,"115":1,"117":1,"146":1,"147":2}}],["shouldcheckparamcount",{"2":{"191":1}}],["should",{"0":{"211":1},"2":{"45":1,"117":1,"147":1}}],["shouldformatbignumber",{"2":{"45":2,"115":1,"146":1,"147":3}}],["shouldohlc",{"2":{"45":2,"115":1,"146":1,"147":3}}],["shanghai",{"2":{"36":1,"124":1,"220":2}}],["shapes",{"2":{"200":1}}],["shape",{"0":{"190":1},"2":{"29":2,"185":1,"186":1}}],["s",{"0":{"170":1},"2":{"39":1,"222":1}}],["sort",{"2":{"212":1,"213":1,"214":1,"215":1,"216":1,"217":1,"218":1,"219":1,"220":1,"221":1}}],["so",{"2":{"107":1,"116":1,"117":1,"176":1,"178":1}}],["source",{"0":{"54":1},"2":{"54":1,"115":8,"142":1}}],["some",{"2":{"36":1,"115":4,"146":1,"147":1,"175":2}}],["solid",{"2":{"29":1,"77":1,"78":1,"79":1,"80":1,"81":1,"82":1,"97":1,"98":1,"99":2,"100":1,"101":1,"106":3,"107":1,"146":2,"147":5,"150":1,"152":1,"179":1,"182":37,"214":2,"219":4}}],["situation",{"2":{"212":1,"214":1,"216":1,"217":1,"218":1,"219":1,"220":1,"221":1}}],["since",{"2":{"139":1,"140":1,"141":1,"144":1}}],["single",{"2":{"136":1,"137":1,"141":1,"200":1}}],["sign",{"0":{"65":1},"2":{"65":1}}],["size",{"0":{"67":1},"2":{"29":2,"67":1,"76":3,"77":2,"79":2,"82":4,"97":2,"98":1,"99":3,"100":1,"101":3,"106":1,"115":4,"147":1,"150":1,"152":1,"168":2,"175":3,"182":31,"186":2,"212":1,"214":1,"216":1,"217":1,"218":1,"219":1,"220":1,"221":1}}],["side",{"2":{"18":1,"132":1,"133":1}}],["simple",{"2":{"171":1,"184":1}}],["simpletag",{"2":{"16":1,"25":1,"173":1}}],["simpleannotation",{"2":{"16":1,"25":1,"173":1,"211":2}}],["standard",{"2":{"182":4,"221":2}}],["started",{"2":{"171":1}}],["starting",{"2":{"75":2,"76":2,"77":1,"81":2,"82":2,"100":2,"101":2,"115":1}}],["startangle",{"2":{"71":2,"77":2,"97":1}}],["start",{"0":{"177":1},"1":{"178":1,"179":1},"2":{"47":2,"71":1,"76":1,"82":1,"97":1,"115":3,"152":2,"175":2,"179":3}}],["step",{"0":{"106":1,"107":1,"116":1,"117":1},"2":{"175":1}}],["steps",{"2":{"47":1,"175":1,"176":1}}],["straightline",{"2":{"173":1}}],["strokestyle",{"2":{"107":1}}],["stroke",{"2":{"78":2,"80":2,"81":2,"82":2,"98":2,"99":2,"100":2,"101":2,"106":4,"107":4,"146":4,"147":4,"176":1,"182":25,"214":6,"218":1}}],["strong",{"2":{"47":2,"150":2,"152":2,"175":2}}],["strings",{"2":{"182":1}}],["string>",{"2":{"36":1}}],["string",{"2":{"13":1,"18":1,"36":11,"37":1,"38":7,"39":1,"40":1,"41":1,"42":1,"43":1,"44":1,"45":16,"46":1,"47":13,"48":1,"49":3,"50":3,"51":1,"55":1,"61":1,"62":2,"63":2,"64":2,"65":3,"66":2,"67":3,"76":3,"77":1,"78":2,"79":1,"80":2,"81":2,"82":5,"85":5,"97":1,"98":2,"99":3,"100":2,"101":5,"104":1,"115":14,"119":1,"120":1,"121":1,"124":1,"125":1,"146":23,"147":19,"148":2,"149":2,"150":11,"151":1,"152":4,"153":4,"161":2,"165":1,"166":1,"167":3,"175":6,"182":1}}],["style=",{"2":{"179":7,"212":1,"213":1,"214":1,"215":1,"216":1,"217":1,"218":1,"219":1,"220":1,"221":1}}],["styles",{"0":{"41":1,"76":1,"77":1,"78":1,"79":1,"80":1,"81":1,"82":1,"83":1,"121":1},"2":{"7":1,"13":2,"36":4,"41":2,"42":2,"45":5,"47":9,"76":3,"77":3,"78":3,"79":3,"80":3,"81":3,"82":3,"83":2,"95":3,"97":1,"98":1,"99":2,"100":1,"101":1,"104":2,"106":1,"107":4,"115":2,"121":3,"122":1,"146":3,"147":6,"150":3,"152":4,"175":3,"176":1,"180":1,"189":2,"191":2,"218":1}}],["style",{"0":{"180":1,"186":1},"1":{"181":1,"182":1},"2":{"2":1,"3":1,"10":1,"13":2,"14":2,"16":1,"17":1,"18":1,"22":1,"23":1,"24":1,"29":4,"36":1,"41":4,"77":3,"78":4,"79":3,"80":4,"81":4,"82":4,"97":2,"98":3,"99":5,"100":3,"101":3,"104":2,"106":5,"107":5,"115":11,"121":3,"122":1,"146":2,"147":5,"150":1,"152":1,"171":1,"175":6,"176":2,"180":1,"182":23,"186":1,"208":1,"217":1,"218":1,"219":6}}],["sending",{"2":{"222":1}}],["sensitivity",{"2":{"18":1,"47":1,"152":1,"175":1}}],["serving",{"2":{"200":1}}],["series",{"2":{"45":3,"115":2,"123":1,"146":1,"147":4}}],["segment",{"2":{"150":3,"152":3,"173":1}}],["second",{"2":{"116":1}}],["selector",{"2":{"179":1}}],["select",{"2":{"175":1,"176":1}}],["selected",{"2":{"47":1,"152":1}}],["selections",{"2":{"176":1}}],["selection",{"2":{"25":1}}],["seen",{"0":{"206":1}}],["see",{"2":{"36":1,"42":1,"47":1,"115":3,"175":1,"180":1,"197":1,"206":1,"210":1}}],["setindicatortooltipshowtype",{"2":{"221":2}}],["setindicatortooltipshowrule",{"2":{"221":2}}],["setinside",{"2":{"212":2}}],["setcandletooltipshowtype",{"2":{"221":2}}],["setcandletooltipshowrule",{"2":{"221":2}}],["setcustomapi",{"2":{"29":1}}],["setmainindicator",{"2":{"217":2}}],["setmaxoffsetleftdistance",{"0":{"132":1}}],["setmaxoffsetrightdistance",{"0":{"133":1},"2":{"12":1}}],["setreverse",{"2":{"212":2}}],["setrightminvisiblebarcount",{"0":{"135":1}}],["settheme",{"2":{"219":2}}],["settype",{"2":{"212":2,"214":2}}],["settimeout",{"2":{"215":2}}],["settimezone",{"0":{"124":1},"2":{"220":3}}],["settings",{"2":{"208":1}}],["setting",{"2":{"123":1}}],["setup>",{"2":{"179":1}}],["setbarspace",{"0":{"136":1}}],["setzoomenabled",{"0":{"126":1}}],["setposition",{"2":{"212":2}}],["setpricevolumeprecision",{"0":{"123":1},"2":{"207":1}}],["setpaneoptions",{"0":{"89":1,"161":1},"2":{"20":1,"29":1,"86":1,"161":1}}],["setlang",{"2":{"216":2}}],["setloaddatacallback",{"0":{"145":1},"2":{"144":1}}],["setlocale",{"2":{"29":1,"111":1,"216":1}}],["setleftminvisiblebarcount",{"0":{"134":1}}],["setlinedash",{"2":{"107":2}}],["set",{"2":{"36":1,"99":2,"115":3,"121":1,"124":2,"126":1,"128":1,"130":1,"132":1,"133":1,"134":1,"135":1,"136":1,"144":1,"145":1,"147":1,"161":1,"207":1}}],["setsubindicator",{"2":{"217":2}}],["setscrollenabled",{"0":{"128":1}}],["setshapeoptions",{"2":{"29":1,"189":1}}],["setstyles",{"0":{"121":1},"2":{"29":1,"180":1,"189":1,"208":1,"212":4,"214":1,"219":1,"221":4}}],["setstyleoptions",{"2":{"29":1,"189":1}}],["setoffsetrightdistance",{"0":{"130":1},"2":{"29":1,"189":1}}],["setoffsetrightspace",{"2":{"29":1,"189":1}}],["separator",{"2":{"13":1,"17":1,"36":1,"65":1,"175":1,"182":1}}],["such",{"2":{"36":2,"61":1,"63":1,"64":1,"95":1,"124":1,"200":3}}],["success",{"2":{"23":1,"139":1,"140":1,"141":1,"146":1,"147":1}}],["supported",{"2":{"40":1,"43":1,"162":1}}],["supports",{"2":{"18":1,"19":1,"20":1,"27":1,"36":1,"92":1,"108":1,"119":1,"120":1,"121":1,"178":1,"182":1}}],["support",{"0":{"92":1},"2":{"7":1,"10":4,"16":1,"17":1,"23":1,"25":1,"29":1,"36":1,"41":1,"46":1,"48":1,"61":1,"84":1,"115":1,"171":1,"210":1}}],["subtitle",{"2":{"217":4}}],["subindicators",{"2":{"217":2}}],["subordinate",{"2":{"200":1}}],["subkey",{"2":{"117":1}}],["subscribing",{"2":{"164":1}}],["subscribe",{"2":{"163":1}}],["subscribeaction",{"0":{"163":1},"2":{"1":1,"27":1,"139":1,"141":1,"189":1}}],["subsequent",{"2":{"117":1,"146":1}}],["sub",{"2":{"1":1,"86":1,"191":1,"217":1}}],["sponsoring",{"2":{"222":1}}],["sponsor",{"0":{"222":1,"223":1},"1":{"223":1,"224":2,"225":2,"226":2},"2":{"222":1}}],["span",{"2":{"217":2,"221":2}}],["space",{"0":{"136":1},"2":{"136":1,"189":1}}],["spaces",{"2":{"6":1}}],["special",{"2":{"47":2,"146":1,"147":1,"148":1,"149":1,"150":1,"161":1,"175":1}}],["specified",{"2":{"105":1,"115":2,"156":1,"157":1,"160":1}}],["specifies",{"2":{"45":2,"147":2}}],["specify",{"2":{"86":2}}],["specifying",{"2":{"5":1}}],["2px",{"2":{"212":1,"214":1,"216":1,"217":1,"218":1,"219":1,"220":1,"221":1}}],["2196f3",{"2":{"182":2}}],["2000",{"2":{"215":1}}],["204",{"2":{"179":7}}],["20",{"2":{"113":6,"147":1,"179":21,"215":1}}],["2023",{"2":{"11":1,"12":1,"13":1,"14":1,"15":1,"16":1,"17":1,"18":1,"19":1,"20":1,"21":1,"22":1,"23":1,"24":1,"25":1,"26":1,"27":1,"28":1,"29":1}}],["2024",{"2":{"1":1,"2":1,"3":1,"4":1,"5":1,"6":1,"7":1,"8":1,"9":1,"10":2}}],["230",{"2":{"182":3}}],["23",{"2":{"27":1}}],["249",{"2":{"182":3,"219":1}}],["243",{"2":{"182":6}}],["2432435",{"2":{"147":1}}],["24",{"2":{"23":1,"113":4}}],["2dc08e",{"2":{"22":1,"182":4,"219":1}}],["27",{"2":{"22":1}}],["255",{"2":{"182":4}}],["25",{"2":{"19":1,"182":2}}],["22px",{"2":{"212":1,"214":1,"216":1,"217":1,"218":1,"219":1,"220":1,"221":1}}],["22",{"2":{"14":1,"182":4}}],["26a69a",{"2":{"22":1,"147":2}}],["26",{"2":{"8":1,"113":3}}],["2",{"0":{"8":1,"16":1,"21":2,"22":1,"23":1,"25":1,"107":1,"117":1,"131":1,"162":1},"2":{"107":11,"113":4,"116":1,"139":1,"140":1,"141":1,"146":1,"147":6,"150":3,"152":3,"161":1,"176":1,"182":52,"212":4,"213":4,"214":4,"215":4,"216":4,"217":4,"218":5,"219":12,"220":4,"221":4}}],["28",{"2":{"2":1,"179":21}}],["0xd2c3911654db861e0a2e17415e11a209c1fc3594",{"2":{"226":2}}],["000000",{"2":{"179":1}}],["02",{"2":{"27":1,"28":1,"29":1,"179":7}}],["08",{"2":{"17":1}}],["09",{"2":{"14":1,"15":1,"16":1,"179":7}}],["01c5c4",{"2":{"182":1}}],["01",{"2":{"10":1,"182":1}}],["0",{"0":{"10":1,"12":1,"13":1,"18":1,"19":1,"20":1,"23":1,"27":1,"28":1,"29":2,"49":1,"50":1,"66":1,"67":1,"84":1,"131":1,"132":1,"133":1,"145":1,"162":1},"1":{"85":1,"86":1,"87":1,"88":1,"89":1},"2":{"36":2,"47":2,"117":1,"139":2,"140":2,"141":2,"144":1,"146":5,"147":1,"150":1,"152":3,"161":4,"176":3,"182":23,"212":3,"213":3,"214":3,"215":3,"216":3,"217":3,"218":6,"219":3,"220":3,"221":4}}],["03",{"2":{"8":1,"9":1,"10":1,"26":1}}],["04",{"2":{"6":1,"7":1,"10":1,"21":1,"22":1,"23":1,"24":1,"25":1}}],["07",{"2":{"5":1}}],["05",{"2":{"2":1,"3":1,"4":1,"5":1,"19":1,"20":1,"21":1}}],["06",{"2":{"1":2,"18":1,"179":7}}],["dts",{"2":{"203":2}}],["d9d9d9",{"2":{"182":6}}],["d>>",{"2":{"115":1}}],["dma",{"2":{"113":1}}],["dmi",{"2":{"113":1}}],["dd",{"2":{"64":1}}],["during",{"2":{"47":1,"175":4}}],["duplicate",{"2":{"7":1}}],["dcs",{"0":{"37":1},"2":{"37":2}}],["dark",{"2":{"219":3}}],["date",{"2":{"36":1,"64":1,"175":1,"212":1,"213":1,"214":1,"215":1,"216":1,"217":1,"218":1,"219":1,"220":1,"221":1}}],["datetimeformat",{"0":{"64":1},"2":{"36":2,"64":2,"175":3}}],["datasource",{"2":{"191":2}}],["dataindex",{"0":{"156":1,"159":1},"2":{"47":1,"115":1,"150":2,"152":1,"156":2,"159":2,"165":4,"166":2,"175":3}}],["datalist",{"0":{"139":1,"140":1},"2":{"45":1,"90":2,"115":1,"139":2,"140":2,"145":1,"146":1,"147":1,"212":3,"213":3,"214":3,"215":6,"216":3,"217":3,"218":3,"219":3,"220":3,"221":3}}],["data",{"0":{"90":1,"141":1,"162":1,"209":1,"215":1},"2":{"1":1,"7":1,"10":1,"24":1,"45":4,"47":1,"61":1,"90":4,"115":27,"117":3,"139":6,"140":5,"141":7,"142":3,"143":2,"144":1,"145":5,"146":3,"147":4,"152":1,"156":1,"159":1,"162":3,"163":1,"164":1,"165":1,"175":4,"200":2,"217":3}}],["dashvalue",{"2":{"29":1,"186":1}}],["dashedvalue",{"2":{"29":1,"77":2,"79":2,"97":1,"99":1,"106":2,"147":1,"150":1,"152":1,"182":12,"186":1}}],["dashed",{"2":{"29":1,"77":2,"78":2,"79":2,"80":2,"81":2,"82":2,"97":1,"98":1,"99":2,"100":1,"101":1,"106":4,"107":1,"146":2,"147":2,"182":22,"186":1}}],["does",{"2":{"204":1}}],["doctype",{"2":{"179":1}}],["docs",{"2":{"175":1}}],["document",{"2":{"94":1,"112":1,"172":1,"183":2,"197":1,"212":6,"214":3,"216":3,"217":6,"218":3,"219":5,"220":3,"221":9}}],["do",{"0":{"207":1,"209":1,"211":1},"2":{"110":1,"115":5,"175":6}}],["dotted",{"2":{"97":1,"98":1,"99":2,"100":1,"101":1}}],["domid",{"2":{"87":2}}],["dom",{"2":{"36":1,"37":1,"119":1,"189":1,"200":1}}],["double",{"2":{"27":1,"47":1,"152":1,"175":1}}],["downcolor",{"2":{"147":2,"182":5,"219":10}}],["down",{"2":{"115":1,"175":2,"182":1,"214":2}}],["downwickcolor",{"2":{"23":1,"182":1,"219":2}}],["downbordercolor",{"2":{"23":1,"182":1,"219":2}}],["download",{"2":{"11":1,"178":3}}],["drag",{"2":{"175":3}}],["dragged",{"2":{"146":1,"161":1}}],["dragging",{"2":{"47":1,"128":1,"129":1,"152":1}}],["dragenabled",{"2":{"36":1,"146":3,"161":3}}],["drawrecttext",{"0":{"82":1,"83":1},"2":{"83":2}}],["drawrect",{"0":{"81":1}}],["drawpolygon",{"0":{"80":1}}],["drawline",{"0":{"79":1}}],["drawcircle",{"0":{"78":1}}],["drawarc",{"0":{"77":1}}],["draw",{"2":{"29":1,"42":2,"45":2,"47":2,"77":1,"78":1,"79":1,"80":1,"81":1,"82":1,"95":2,"104":2,"107":4,"115":1,"146":1,"147":3,"152":2,"175":3,"191":1,"217":1}}],["drawn",{"2":{"25":1,"115":2,"152":1}}],["drawing",{"2":{"1":1,"8":2,"10":1,"27":1,"42":1,"45":1,"47":2,"115":1,"143":1,"147":1,"152":2,"171":1,"175":4,"176":1}}],["drop",{"2":{"18":1}}],["ds",{"0":{"36":1},"2":{"13":1,"36":2,"86":1,"180":1}}],["dir",{"2":{"202":1}}],["directory",{"0":{"199":1}}],["directly",{"2":{"176":1}}],["direction",{"2":{"29":1}}],["diagram",{"2":{"200":1}}],["diamond",{"2":{"105":1,"107":3}}],["div>",{"2":{"179":1,"212":1,"214":1,"216":1,"217":1,"218":1,"219":1,"220":1,"221":1}}],["div",{"2":{"179":7,"212":3,"213":1,"214":3,"215":1,"216":3,"217":3,"218":3,"219":3,"220":3,"221":4}}],["dividing",{"2":{"18":1}}],["dimensions",{"2":{"115":1,"120":1,"175":1}}],["different",{"2":{"10":1,"141":1}}],["discussion",{"0":{"195":1}}],["discussions",{"2":{"193":2}}],["distribution",{"2":{"200":1}}],["distinguished",{"2":{"184":1}}],["dist",{"2":{"178":1,"179":1}}],["distance",{"0":{"130":1,"154":1},"2":{"6":1,"115":8,"130":1,"132":1,"133":1,"154":4,"155":1,"175":4,"189":1}}],["dispose",{"0":{"37":1},"2":{"179":11}}],["displayed",{"2":{"115":2}}],["displaying",{"2":{"24":1}}],["display",{"2":{"6":1,"7":1,"8":1,"9":1,"10":2,"13":2,"14":2,"19":1,"23":1,"24":1,"45":1,"90":1,"115":2,"116":1,"147":1,"182":2,"212":1,"214":1,"216":1,"217":1,"218":1,"219":1,"220":1,"221":2,"222":2}}],["demonstration",{"2":{"212":1,"214":1,"216":1,"217":1,"218":1,"219":1,"220":1,"221":1}}],["debugging",{"2":{"204":1}}],["debug",{"0":{"204":1},"2":{"204":1}}],["dev",{"2":{"203":3}}],["developers",{"2":{"195":1}}],["developer",{"2":{"175":1}}],["development",{"0":{"196":1,"201":1},"1":{"197":1,"198":1,"199":1,"200":1,"201":1,"202":2,"203":2,"204":2},"2":{"23":1,"171":1,"178":2,"203":4}}],["deleting",{"2":{"200":1}}],["deleted",{"2":{"83":1,"102":1}}],["delete",{"2":{"29":8,"47":1,"152":1,"175":2,"186":1,"188":1,"189":5,"191":1}}],["determined",{"2":{"191":1}}],["determine",{"2":{"106":1,"116":1,"117":1,"176":1}}],["details",{"2":{"36":1,"42":1,"47":1,"121":1,"139":1,"140":1,"141":1,"175":1,"185":1,"210":1}}],["definition",{"2":{"171":1}}],["define",{"2":{"106":2}}],["defined",{"2":{"87":1}}],["defaulted",{"2":{"139":1,"140":1,"146":2,"148":1,"158":1,"161":2,"167":3,"175":8}}],["defaultticks",{"2":{"85":1}}],["defaultvalue",{"0":{"61":1},"2":{"61":1,"182":2}}],["defaultstyles",{"2":{"45":2,"115":3,"146":2,"147":2,"175":1,"191":3}}],["defaultzlevel",{"2":{"19":1}}],["default",{"0":{"182":1},"2":{"6":1,"7":2,"22":1,"47":3,"85":1,"109":1,"113":3,"115":10,"119":2,"120":2,"139":1,"140":1,"146":5,"147":1,"148":1,"149":1,"150":1,"152":3,"154":2,"155":2,"156":2,"157":2,"158":3,"159":2,"160":2,"161":3,"164":1,"167":2,"175":12,"176":1,"179":3,"207":1}}],["dependencies",{"0":{"200":1,"202":1},"2":{"171":1,"202":1}}],["dependency",{"2":{"11":1,"202":1,"203":2}}],["deprecated",{"2":{"83":1,"102":1,"139":1,"140":1,"141":1,"144":1}}],["design",{"0":{"185":1}}],["description",{"0":{"104":1,"115":1,"175":1,"199":1,"203":1},"1":{"116":1,"117":1},"2":{"179":1}}],["describes",{"2":{"94":1}}],["deselected",{"2":{"47":1,"152":1}}],["destroyed",{"2":{"37":1}}],["destroys",{"2":{"37":1}}],["deep",{"2":{"53":1}}],["deeprequired",{"2":{"24":1}}],["deeppartial",{"2":{"24":1}}],["decimalfoldthreshold",{"2":{"36":2,"175":1}}],["decimals",{"2":{"10":1}}],["decimal",{"2":{"3":1,"5":1,"9":1,"36":1,"66":1,"175":1,"207":1}}],["declarations",{"2":{"22":1}}],["declaration",{"2":{"2":1,"16":1,"18":1}}],["px",{"2":{"217":1}}],["purpose",{"2":{"212":1,"214":1,"216":1,"217":1,"218":1,"219":1,"220":1,"221":1}}],["push",{"2":{"212":2,"213":2,"214":2,"215":2,"216":2,"217":2,"218":2,"219":2,"220":2,"221":2}}],["pnpm",{"2":{"178":1,"202":1}}],["png",{"2":{"167":1}}],["picture",{"0":{"181":1},"2":{"146":1,"147":1,"148":1,"149":1,"150":1,"161":1}}],["piece",{"2":{"141":1,"144":1}}],["pixel",{"2":{"20":1}}],["p",{"2":{"117":2}}],["pvt",{"2":{"113":1}}],["psy",{"2":{"113":1}}],["personal",{"2":{"222":1}}],["perform",{"2":{"200":1}}],["performpoint",{"2":{"175":1}}],["performpointindex",{"2":{"175":1}}],["performance",{"2":{"168":1}}],["performeventmovefordrawing",{"2":{"47":2,"175":1}}],["performeventpressedmove",{"2":{"47":2,"175":1}}],["periods",{"2":{"116":1}}],["percentage",{"2":{"2":1,"146":2,"161":2,"182":1,"212":2}}],["powerful",{"2":{"171":1}}],["polyfill",{"0":{"93":1}}],["polygon",{"0":{"74":1,"80":1},"2":{"74":2,"80":4,"96":1,"99":1,"182":1,"200":1}}],["pointer",{"2":{"182":1}}],["point",{"0":{"211":1},"2":{"47":2,"69":1,"70":1,"71":2,"72":2,"73":1,"74":1,"75":4,"76":4,"81":2,"82":2,"100":2,"101":2,"106":2,"115":1,"152":2,"158":2,"175":5,"176":2,"180":1,"182":2}}],["points",{"2":{"47":3,"68":2,"69":1,"150":3,"152":3,"175":5,"189":1}}],["positions",{"2":{"212":2}}],["position",{"0":{"119":1,"120":1},"2":{"13":1,"23":1,"36":1,"87":1,"119":2,"120":3,"146":2,"155":1,"159":1,"182":4,"189":5,"212":2}}],["possible",{"2":{"1":1,"128":1,"129":1}}],["plugin",{"2":{"222":1}}],["plotting",{"2":{"200":1}}],["plots",{"2":{"29":1,"191":1}}],["please",{"2":{"36":1,"83":1,"92":1,"102":1,"121":1,"124":1,"139":1,"140":1,"141":1,"142":1,"168":1,"183":1,"184":1,"185":1,"186":1,"188":1,"189":3,"222":1}}],["pay",{"0":{"225":1}}],["payment",{"2":{"222":1}}],["parallellfilineline",{"2":{"173":1}}],["param",{"2":{"117":4}}],["params",{"0":{"85":1},"2":{"45":2,"47":5,"49":1,"50":1,"85":1,"113":3,"115":2,"117":2,"145":3,"146":2,"147":2,"175":1,"191":2}}],["parameters",{"2":{"5":1,"24":1,"36":1,"45":1,"98":1,"100":1,"115":1,"116":2,"117":3,"147":2,"150":1,"152":1,"175":3}}],["parameter",{"2":{"1":2,"3":1,"13":2,"24":1,"71":1,"72":1,"75":1,"76":1,"77":2,"78":2,"79":2,"80":2,"81":2,"82":2,"86":2,"97":1,"99":2,"101":1,"115":3,"117":2,"146":1,"189":3}}],["participates",{"2":{"175":2}}],["part",{"2":{"94":1}}],["padding",{"2":{"82":4,"101":4,"212":2,"214":2,"216":2,"217":2,"218":2,"219":2,"220":2,"221":2}}],["paddingright",{"2":{"82":2,"101":1,"182":9}}],["paddingbottom",{"2":{"29":2,"82":2,"101":1,"182":9,"186":2}}],["paddingtop",{"2":{"29":2,"82":2,"101":1,"182":9,"186":2}}],["paddingleft",{"2":{"14":1,"82":2,"101":1,"182":9,"217":1}}],["panes",{"2":{"200":1}}],["paneid",{"0":{"119":1,"120":1,"147":1,"148":1,"149":1,"150":1},"2":{"19":1,"115":1,"119":2,"120":2,"147":2,"148":2,"149":2,"150":2,"165":2,"166":2,"189":19,"211":1}}],["pane",{"2":{"18":1,"89":1,"146":3,"147":2,"148":1,"149":1,"150":1,"161":2,"200":1,"217":1,"221":1}}],["paneoptions",{"0":{"146":1},"2":{"13":2,"86":3,"146":2,"189":2}}],["packages",{"2":{"178":1}}],["package",{"2":{"11":1,"178":2,"202":1}}],["preact",{"2":{"179":1}}],["prev",{"2":{"115":1}}],["previous",{"2":{"115":1,"183":1}}],["prevent",{"2":{"47":1,"152":1}}],["press",{"2":{"47":4,"152":3,"175":2}}],["precision",{"2":{"3":1,"4":2,"45":3,"62":2,"115":2,"123":3,"146":1,"147":4,"175":4,"207":2}}],["production",{"2":{"203":4}}],["prod",{"2":{"203":1}}],["project",{"2":{"202":1,"204":4,"212":1,"214":1,"216":1,"217":1,"218":1,"219":1,"220":1,"221":1}}],["process",{"2":{"175":2}}],["processing",{"2":{"47":1}}],["provided",{"2":{"178":1}}],["provide",{"2":{"171":1,"222":1}}],["professional",{"2":{"170":1}}],["prompt",{"2":{"117":1}}],["promise",{"2":{"45":1,"115":2,"146":1,"147":1}}],["properties",{"2":{"104":2,"175":1}}],["property",{"2":{"18":1}}],["prices",{"2":{"212":7,"213":7,"214":7,"215":7,"216":7,"217":7,"218":7,"219":7,"220":7,"221":7}}],["pricechannelline",{"2":{"173":1}}],["priceline",{"2":{"173":1,"218":1}}],["priceprecision",{"0":{"123":1},"2":{"123":2,"207":1}}],["pricemark",{"2":{"29":1,"182":1,"219":2}}],["price",{"2":{"4":1,"14":1,"45":2,"90":4,"115":1,"116":1,"123":3,"146":1,"147":3,"175":2,"207":1,"218":1}}],["css",{"2":{"212":1,"214":1,"216":1,"217":1,"218":1,"219":1,"220":1,"221":1}}],["cjs",{"2":{"203":2}}],["cdn",{"2":{"178":2,"179":1}}],["ci",{"2":{"173":1}}],["circles",{"2":{"29":1,"147":1,"182":1,"186":1,"219":2}}],["circle",{"0":{"72":1,"78":1,"98":1},"2":{"29":1,"71":2,"72":6,"77":2,"78":6,"95":1,"96":1,"97":2,"98":2,"176":5,"182":1,"186":1,"200":1,"218":5}}],["cb",{"0":{"144":1,"145":1},"2":{"144":2,"145":2}}],["cycle",{"2":{"116":2}}],["cci",{"2":{"113":1}}],["center",{"2":{"71":2,"72":2,"76":1,"77":2,"78":2,"82":1,"97":2,"98":2,"106":2,"212":1,"214":1,"216":1,"217":2,"218":1,"219":1,"220":1,"221":1}}],["certain",{"2":{"61":1,"71":1,"72":1,"73":1,"74":1,"75":1,"76":1,"154":1,"158":1,"159":1,"175":1}}],["c",{"2":{"61":3}}],["ctx",{"0":{"77":1,"78":1,"79":1,"80":1,"81":1,"82":1,"83":1},"2":{"42":1,"77":2,"78":2,"79":2,"80":2,"81":2,"82":2,"83":2,"95":2,"104":1,"107":21,"115":1,"191":2,"217":4}}],["cn",{"2":{"36":1,"38":1,"109":1,"179":1,"216":1}}],["cup",{"2":{"222":1}}],["currentstep",{"2":{"175":1}}],["currently",{"2":{"108":1,"109":1,"141":1}}],["currentcolor",{"2":{"107":2}}],["current",{"2":{"51":1,"115":2,"142":1,"164":1,"175":1}}],["cursor",{"2":{"24":1,"115":2}}],["customxaxisname",{"2":{"87":2}}],["customyaxisname",{"2":{"87":2,"88":2,"89":2}}],["customizable",{"2":{"170":1}}],["customization",{"2":{"20":1,"105":1}}],["customizing",{"2":{"87":2,"88":1,"89":1}}],["customized",{"0":{"191":1}}],["customize",{"0":{"103":1},"1":{"104":1,"105":1,"106":1,"107":1},"2":{"36":1,"94":1,"112":1,"172":1,"174":1,"180":1}}],["customapi",{"2":{"36":2}}],["custom",{"0":{"84":1,"114":1,"174":1},"1":{"85":1,"86":1,"87":1,"88":1,"89":1,"115":1,"116":1,"117":1,"175":1,"176":1},"2":{"3":1,"10":1,"13":1,"17":1,"18":1,"29":2,"36":1,"45":2,"49":1,"50":1,"84":1,"94":1,"103":1,"107":1,"114":1,"115":2,"117":1,"147":2,"176":1,"182":2,"186":1,"210":1,"217":3,"218":1}}],["chicago",{"2":{"220":2}}],["child",{"2":{"182":1,"221":1}}],["chinese",{"2":{"110":1}}],["checking",{"2":{"206":1}}],["checkcoordinateontext",{"0":{"76":1}}],["checkcoordinateonrect",{"0":{"75":1}}],["checkcoordinateonpolygon",{"0":{"74":1}}],["checkcoordinateonline",{"0":{"73":1}}],["checkcoordinateoncircle",{"0":{"72":1}}],["checkcoordinateonarc",{"0":{"71":1}}],["checks",{"2":{"42":1,"55":1,"56":1,"57":1,"58":1,"59":1,"60":1,"72":1,"74":1,"75":1}}],["checkeventon",{"2":{"42":2,"104":1,"107":2}}],["check",{"2":{"21":2,"30":1,"31":1,"32":1,"71":1,"73":1,"76":1,"104":1}}],["channels",{"0":{"223":1},"1":{"224":1,"225":1,"226":1}}],["changing",{"2":{"22":1}}],["changes",{"2":{"180":1}}],["changed",{"2":{"29":25,"117":2,"186":10,"188":1,"189":11,"191":4}}],["change",{"0":{"0":1},"1":{"1":1,"2":1,"3":1,"4":1,"5":1,"6":1,"7":1,"8":1,"9":1,"10":1,"11":1,"12":1,"13":1,"14":1,"15":1,"16":1,"17":1,"18":1,"19":1,"20":1,"21":1,"22":1,"23":1,"24":1,"25":1,"26":1,"27":1,"28":1,"29":1,"30":1,"31":1,"32":1,"33":1,"34":1},"2":{"7":1,"17":1,"29":1,"30":1,"31":1,"32":1,"110":1,"115":1,"117":1,"191":2}}],["chat",{"2":{"195":1}}],["charset=",{"2":{"179":1}}],["character",{"2":{"5":1}}],["chartcomponent",{"2":{"179":1}}],["chartstore",{"2":{"200":2}}],["charts",{"2":{"38":1,"210":1}}],["chart",{"0":{"35":1,"87":1,"179":1,"188":1,"206":1,"208":1},"1":{"36":1,"37":1,"38":1,"39":1,"40":1,"41":1,"42":1,"43":1,"44":1,"45":1,"46":1,"47":1,"48":1,"49":1,"50":1,"51":1,"52":1,"53":1,"54":1,"55":1,"56":1,"57":1,"58":1,"59":1,"60":1,"61":1,"62":1,"63":1,"64":1,"65":1,"66":1,"67":1,"68":1,"69":1,"70":1,"71":1,"72":1,"73":1,"74":1,"75":1,"76":1,"77":1,"78":1,"79":1,"80":1,"81":1,"82":1,"83":1},"2":{"5":1,"6":3,"8":1,"9":1,"13":1,"17":1,"20":1,"24":2,"27":1,"29":3,"36":3,"37":4,"39":1,"40":1,"46":1,"48":1,"51":1,"84":2,"86":1,"90":3,"92":1,"94":3,"96":1,"103":1,"109":1,"111":1,"112":1,"114":1,"115":1,"119":1,"120":1,"125":1,"130":1,"131":1,"132":1,"133":1,"136":1,"137":1,"139":2,"140":1,"142":1,"143":2,"145":1,"146":2,"158":1,"162":1,"163":1,"164":1,"167":1,"168":2,"170":1,"171":1,"172":1,"174":1,"176":1,"179":36,"180":3,"200":3,"206":1,"207":1,"209":1,"211":1,"212":8,"213":4,"214":5,"215":9,"216":5,"217":6,"218":5,"219":8,"220":5,"221":10}}],["clean",{"2":{"203":3}}],["cleared",{"2":{"143":1}}],["cleardata",{"0":{"143":1},"2":{"139":1}}],["clear",{"2":{"139":1,"143":1}}],["click",{"2":{"47":3,"152":3,"175":4,"212":4,"214":1,"216":1,"217":2,"218":1,"219":1,"220":1,"221":4,"222":1}}],["clicking",{"2":{"27":1}}],["classname",{"2":{"212":1,"214":1,"216":1,"217":1,"218":1,"219":1,"220":1,"221":2}}],["class",{"2":{"44":1,"95":1,"179":1}}],["clarity",{"2":{"10":1}}],["closing",{"2":{"116":1,"182":1}}],["closesums",{"2":{"117":5}}],["closepath",{"2":{"107":2}}],["close",{"2":{"38":1,"90":2,"110":1,"117":4,"139":1,"140":1,"141":1,"142":1,"179":70,"182":5,"212":4,"213":4,"214":4,"215":7,"216":5,"217":5,"218":4,"219":4,"220":4,"221":4}}],["clone",{"0":{"53":1},"2":{"13":1}}],["code",{"2":{"203":1,"212":1,"214":1,"216":1,"217":1,"218":1,"219":1,"220":1,"221":1}}],["commonjs",{"2":{"203":3}}],["command",{"0":{"203":1}}],["com",{"2":{"193":2,"222":2}}],["combined",{"2":{"189":1}}],["compression",{"2":{"171":1}}],["components",{"2":{"200":1}}],["component",{"2":{"115":4,"175":2,"179":2}}],["composed",{"2":{"68":1,"94":1}}],["completely",{"2":{"222":1}}],["completes",{"2":{"179":1}}],["complete",{"2":{"111":1,"122":1,"171":1,"175":1,"176":2}}],["completed",{"2":{"86":1,"107":1,"117":1}}],["complex",{"2":{"94":1}}],["core",{"2":{"179":1,"197":1,"203":2}}],["corresponds",{"2":{"165":1}}],["corresponding",{"2":{"47":1,"61":1,"117":1,"175":8,"176":2,"189":1}}],["cost",{"2":{"171":1}}],["copy",{"2":{"53":1}}],["collection",{"2":{"52":1}}],["color",{"2":{"45":2,"76":3,"77":3,"78":4,"79":3,"80":4,"81":4,"82":5,"97":2,"98":3,"99":5,"100":3,"101":4,"106":4,"107":2,"115":2,"146":4,"147":5,"150":1,"152":1,"167":1,"179":1,"182":39,"191":3,"212":2,"214":2,"216":2,"217":2,"218":2,"219":2,"220":2,"221":2}}],["coord",{"2":{"49":1,"50":1,"85":2}}],["coordinates",{"2":{"73":1,"74":1,"79":1,"80":1,"99":4,"104":1,"165":1,"166":1,"175":1,"176":7,"218":7}}],["coordinate2",{"0":{"68":1,"69":1},"2":{"68":1,"69":1}}],["coordinate1",{"0":{"68":1,"69":1},"2":{"68":1,"69":1}}],["coordinate",{"0":{"71":1,"72":1,"73":1,"74":1,"75":1,"76":1,"158":1,"166":1},"2":{"10":1,"42":2,"45":2,"68":1,"69":2,"70":1,"71":4,"72":4,"73":2,"74":2,"75":4,"76":4,"86":1,"97":2,"98":2,"100":2,"101":2,"104":1,"106":2,"107":3,"115":2,"146":1,"147":1,"158":4,"165":1,"166":3,"175":1,"189":1}}],["coverage",{"2":{"24":1}}],["console",{"2":{"150":14,"152":14}}],["consistent",{"2":{"117":2,"146":1,"150":1,"175":3}}],["constructor",{"2":{"175":1}}],["constant",{"2":{"68":1,"70":1}}],["const",{"2":{"61":1,"95":1,"107":5,"117":3,"176":3,"179":6,"212":19,"213":9,"214":13,"215":12,"216":13,"217":23,"218":16,"219":17,"220":13,"221":20}}],["connecting",{"2":{"116":1}}],["configure",{"2":{"176":1,"182":1}}],["configured",{"2":{"115":1,"116":1}}],["configuration",{"0":{"182":1,"186":1},"2":{"2":1,"3":1,"13":1,"17":1,"18":1,"20":1,"23":1,"29":3,"36":1,"38":1,"41":2,"45":1,"115":1,"116":1,"121":2,"122":1,"146":1,"147":1,"161":2,"171":1,"175":1}}],["conversion",{"2":{"115":4,"175":2}}],["convertfrompixel",{"0":{"166":1},"2":{"189":1}}],["convert",{"2":{"165":1,"166":1}}],["converttopixel",{"0":{"165":1},"2":{"189":1,"217":2}}],["converttimestamptopixel",{"2":{"19":1}}],["converttimestampfrompixel",{"2":{"19":1}}],["converted",{"2":{"45":2,"147":2,"165":2,"166":1,"167":2}}],["context",{"2":{"77":1,"78":1,"79":1,"80":1,"81":1,"82":1,"95":2,"104":1,"115":1}}],["content=",{"2":{"179":4}}],["content",{"2":{"36":2,"76":1,"82":1,"101":1}}],["container",{"2":{"36":1,"87":1,"119":2,"120":1,"168":1,"200":2,"206":2,"212":7,"214":7,"216":7,"217":7,"218":7,"219":7,"220":7,"221":10}}],["cryptocurrency",{"0":{"226":1}}],["cryptotooltop",{"2":{"7":1}}],["cr",{"2":{"113":1}}],["creating",{"2":{"146":1}}],["creation",{"2":{"45":1,"47":1,"104":1,"147":1,"152":1,"175":1,"179":1,"204":1}}],["createelement",{"2":{"212":5,"214":2,"216":2,"217":5,"218":2,"219":2,"220":2,"221":8}}],["creates",{"2":{"47":3,"150":1}}],["createshape",{"2":{"29":1,"189":1}}],["createyaxisfigures",{"2":{"47":2,"175":1}}],["createxaxisfigures",{"2":{"47":2,"175":1}}],["createpointfigures",{"2":{"47":2,"175":1,"176":1,"218":1}}],["create",{"0":{"179":1,"208":1,"210":1},"2":{"45":1,"49":1,"50":1,"85":1,"103":1,"114":1,"115":1,"146":1,"147":1,"175":3,"176":1,"200":2,"204":1}}],["createhtml",{"2":{"29":1,"189":1}}],["createticks",{"2":{"49":2,"50":2,"85":1}}],["createtooltipdatasource",{"2":{"45":2,"115":1,"146":1,"147":2,"191":2}}],["createtag",{"2":{"29":1,"189":1}}],["createtechnicalindicator",{"2":{"29":1,"189":1}}],["createannotation",{"2":{"29":1,"189":1}}],["createoverlay",{"0":{"150":1},"2":{"19":1,"29":2,"150":1,"151":1,"153":1,"189":1,"211":1,"218":3}}],["createindicator",{"0":{"88":1,"146":1},"2":{"13":1,"20":1,"29":1,"36":1,"86":1,"146":1,"148":1,"149":1,"189":1,"209":1,"217":2,"219":1,"221":2}}],["created",{"2":{"5":1,"211":1}}],["cross",{"2":{"24":1,"115":3,"182":2,"221":2}}],["crosshair",{"2":{"14":1,"29":2,"115":1,"182":1,"191":2,"200":1}}],["carried",{"2":{"200":1}}],["carefully",{"2":{"94":1}}],["caution",{"2":{"168":1}}],["caused",{"2":{"9":1}}],["calls",{"2":{"151":1,"168":1}}],["calling",{"2":{"148":1,"149":1,"153":1}}],["call",{"2":{"139":1,"143":1,"168":1,"207":1}}],["callback",{"0":{"139":1,"140":1,"141":1,"146":1,"147":1,"163":1,"164":1},"2":{"1":2,"3":1,"13":1,"23":1,"24":1,"86":1,"117":1,"139":4,"140":3,"141":4,"144":2,"145":4,"146":3,"147":3,"163":3,"164":3,"175":13,"182":1,"189":2}}],["calculated",{"0":{"209":1}}],["calculates",{"2":{"116":2}}],["calculate",{"2":{"67":1,"115":1}}],["calculation",{"2":{"9":1,"45":2,"115":5,"116":2,"117":5,"147":2}}],["calcparms",{"2":{"45":1,"115":1,"146":1,"147":1}}],["calcparamstext",{"2":{"45":1,"115":1,"146":1,"147":1,"191":1}}],["calcparams",{"2":{"9":1,"29":1,"45":2,"115":1,"116":2,"117":4,"146":1,"147":3}}],["calc",{"2":{"29":1,"45":2,"113":3,"115":1,"117":1,"146":1,"147":3,"191":1,"209":1,"217":1}}],["calctechnicalindicator",{"2":{"29":1,"191":1}}],["calctextwidth",{"0":{"67":1},"2":{"20":1}}],["cancel",{"2":{"164":1,"175":1}}],["canvastextbaseline",{"2":{"101":1}}],["canvastextalign",{"2":{"101":1}}],["canvasgradient",{"2":{"78":1,"80":1,"81":1,"101":1}}],["canvas",{"2":{"77":1,"78":1,"79":1,"80":1,"81":1,"82":1,"92":2,"95":2,"104":1,"115":1,"200":1}}],["canvasrenderingcontext2d",{"2":{"42":1,"77":1,"78":1,"79":1,"80":1,"81":1,"82":1,"104":1,"115":1}}],["can",{"0":{"206":1},"2":{"36":3,"37":1,"84":1,"86":1,"94":1,"105":1,"106":2,"109":1,"110":1,"111":1,"115":1,"121":1,"127":1,"130":1,"131":1,"139":1,"140":1,"146":6,"148":1,"150":1,"154":1,"155":1,"156":1,"157":1,"158":2,"159":1,"160":1,"161":5,"165":1,"166":1,"167":3,"171":1,"175":12,"176":1,"178":2,"180":2,"182":3,"202":1,"204":1,"209":1,"211":2,"222":2}}],["cannot",{"2":{"3":1,"5":1,"117":1}}],["candles",{"2":{"134":1,"135":1}}],["candlesticks",{"2":{"115":2,"175":2,"200":1}}],["candlestick",{"2":{"115":2,"136":1,"137":1,"175":2}}],["candle",{"0":{"207":1,"214":1},"2":{"3":1,"7":2,"10":1,"12":2,"13":1,"14":1,"17":1,"18":1,"19":1,"23":8,"29":3,"36":1,"87":1,"89":1,"146":1,"147":2,"148":1,"149":1,"150":1,"161":1,"182":6,"186":3,"208":1,"214":5,"217":1,"219":2,"221":3}}],["ts",{"2":{"204":1}}],["t",{"2":{"194":1}}],["trc20",{"2":{"226":1}}],["transparent",{"2":{"182":2}}],["traditional",{"2":{"110":1}}],["true",{"2":{"115":1,"139":1,"140":1,"146":2,"147":2,"150":1,"152":1,"161":2,"175":1,"182":29,"212":2,"215":2,"217":1,"218":3}}],["trix",{"2":{"113":1}}],["triggered",{"2":{"115":1,"175":2}}],["triggering",{"2":{"25":2}}],["trigger",{"2":{"9":1,"17":2,"175":1}}],["two",{"2":{"68":1,"69":1,"106":1,"107":1,"109":1,"116":1,"207":1}}],["targetcoordinate",{"0":{"69":1,"70":1},"2":{"69":1,"70":1}}],["target",{"0":{"53":1,"54":1},"2":{"53":1,"54":1}}],["tagid",{"2":{"189":1}}],["tag",{"2":{"29":1,"185":1,"186":1,"189":1}}],["takes",{"2":{"61":1}}],["take",{"2":{"5":1,"117":1,"178":1}}],["tickline",{"2":{"182":2}}],["ticktext",{"2":{"182":2}}],["ticks",{"2":{"49":1,"50":1,"85":2}}],["ticketext",{"2":{"29":8,"186":8}}],["tip",{"2":{"45":1,"147":1,"221":2}}],["title>",{"2":{"179":1}}],["title>quick",{"2":{"179":1}}],["title",{"2":{"45":3,"115":2,"116":2,"117":4,"146":3,"147":3,"182":13,"191":2}}],["times",{"2":{"116":2}}],["timestamp",{"0":{"64":1,"157":1,"160":1},"2":{"36":1,"47":1,"64":1,"90":2,"139":1,"140":1,"141":2,"142":1,"144":3,"150":4,"152":3,"157":4,"160":4,"165":5,"166":2,"175":6,"179":70,"212":5,"213":5,"214":5,"215":7,"216":5,"217":5,"218":5,"219":5,"220":5,"221":5}}],["timezone",{"0":{"124":1,"220":1},"2":{"36":3,"124":2,"220":2}}],["time",{"0":{"208":1},"2":{"8":1,"10":2,"25":1,"36":2,"38":1,"110":1,"117":1,"124":4,"125":1,"154":1,"155":1,"156":1,"157":1,"158":1,"159":1,"160":1,"165":1,"175":1,"182":5,"216":1}}],["typo",{"2":{"18":1}}],["type=",{"2":{"179":1}}],["types",{"0":{"173":1},"2":{"24":2,"27":1,"40":1,"164":1,"167":1,"182":2,"212":2,"221":3}}],["typescriptklinecharts",{"2":{"110":1}}],["typescriptnew",{"2":{"97":1,"98":1,"99":2,"100":1,"101":1}}],["typescriptsetpaneoptions",{"2":{"89":1}}],["typescriptcreateindicator",{"2":{"88":1}}],["typescriptinit",{"2":{"87":1}}],["typescript",{"2":{"2":1,"15":1,"16":1,"18":1,"22":1,"24":1,"28":1,"29":1,"36":1,"37":1,"38":1,"39":1,"40":1,"41":1,"42":1,"43":1,"44":1,"45":1,"46":1,"47":1,"48":1,"49":1,"50":1,"51":1,"53":1,"54":1,"55":1,"56":1,"57":1,"58":1,"59":1,"60":1,"61":1,"62":1,"63":1,"64":1,"65":1,"66":1,"67":1,"68":1,"69":1,"70":1,"71":1,"72":1,"73":1,"74":1,"75":1,"76":1,"77":1,"78":1,"79":1,"80":1,"81":1,"82":1,"85":1,"90":1,"104":1,"115":1,"119":1,"120":1,"121":1,"122":1,"123":1,"124":1,"125":1,"126":1,"127":1,"128":1,"129":1,"130":1,"131":1,"132":1,"133":1,"134":1,"135":1,"136":1,"137":1,"138":1,"139":1,"140":1,"141":1,"142":1,"143":1,"144":1,"145":1,"146":1,"147":1,"148":1,"149":1,"150":1,"151":1,"152":1,"153":1,"154":1,"155":1,"156":1,"157":1,"158":1,"159":1,"160":1,"161":1,"162":1,"163":1,"164":1,"165":1,"166":1,"167":1,"168":1,"171":1,"175":1,"203":2}}],["type",{"0":{"162":1,"163":1,"164":1,"167":1,"214":1},"2":{"1":1,"2":1,"10":1,"14":1,"18":1,"21":1,"29":1,"36":2,"41":1,"43":1,"45":2,"47":6,"87":2,"106":1,"115":10,"116":2,"117":3,"122":1,"139":1,"140":1,"141":1,"142":1,"145":2,"146":3,"147":2,"150":1,"162":2,"163":2,"164":2,"167":3,"171":1,"175":8,"176":1,"182":4,"189":3,"208":1,"212":2,"214":2,"218":1}}],["telegram",{"0":{"194":1}}],["tells",{"2":{"139":1,"140":1}}],["terminals",{"2":{"171":1}}],["terminal",{"2":{"92":1}}],["term",{"2":{"68":1,"70":1}}],["technicalindicator",{"2":{"29":4,"186":3,"191":1}}],["technical",{"0":{"112":1,"113":1,"114":1,"191":1,"209":1,"210":1},"1":{"113":1,"114":1,"115":2,"116":2,"117":2},"2":{"16":1,"29":6,"45":2,"46":1,"90":1,"94":1,"112":2,"114":3,"115":11,"116":1,"123":1,"146":3,"147":1,"148":2,"149":2,"210":1}}],["textalign",{"2":{"217":1}}],["textweight",{"2":{"182":2}}],["textfamily",{"2":{"182":2}}],["textsize",{"2":{"182":2}}],["textmargin",{"2":{"182":2}}],["text",{"0":{"67":1,"76":1,"101":1},"2":{"13":1,"14":1,"16":1,"24":1,"29":4,"45":2,"49":1,"50":1,"67":2,"76":7,"82":5,"83":2,"85":2,"96":1,"101":2,"102":2,"115":4,"146":2,"147":2,"179":1,"182":10,"200":1,"212":17,"214":8,"216":5,"217":2,"218":4,"219":6,"220":5,"221":13}}],["template>",{"2":{"179":2}}],["templates",{"2":{"18":1,"182":1}}],["template",{"2":{"13":1,"29":1,"179":1,"188":4}}],["turnover",{"2":{"13":1,"90":2,"110":1,"139":1,"140":1,"141":1,"142":1,"212":2,"213":2,"214":2,"215":2,"216":2,"217":2,"218":2,"219":2,"220":2,"221":2}}],["tofixed",{"2":{"212":4,"213":4,"214":4,"215":4,"216":4,"217":4,"218":4,"219":4,"220":4,"221":4}}],["together",{"2":{"200":2}}],["tooling",{"2":{"178":1}}],["tools",{"2":{"178":2}}],["tooltip",{"0":{"221":1},"2":{"3":1,"7":2,"13":1,"17":1,"18":1,"23":2,"29":2,"115":1,"182":2,"186":3,"221":4}}],["total",{"2":{"47":1,"175":1}}],["totalstep",{"2":{"47":2,"175":1,"176":1,"218":1}}],["top",{"2":{"36":2,"76":1,"82":2,"85":1,"101":1,"115":4,"120":1,"146":5,"161":4,"175":2,"200":1,"212":1,"214":1,"216":1,"217":1,"218":1,"219":1,"220":1,"221":2,"222":1}}],["to",{"0":{"183":1,"207":1,"208":1,"209":1,"210":1,"211":1},"1":{"184":1,"185":1,"186":1,"187":1,"188":1,"189":1,"190":1,"191":1},"2":{"7":2,"8":1,"9":3,"10":1,"22":2,"23":1,"25":1,"27":1,"29":25,"30":2,"31":2,"32":2,"33":2,"34":2,"36":2,"41":1,"45":4,"47":2,"68":1,"85":1,"86":2,"90":3,"92":3,"94":3,"95":1,"103":4,"109":2,"110":1,"112":1,"114":3,"115":16,"116":1,"117":5,"121":1,"122":1,"124":1,"126":1,"130":1,"131":1,"134":1,"135":1,"138":1,"139":2,"140":1,"141":1,"142":1,"143":2,"145":1,"146":1,"147":6,"148":1,"151":1,"152":3,"155":1,"156":1,"157":1,"158":1,"161":1,"163":1,"164":1,"165":4,"166":2,"167":1,"171":1,"172":1,"174":1,"175":16,"176":4,"178":2,"182":2,"183":4,"185":1,"186":11,"188":1,"189":16,"190":1,"191":6,"195":1,"200":4,"202":1,"206":1,"207":1,"212":1,"214":1,"216":1,"217":3,"218":1,"219":1,"220":1,"221":1,"222":2}}],["thjptqmfgavm12ke1jzc5mlxiapp6qxmci",{"2":{"226":1}}],["those",{"2":{"222":1}}],["thousandsseparator",{"2":{"36":2,"175":1}}],["thousands",{"2":{"23":1,"36":1,"65":1,"175":1}}],["thousandth",{"2":{"5":1}}],["thank",{"2":{"197":1}}],["than",{"0":{"210":1},"2":{"146":2,"161":2}}],["that",{"2":{"3":1,"5":1,"92":1,"105":1,"115":3,"117":2,"130":1,"131":1,"146":1,"147":1,"148":1,"149":1,"152":2,"175":2,"222":1}}],["think",{"2":{"222":1}}],["this",{"2":{"90":1,"94":1,"110":1,"112":1,"115":1,"139":1,"140":1,"144":1,"146":1,"168":1,"172":1,"179":1,"183":1,"197":2,"204":1}}],["thickness",{"2":{"77":1,"78":1,"79":1,"80":1,"81":1,"82":1,"101":1}}],["three",{"2":{"106":1,"167":1,"176":1,"222":1}}],["threshold",{"0":{"66":1},"2":{"36":1,"66":1,"175":1}}],["through",{"2":{"36":1,"84":1,"90":1,"94":1,"103":1,"110":1,"111":1,"114":1,"121":1,"174":1,"178":1,"189":1,"208":1}}],["theme",{"0":{"219":1},"2":{"179":1,"219":4}}],["then",{"2":{"103":1,"114":1,"174":1}}],["these",{"2":{"96":1}}],["there",{"2":{"24":1,"95":1,"117":2,"139":1,"140":1}}],["the",{"0":{"179":1,"206":1,"207":1,"210":1,"211":1},"2":{"1":7,"3":5,"4":1,"5":1,"6":2,"7":1,"8":3,"9":4,"10":5,"12":6,"13":5,"14":5,"16":2,"18":4,"19":1,"20":3,"22":1,"23":3,"24":6,"25":5,"26":2,"27":3,"28":1,"29":8,"30":1,"31":1,"32":1,"33":1,"34":1,"36":5,"37":1,"40":2,"41":1,"42":2,"43":2,"45":2,"47":5,"51":2,"61":2,"68":2,"69":2,"70":4,"71":7,"72":6,"73":1,"76":1,"77":6,"78":7,"79":1,"80":1,"84":1,"86":5,"87":7,"88":3,"89":3,"90":5,"92":2,"94":5,"95":3,"96":1,"97":6,"98":6,"100":4,"101":4,"103":3,"104":6,"105":1,"106":14,"109":3,"111":1,"112":2,"114":2,"115":36,"116":10,"117":14,"119":4,"120":4,"121":1,"122":2,"123":2,"124":2,"125":1,"130":3,"131":3,"132":3,"133":3,"134":2,"135":2,"136":2,"137":2,"139":5,"140":3,"141":3,"142":3,"143":4,"144":2,"146":11,"147":4,"148":5,"149":4,"150":3,"151":2,"152":4,"153":2,"156":3,"157":1,"158":3,"159":2,"160":1,"161":5,"164":3,"165":6,"166":1,"167":7,"168":4,"171":2,"172":2,"174":2,"175":49,"176":9,"178":3,"180":4,"182":3,"183":1,"186":1,"189":4,"191":6,"195":1,"197":1,"200":9,"202":2,"203":1,"204":1,"206":3,"207":1,"209":1,"211":2,"212":4,"214":4,"216":4,"217":4,"218":4,"219":4,"220":4,"221":4,"222":5}}],["older",{"2":{"183":1}}],["obtain",{"2":{"148":1,"189":1}}],["obtained",{"2":{"94":1}}],["obv",{"2":{"113":1}}],["objects",{"2":{"175":2,"182":1}}],["object",{"2":{"36":2,"41":1,"42":2,"45":23,"47":20,"49":1,"50":1,"54":3,"58":1,"121":2,"122":1,"146":21,"147":19,"148":1,"149":1,"150":32,"151":1,"152":15,"165":1,"166":1,"182":1}}],["own",{"2":{"87":1}}],["other",{"0":{"210":1},"2":{"69":1,"109":1,"116":2,"117":1,"176":1,"222":1}}],["o",{"2":{"61":2}}],["outline",{"2":{"212":1,"214":1,"216":1,"217":1,"218":1,"219":1,"220":1,"221":1}}],["outside",{"2":{"212":1}}],["out",{"2":{"47":1,"108":1,"152":1,"171":1,"175":1,"200":1}}],["output",{"2":{"23":1}}],["operations",{"2":{"146":1,"200":1}}],["operation",{"2":{"45":1,"147":1,"175":3}}],["opening",{"2":{"182":1}}],["open",{"2":{"38":1,"90":2,"110":1,"139":1,"140":1,"141":1,"142":1,"179":70,"182":4,"212":3,"213":3,"214":3,"215":3,"216":4,"217":3,"218":3,"219":3,"220":3,"221":3}}],["option",{"2":{"189":2}}],["optional",{"2":{"36":1,"90":1,"97":1,"98":1,"99":2,"100":1,"101":1,"147":1}}],["options",{"0":{"36":1,"161":1},"2":{"13":2,"20":3,"29":3,"36":5,"45":1,"47":1,"86":3,"87":2,"106":2,"111":1,"147":1,"152":1,"161":2,"163":1,"164":1,"175":1,"180":1,"186":1,"189":1,"191":1}}],["optimization",{"2":{"17":1}}],["optimize",{"2":{"1":2,"3":1,"6":1,"7":4,"8":2,"9":2,"10":2,"12":1,"13":2,"16":3,"17":1,"18":3,"19":1,"20":3,"21":1,"22":2,"23":2,"24":3,"25":1,"26":1,"27":1}}],["organization",{"2":{"222":1}}],["organizations",{"2":{"222":1}}],["org",{"2":{"175":1}}],["original",{"2":{"155":1}}],["order",{"2":{"143":1}}],["or",{"2":{"36":2,"37":1,"45":1,"47":1,"86":1,"111":1,"123":1,"145":1,"146":1,"147":1,"150":1,"152":1,"165":1,"166":1,"178":2,"180":2,"182":4,"183":1,"202":1,"204":1,"209":1,"222":3}}],["ohlc",{"2":{"10":1,"12":1,"45":1,"115":1,"147":1,"182":2,"214":2,"219":2}}],["occasional",{"2":{"6":1}}],["overwrite",{"2":{"152":1}}],["overwritten",{"2":{"141":1}}],["overridetechnicalindicator",{"2":{"189":1}}],["override",{"0":{"147":1,"152":1},"2":{"147":2,"152":2,"189":3,"209":1}}],["overrides",{"2":{"146":1}}],["overrideindicator",{"0":{"147":1},"2":{"29":1,"146":1,"147":1,"189":1,"209":1}}],["overrideoverlay",{"0":{"152":1},"2":{"29":2,"150":1,"152":1,"189":1}}],["overridden",{"2":{"3":1,"147":1,"152":1}}],["overlayevent",{"2":{"175":14}}],["overlayperformeventparams",{"2":{"175":1}}],["overlaycreatefigurescallback",{"2":{"175":2}}],["overlayconstructor>",{"2":{"39":1}}],["overlaytechnicalindicator",{"2":{"29":1}}],["overlayfigureignoreeventtype",{"2":{"47":6,"175":2}}],["overlayfigure",{"2":{"18":1}}],["overlaystyle",{"2":{"175":2}}],["overlays",{"0":{"174":1},"1":{"175":1,"176":1},"2":{"5":1,"11":1,"16":1,"25":1,"48":1,"94":1,"152":1,"172":1,"211":1}}],["overlay",{"0":{"47":1,"172":1,"173":1,"218":1},"1":{"173":1,"174":1,"175":1,"176":1},"2":{"3":1,"8":1,"10":1,"12":1,"13":2,"18":1,"19":1,"24":1,"25":1,"27":1,"29":2,"39":2,"47":6,"147":1,"150":2,"151":1,"152":2,"153":1,"167":1,"172":1,"174":2,"175":7,"176":1,"182":1,"185":2,"186":1,"211":1}}],["onload",{"2":{"179":1}}],["only",{"0":{"206":1},"2":{"9":1,"47":1,"103":1,"106":2,"108":1,"114":1,"141":1,"143":1,"146":1,"152":1,"162":1,"165":1,"166":1,"171":1,"175":1,"178":1,"212":1,"214":1,"216":1,"217":1,"218":1,"219":1,"220":1,"221":1}}],["onunmounted",{"2":{"179":2}}],["onmount",{"2":{"179":4}}],["onmounted",{"2":{"179":2}}],["onmouseleave",{"2":{"47":2,"150":3,"152":3,"175":1}}],["onmouseenter",{"2":{"47":2,"150":3,"152":3,"175":1}}],["onpanedrag",{"2":{"163":2,"164":2,"189":1}}],["onpressedmoveend",{"2":{"47":2,"150":3,"152":3,"175":1}}],["onpressedmovestart",{"2":{"47":2,"150":3,"152":3,"175":1}}],["onpressedmoving",{"2":{"47":2,"150":3,"152":3,"175":1}}],["ontooltipiconclick",{"2":{"163":2,"164":2}}],["onvisiblerangechange",{"2":{"163":2,"164":2,"189":1}}],["one",{"0":{"206":1},"2":{"54":1,"116":2,"167":1,"171":1,"175":1}}],["onselected",{"2":{"47":2,"150":3,"152":3,"175":1}}],["onscroll",{"2":{"1":1,"163":2,"164":2,"189":1}}],["onremoved",{"2":{"47":2,"150":3,"152":3,"175":1}}],["onrightclick",{"2":{"47":2,"150":3,"152":3,"175":1}}],["ondestroy",{"2":{"179":4}}],["ondeselected",{"2":{"47":2,"150":3,"152":3,"175":1}}],["ondataready",{"2":{"139":1,"141":1,"163":2,"164":2}}],["ondrawend",{"2":{"47":2,"150":3,"152":3,"175":1}}],["ondrawing",{"2":{"47":2,"150":3,"152":3,"175":1}}],["ondrawstart",{"2":{"47":2,"150":3,"152":3,"175":1}}],["ondoubleclick",{"2":{"18":1,"47":2,"150":3,"152":3,"175":1}}],["oncleanup",{"2":{"179":2}}],["onclick",{"2":{"47":2,"150":3,"152":3,"175":1}}],["oncrosshairchange",{"2":{"162":2,"163":2,"164":2,"189":1}}],["once",{"2":{"37":1}}],["oncandlebarclick",{"2":{"27":1,"163":2,"164":2}}],["on",{"2":{"9":1,"10":1,"18":1,"24":1,"42":1,"47":2,"69":1,"70":1,"71":1,"72":1,"73":1,"74":1,"75":1,"76":1,"92":3,"94":1,"104":1,"132":1,"133":1,"137":1,"146":1,"152":1,"160":1,"165":1,"166":1,"175":4,"180":1,"222":3}}],["onzoom",{"2":{"1":1,"163":2,"164":2,"189":1}}],["official",{"2":{"222":1}}],["offsetbottom",{"2":{"7":1,"23":1,"182":3}}],["offsetright",{"2":{"7":1,"182":3}}],["offsettop",{"2":{"7":1,"182":3}}],["offsetleft",{"2":{"7":1,"182":3}}],["offset",{"2":{"6":1,"182":2}}],["of",{"0":{"87":1,"88":1,"89":1,"95":1,"211":1},"2":{"1":4,"3":1,"4":1,"5":1,"6":1,"8":1,"9":1,"10":3,"12":1,"13":3,"14":3,"16":1,"18":1,"19":1,"20":1,"23":1,"24":4,"25":2,"26":1,"27":1,"28":1,"36":1,"51":1,"52":1,"61":1,"68":2,"69":1,"70":1,"71":4,"72":4,"77":4,"78":4,"85":1,"86":1,"94":2,"95":1,"97":4,"98":4,"99":2,"100":2,"101":2,"104":3,"106":2,"115":7,"116":3,"117":4,"130":1,"131":1,"132":1,"133":1,"134":1,"135":1,"136":2,"137":1,"139":2,"140":2,"141":3,"142":1,"143":1,"144":2,"146":4,"147":1,"148":1,"149":1,"150":2,"156":1,"158":1,"159":1,"161":2,"165":1,"167":2,"168":1,"171":1,"175":12,"176":2,"178":2,"182":1,"186":1,"200":1,"204":1,"212":1,"214":1,"216":1,"217":1,"218":1,"219":1,"220":1,"221":1,"222":1}}],["amount",{"2":{"222":1}}],["america",{"2":{"220":1}}],["at",{"2":{"158":1,"159":1,"165":1}}],["attributes",{"2":{"10":1,"19":1,"29":1,"39":1,"106":1,"117":1}}],["attribute",{"0":{"104":1,"115":1,"175":1},"1":{"116":1,"117":1},"2":{"1":1,"12":1,"29":6,"95":1,"106":1,"191":2}}],["attrs",{"2":{"1":1,"7":1,"18":1,"42":2,"45":2,"47":6,"95":2,"97":1,"98":1,"99":2,"100":1,"101":1,"104":2,"107":4,"115":1,"146":1,"147":1,"175":2,"176":1,"218":1}}],["adopts",{"2":{"202":1}}],["advantage",{"2":{"178":1}}],["adjustments",{"2":{"212":1,"214":1,"216":1,"217":1,"218":1,"219":1,"220":1,"221":1}}],["adjustment",{"0":{"184":1,"185":1,"186":1,"187":1,"191":1},"1":{"188":1,"189":1,"190":1}}],["adjust",{"2":{"146":1,"161":1}}],["address",{"2":{"222":1}}],["addeventlistener",{"2":{"212":4,"214":1,"216":1,"217":2,"218":1,"219":1,"220":1,"221":4}}],["added",{"2":{"20":1,"29":1}}],["addition",{"2":{"178":1,"200":1}}],["additionally",{"2":{"139":1}}],["adding",{"0":{"110":1},"2":{"7":1,"10":1,"110":1,"111":1,"200":1}}],["addtechnicalindicatortemplate",{"2":{"29":2,"188":1}}],["add",{"2":{"1":1,"7":1,"12":2,"13":2,"17":2,"18":2,"19":2,"20":1,"23":4,"24":1,"27":1,"29":3,"38":1,"41":1,"42":1,"45":1,"47":1,"49":1,"50":1,"103":2,"110":1,"114":2,"139":1,"140":1,"174":2,"178":2,"195":1}}],["addshapetemplate",{"2":{"29":2,"188":1}}],["adds",{"2":{"1":1,"13":1}}],["affect",{"2":{"168":1}}],["affected",{"2":{"123":1}}],["afterviewinit",{"2":{"179":2}}],["after",{"0":{"206":1},"2":{"5":1,"25":1,"83":1,"86":1,"102":1,"111":1,"115":1,"167":1}}],["ao",{"2":{"113":1}}],["above",{"2":{"200":1}}],["about",{"2":{"115":2,"175":2}}],["absoluteyaxis",{"2":{"189":1}}],["absolute",{"2":{"165":3,"166":3,"189":1}}],["abs",{"2":{"107":2,"176":2,"218":2}}],["abandonment",{"2":{"29":1}}],["avoid",{"2":{"143":1}}],["average",{"2":{"116":1}}],["avp",{"2":{"90":1,"113":1}}],["available",{"2":{"37":1,"132":1,"133":1}}],["alipay",{"0":{"224":1}}],["alignment",{"2":{"76":2,"82":2,"101":1}}],["align",{"2":{"76":2,"82":2,"101":1,"212":1,"214":1,"216":1,"217":1,"218":1,"219":1,"220":1,"221":1}}],["alphagreen",{"2":{"219":7}}],["alphared",{"2":{"219":7}}],["alphabetic",{"2":{"76":1,"82":1}}],["always",{"2":{"168":1,"182":4,"206":1,"221":2}}],["also",{"2":{"123":1,"178":3,"200":1}}],["allow",{"2":{"178":1}}],["all",{"2":{"23":1,"29":2,"94":1,"147":1,"148":1,"149":1,"164":1,"186":1,"190":1,"214":2}}],["auto",{"2":{"145":1,"182":2}}],["automatically",{"2":{"36":1,"124":1}}],["auxiliary",{"2":{"45":1,"147":1}}],["actual",{"2":{"212":1,"214":1,"216":1,"217":1,"218":1,"219":1,"220":1,"221":1}}],["activeradius",{"2":{"182":1}}],["activebordersize",{"2":{"182":1}}],["activebordercolor",{"2":{"182":1}}],["activebackgroundcolor",{"2":{"182":3}}],["activecolor",{"2":{"182":1}}],["actions",{"2":{"163":1,"164":1}}],["action",{"2":{"162":1}}],["achieved",{"2":{"84":1}}],["account",{"2":{"222":1}}],["accomplished",{"2":{"110":1}}],["according",{"2":{"68":1,"148":1,"165":1,"212":1,"214":1,"216":1,"217":1,"218":1,"219":1,"220":1,"221":1}}],["accuracy",{"2":{"9":1}}],["acquisition",{"2":{"20":1}}],["apache",{"2":{"222":1}}],["appreciated",{"2":{"222":1}}],["appendchild",{"2":{"212":5,"214":2,"216":2,"217":5,"218":2,"219":2,"220":2,"221":8}}],["appended",{"2":{"141":1}}],["app",{"2":{"179":1}}],["applynewdata",{"0":{"139":1},"2":{"23":1,"24":1,"90":1,"179":7,"212":1,"213":1,"214":1,"215":2,"216":1,"217":1,"218":1,"219":1,"220":1,"221":1}}],["applymoredata",{"0":{"140":1},"2":{"7":1,"23":1,"90":1,"215":1}}],["apis",{"2":{"20":1,"36":1,"190":1}}],["apissetmaxoffsetleftdistance",{"2":{"12":1}}],["api",{"0":{"35":1,"87":1,"88":1,"89":1,"118":1,"187":1,"188":1,"189":1,"190":1},"1":{"36":1,"37":1,"38":1,"39":1,"40":1,"41":1,"42":1,"43":1,"44":1,"45":1,"46":1,"47":1,"48":1,"49":1,"50":1,"51":1,"52":1,"53":1,"54":1,"55":1,"56":1,"57":1,"58":1,"59":1,"60":1,"61":1,"62":1,"63":1,"64":1,"65":1,"66":1,"67":1,"68":1,"69":1,"70":1,"71":1,"72":1,"73":1,"74":1,"75":1,"76":1,"77":1,"78":1,"79":1,"80":1,"81":1,"82":1,"83":1,"119":1,"120":1,"121":1,"122":1,"123":1,"124":1,"125":1,"126":1,"127":1,"128":1,"129":1,"130":1,"131":1,"132":1,"133":1,"134":1,"135":1,"136":1,"137":1,"138":1,"139":1,"140":1,"141":1,"142":1,"143":1,"144":1,"145":1,"146":1,"147":1,"148":1,"149":1,"150":1,"151":1,"152":1,"153":1,"154":1,"155":1,"156":1,"157":1,"158":1,"159":1,"160":1,"161":1,"162":1,"163":1,"164":1,"165":1,"166":1,"167":1,"168":1,"188":1,"189":1,"190":1},"2":{"5":1,"13":2,"17":1,"19":1,"20":1,"23":3,"24":1,"29":3,"36":1,"84":1,"86":2,"90":1,"111":1,"140":1,"144":1,"146":1,"171":1,"211":1}}],["arc",{"0":{"71":1,"77":1,"97":1},"2":{"26":1,"71":4,"77":5,"95":1,"96":1,"182":1}}],["are",{"2":{"25":1,"29":3,"45":1,"47":1,"94":2,"96":1,"116":2,"117":1,"147":1,"150":1,"152":1,"163":1,"164":1,"175":5,"176":1,"183":1,"184":1,"185":1,"186":2,"189":1,"190":1,"191":1}}],["area",{"2":{"6":1,"8":1,"14":1,"24":1,"115":2,"182":2,"200":1,"208":1,"214":2}}],["arrays",{"2":{"19":1}}],["array",{"2":{"3":1,"7":1,"24":1,"36":2,"45":3,"47":4,"49":1,"50":1,"70":1,"73":1,"74":1,"78":1,"79":1,"80":2,"81":1,"85":2,"99":2,"115":5,"139":2,"140":2,"142":1,"146":3,"147":3,"150":3,"152":1,"165":3,"166":3,"175":4,"182":3}}],["assisting",{"2":{"212":1,"214":1,"216":1,"217":1,"218":1,"219":1,"220":1,"221":1}}],["assemble",{"2":{"200":2}}],["asia",{"2":{"36":1,"124":1,"220":1}}],["as",{"2":{"5":1,"24":2,"36":2,"61":1,"63":1,"64":1,"83":1,"95":1,"102":1,"116":1,"117":2,"124":1,"171":1,"175":1,"200":5}}],["angular",{"2":{"179":1}}],["angle",{"2":{"71":2,"77":2,"97":2}}],["animation",{"2":{"154":2,"155":2,"156":2,"157":2,"158":2,"159":2,"160":2,"182":1}}],["animationduration",{"0":{"154":1,"155":1,"156":1,"157":1,"158":1,"159":1,"160":1},"2":{"154":2,"155":2,"156":2,"157":2,"158":2,"159":2,"160":2,"182":1}}],["another",{"2":{"54":1}}],["annotation",{"2":{"29":1,"185":1,"186":1,"189":1}}],["any>",{"2":{"115":1}}],["any>>",{"2":{"115":1}}],["any",{"2":{"29":1,"42":2,"45":3,"47":19,"53":2,"55":1,"56":1,"57":1,"58":1,"59":1,"60":1,"61":3,"76":1,"82":1,"101":1,"104":4,"115":6,"146":3,"147":3,"150":2,"152":1,"162":1,"163":1,"164":1,"175":7}}],["an",{"0":{"210":1},"2":{"3":1,"5":3,"8":1,"9":2,"24":1,"36":1,"58":1,"77":1,"94":1,"121":1,"139":1,"140":1,"146":1,"150":3,"165":3,"166":3,"167":1,"174":1,"182":3,"222":1}}],["and",{"2":{"1":2,"4":1,"5":1,"7":3,"8":1,"10":2,"11":1,"12":1,"13":1,"16":2,"19":2,"20":1,"22":1,"23":5,"24":3,"25":2,"27":1,"29":9,"36":5,"38":1,"45":2,"47":4,"68":2,"70":1,"83":1,"84":1,"86":1,"90":2,"92":1,"94":2,"95":1,"102":1,"103":2,"105":1,"106":5,"107":1,"108":1,"109":1,"112":1,"114":2,"115":1,"116":3,"121":1,"123":1,"128":1,"129":1,"141":1,"143":1,"146":1,"147":2,"148":1,"152":3,"163":1,"164":1,"165":1,"171":4,"172":1,"174":1,"175":9,"176":1,"178":1,"182":3,"184":1,"186":4,"189":6,"195":1,"200":5,"203":4,"204":1,"212":1,"214":1,"216":1,"217":1,"218":1,"219":3,"220":1,"221":1,"222":2}}],["a",{"0":{"207":1,"208":1},"2":{"1":1,"36":3,"37":2,"38":1,"41":1,"42":1,"45":1,"47":1,"52":1,"55":2,"56":2,"57":1,"58":1,"59":2,"60":2,"61":3,"69":1,"70":1,"71":1,"72":2,"73":1,"74":2,"75":2,"76":1,"81":1,"90":2,"92":1,"94":1,"95":1,"103":1,"104":2,"105":3,"106":5,"107":3,"112":1,"114":2,"115":4,"117":2,"136":1,"137":1,"144":1,"146":5,"152":1,"154":1,"158":1,"159":1,"161":2,"163":1,"170":1,"172":1,"175":3,"176":3,"178":1,"180":2,"182":4,"189":1,"202":1,"204":3,"211":1,"222":1}}],["axisline",{"2":{"182":2}}],["axisoptions",{"2":{"20":1,"36":1,"86":2,"87":2,"88":1,"89":1,"146":3,"161":3}}],["axis",{"0":{"49":1,"50":1,"84":1,"212":1},"1":{"85":1,"86":1,"87":1,"88":1,"89":1},"2":{"1":1,"7":1,"9":1,"10":2,"24":1,"29":1,"47":4,"49":5,"50":5,"69":1,"71":2,"72":2,"75":2,"76":2,"77":2,"78":2,"81":2,"82":2,"84":3,"85":1,"86":1,"87":2,"88":1,"89":1,"97":2,"98":2,"100":2,"101":2,"106":2,"115":4,"146":2,"152":2,"161":1,"165":2,"166":1,"175":9,"212":3}}],["xxxxxxxx",{"2":{"150":1,"152":1}}],["xxx",{"2":{"117":2,"191":8}}],["xdis",{"2":{"107":2,"176":3,"218":3}}],["x3c",{"2":{"36":2,"39":1,"45":4,"47":4,"49":1,"50":1,"70":1,"73":1,"74":1,"78":1,"79":1,"80":2,"81":1,"85":2,"99":2,"107":1,"115":7,"139":1,"140":1,"142":1,"145":1,"146":4,"147":4,"150":3,"152":1,"165":2,"166":2,"175":4,"178":2,"179":32,"212":5,"213":3,"214":5,"215":3,"216":5,"217":6,"218":5,"219":5,"220":5,"221":5}}],["xaxis",{"2":{"9":1,"19":1,"29":6,"36":1,"45":3,"87":1,"115":6,"146":1,"147":1,"175":2,"182":1,"186":6,"191":4,"217":2}}],["x",{"0":{"30":1,"31":1,"32":1,"33":1,"34":1},"2":{"1":1,"10":1,"30":1,"31":1,"32":1,"33":1,"34":1,"47":2,"49":1,"68":2,"69":3,"70":1,"71":4,"72":4,"73":2,"74":2,"75":4,"76":4,"77":3,"78":3,"79":1,"80":1,"81":3,"82":3,"87":1,"97":2,"98":2,"99":2,"100":2,"101":2,"104":1,"106":3,"107":12,"115":3,"152":1,"158":1,"165":2,"166":2,"175":4,"176":2,"183":4,"217":2,"218":2}}],["i18n",{"0":{"216":1}}],["i++",{"2":{"212":1,"213":1,"214":1,"215":1,"216":1,"217":2,"218":1,"219":1,"220":1,"221":1}}],["iconfont",{"2":{"182":2}}],["icon",{"2":{"182":4}}],["icons",{"2":{"29":2,"182":2}}],["illustrate",{"2":{"176":1}}],["image",{"2":{"167":3}}],["improving",{"2":{"197":1}}],["implements",{"2":{"179":1}}],["implement",{"2":{"107":1}}],["implementation",{"2":{"13":1,"47":1,"85":1}}],["important",{"2":{"94":1,"146":1}}],["import",{"0":{"184":1},"2":{"15":1,"179":7,"184":1,"204":2,"212":1,"214":1,"216":1,"217":1,"218":1,"219":1,"220":1,"221":1}}],["i",{"0":{"210":1},"2":{"117":5,"212":2,"213":2,"214":2,"215":2,"216":2,"217":6,"218":2,"219":2,"220":2,"221":2,"222":1}}],["if",{"0":{"210":1},"2":{"36":1,"42":1,"55":1,"56":1,"57":1,"58":1,"59":1,"60":1,"73":1,"76":1,"90":1,"92":1,"94":1,"107":3,"109":1,"115":3,"117":4,"124":1,"141":2,"149":1,"152":1,"165":1,"175":1,"176":1,"183":1,"197":1,"206":1,"218":1,"219":2,"222":3}}],["ignoreevent",{"2":{"47":6,"175":2}}],["ignore",{"2":{"25":1,"175":1}}],["id=",{"2":{"179":7,"212":2,"213":1,"214":2,"215":1,"216":2,"217":2,"218":2,"219":2,"220":2,"221":2}}],["identification",{"2":{"146":1,"152":1}}],["identifies",{"2":{"146":1}}],["identifier",{"2":{"42":1,"45":1,"47":1,"104":1,"147":1,"150":1,"152":1,"175":1}}],["ideographic",{"2":{"76":1,"82":1}}],["id",{"0":{"151":1},"2":{"18":1,"20":1,"36":2,"37":1,"87":1,"89":1,"115":1,"119":1,"120":1,"146":6,"147":3,"148":5,"149":4,"150":6,"151":4,"152":6,"153":4,"161":6,"165":1,"166":1,"182":4,"189":2,"217":1,"221":1}}],["its",{"2":{"87":1}}],["it",{"2":{"3":1,"8":1,"36":3,"83":1,"86":1,"92":2,"94":1,"95":1,"102":1,"103":3,"114":3,"115":2,"117":3,"121":2,"124":1,"127":1,"141":4,"143":2,"146":2,"150":1,"152":1,"161":1,"165":2,"166":1,"167":1,"170":1,"174":3,"175":1,"176":1,"178":4,"182":3}}],["items",{"2":{"36":1,"116":1,"212":1,"214":3,"216":3,"217":1,"218":3,"219":3,"220":3,"221":1}}],["item",{"2":{"1":1,"86":1,"117":1,"182":1,"191":1}}],["isdashed",{"2":{"191":1}}],["iszoomenabled",{"0":{"127":1}}],["isboolean",{"0":{"60":1}}],["isfunction",{"0":{"59":1}}],["isobject",{"0":{"58":1}}],["isnumber",{"0":{"56":1}}],["isvalid",{"0":{"57":1},"2":{"23":1}}],["isscrollenabled",{"0":{"129":1}}],["isstroke",{"2":{"191":1}}],["isstring",{"0":{"55":1}}],["isstack",{"0":{"146":1},"2":{"13":1,"20":1,"86":1,"146":2,"189":2}}],["issues",{"2":{"193":2}}],["issue",{"2":{"1":3,"2":1,"3":2,"4":1,"5":3,"6":1,"7":1,"8":1,"9":2,"10":3,"12":1,"13":2,"14":2,"16":1,"18":1,"24":2,"25":2}}],["is",{"0":{"206":1,"209":1},"2":{"1":1,"3":1,"14":1,"24":2,"29":23,"42":1,"45":2,"47":2,"55":1,"56":1,"57":1,"58":1,"59":1,"60":1,"71":1,"72":1,"73":1,"74":1,"75":1,"76":1,"83":1,"92":1,"94":1,"95":2,"102":1,"104":2,"105":1,"106":12,"107":1,"109":1,"110":1,"115":12,"116":2,"117":7,"119":2,"120":2,"121":1,"123":1,"128":1,"129":1,"139":3,"140":3,"141":2,"143":2,"144":2,"146":10,"147":3,"148":1,"149":1,"150":1,"152":2,"154":1,"155":1,"156":1,"157":1,"158":2,"159":1,"160":1,"161":2,"163":1,"164":2,"165":1,"166":1,"167":3,"170":1,"175":4,"176":2,"178":2,"182":3,"186":9,"188":1,"189":11,"191":5,"200":1,"207":1,"212":1,"214":1,"216":1,"217":1,"218":1,"219":1,"220":1,"221":1,"222":1}}],["innertext",{"2":{"212":4,"214":1,"216":1,"217":4,"218":1,"219":1,"220":1,"221":6}}],["insideoutside",{"2":{"212":2}}],["inside",{"2":{"182":1,"212":3}}],["installation",{"0":{"202":1}}],["install",{"2":{"178":2,"202":2}}],["instantiate",{"2":{"95":1}}],["instance",{"0":{"88":1,"89":1,"118":1,"189":1},"1":{"119":1,"120":1,"121":1,"122":1,"123":1,"124":1,"125":1,"126":1,"127":1,"128":1,"129":1,"130":1,"131":1,"132":1,"133":1,"134":1,"135":1,"136":1,"137":1,"138":1,"139":1,"140":1,"141":1,"142":1,"143":1,"144":1,"145":1,"146":1,"147":1,"148":1,"149":1,"150":1,"151":1,"152":1,"153":1,"154":1,"155":1,"156":1,"157":1,"158":1,"159":1,"160":1,"161":1,"162":1,"163":1,"164":1,"165":1,"166":1,"167":1,"168":1},"2":{"1":2,"12":1,"13":1,"19":1,"20":1,"23":2,"27":1,"29":14,"36":2,"37":1,"86":1,"175":1,"180":1}}],["instead",{"2":{"29":6,"83":1,"87":3,"88":1,"89":1,"102":1,"139":1,"141":1,"144":1,"186":1,"188":1,"189":3}}],["invalid",{"2":{"175":1}}],["invalidity",{"2":{"26":1}}],["individuals",{"2":{"222":1}}],["indicatortitle",{"2":{"221":3}}],["indicatorbuttoncontainer",{"2":{"221":6}}],["indicatorfigure",{"2":{"115":1}}],["indicatorfigurestyle",{"2":{"115":1}}],["indicatorfigureattrs",{"2":{"115":1}}],["indicatorfigureattrscallbackcoordinate",{"2":{"115":1}}],["indicatorfigureattrscallbackdata",{"2":{"115":1}}],["indicatordata",{"2":{"115":3}}],["indicatorstyle",{"2":{"115":4}}],["indicators",{"0":{"113":1,"114":1,"209":1},"1":{"115":1,"116":1,"117":1},"2":{"11":1,"16":1,"46":1,"90":1,"94":1,"112":1,"149":1,"171":1,"210":2}}],["indicator",{"0":{"45":1,"112":1,"191":1,"210":2,"217":1},"1":{"113":1,"114":1,"115":1,"116":1,"117":1},"2":{"1":1,"4":1,"7":1,"9":1,"10":2,"12":1,"13":1,"20":1,"29":11,"36":2,"45":9,"112":1,"114":3,"115":24,"116":1,"117":1,"123":1,"146":6,"147":5,"148":2,"149":1,"182":1,"186":3,"191":3,"200":1,"217":4,"219":2,"221":3}}],["index",{"2":{"115":8,"156":1,"159":1,"165":2,"175":4,"184":2,"204":1,"212":1,"214":1,"216":1,"217":1,"218":1,"219":1,"220":1,"221":1}}],["info",{"2":{"49":1,"50":1,"85":2,"221":2}}],["information",{"2":{"42":1,"45":3,"47":2,"71":1,"72":1,"75":1,"76":1,"103":1,"114":1,"115":8,"146":1,"147":3,"148":1,"151":1,"152":1,"161":1,"175":6,"176":1,"222":1}}],["integration",{"2":{"171":1}}],["interested",{"2":{"197":1}}],["internationalized",{"2":{"182":1}}],["internationalization",{"0":{"109":1},"1":{"110":1,"111":1}}],["internal",{"2":{"20":2}}],["interact",{"2":{"90":1}}],["introduces",{"2":{"112":1,"172":1}}],["introduction",{"0":{"85":1,"169":1,"197":1},"1":{"170":1,"171":1},"2":{"28":1}}],["into",{"2":{"36":2,"54":1,"63":2,"96":1,"167":1,"185":1,"186":1,"189":1,"191":1}}],["intl",{"2":{"36":1,"64":1,"175":2}}],["input",{"0":{"85":1},"2":{"24":1,"36":1,"146":1}}],["includeoverlay",{"0":{"167":1},"2":{"167":2}}],["include",{"2":{"115":1,"167":1,"175":1,"182":2}}],["increments",{"2":{"36":1}}],["increment",{"2":{"16":1,"41":1,"115":1}}],["incorrect",{"2":{"5":1,"14":1}}],["initial",{"2":{"179":1}}],["initialized",{"0":{"206":1}}],["initialize",{"2":{"9":2,"36":1}}],["init",{"0":{"36":1,"87":1},"2":{"13":1,"86":1,"111":1,"179":12,"180":1,"212":2,"213":2,"214":2,"215":2,"216":2,"217":2,"218":2,"219":2,"220":2,"221":2}}],["ineffective",{"2":{"10":1}}],["in",{"0":{"96":1,"113":1,"173":1,"209":1,"210":1},"1":{"97":1,"98":1,"99":1,"100":1,"101":1,"102":1},"2":{"1":2,"2":1,"3":1,"4":1,"6":1,"9":2,"16":1,"17":1,"18":1,"23":1,"25":2,"26":1,"29":1,"36":2,"38":1,"68":1,"86":1,"90":1,"94":1,"103":1,"108":1,"109":1,"112":2,"114":1,"115":8,"117":3,"143":1,"146":1,"158":1,"168":1,"171":1,"172":2,"174":1,"175":9,"176":1,"178":1,"197":1,"200":2,"211":1,"212":2,"214":2,"216":2,"217":2,"218":3,"219":2,"220":2,"221":2}}],["inaccurate",{"2":{"1":1,"25":1}}],["let",{"2":{"212":3,"213":3,"214":3,"215":3,"216":3,"217":4,"218":3,"219":3,"220":3,"221":3}}],["length",{"2":{"176":1,"182":2,"212":3,"213":3,"214":3,"215":4,"216":3,"217":3,"218":4,"219":3,"220":3,"221":3}}],["less",{"2":{"146":2,"161":2}}],["left",{"2":{"76":1,"82":2,"85":1,"101":1,"108":1,"115":4,"120":1,"130":1,"131":1,"132":1,"134":1,"175":2,"182":5,"212":2}}],["level",{"2":{"47":1,"115":1,"147":1,"152":1,"175":1}}],["li888",{"2":{"222":1}}],["license",{"2":{"222":1}}],["light",{"2":{"219":3}}],["lightweight",{"2":{"170":1,"171":1}}],["link",{"2":{"204":1,"222":1}}],["lint",{"2":{"203":2}}],["liner",{"2":{"212":1}}],["linecolor",{"2":{"182":1}}],["linewidth",{"2":{"107":1}}],["lineto",{"2":{"107":6}}],["linesize",{"2":{"182":1}}],["lines",{"2":{"29":1,"147":1,"182":1,"186":2}}],["line",{"0":{"73":1,"79":1,"99":1,"206":1,"207":1},"2":{"1":1,"8":1,"14":1,"18":1,"21":1,"25":1,"29":2,"68":1,"69":1,"70":1,"73":2,"78":1,"79":5,"80":1,"81":1,"82":1,"96":1,"97":1,"98":1,"99":2,"100":1,"101":1,"106":3,"115":2,"116":5,"117":3,"139":1,"140":1,"141":1,"150":1,"152":1,"171":1,"180":1,"182":4,"186":1,"200":1,"212":2,"213":2,"214":2,"215":2,"216":2,"217":2,"218":3,"219":4,"220":2,"221":2}}],["liihuu",{"2":{"193":2}}],["like",{"2":{"103":1,"114":1,"171":1,"174":1}}],["list",{"2":{"36":2,"124":1}}],["labels",{"2":{"186":1}}],["lang",{"2":{"216":2}}],["lang=",{"2":{"179":1}}],["languages",{"2":{"109":1}}],["language",{"0":{"110":1,"111":1},"2":{"36":1,"38":3,"40":1,"109":1,"110":2,"111":2}}],["layer",{"2":{"167":1,"200":2}}],["layout",{"2":{"9":1,"13":1,"36":3,"86":1,"87":1}}],["large",{"2":{"45":1,"63":1,"115":1,"147":1,"222":1}}],["lastdata",{"2":{"215":2}}],["lastvaluemark",{"2":{"29":1,"182":1}}],["last",{"2":{"29":1,"141":1,"182":1,"219":2,"221":1}}],["latest",{"2":{"14":1}}],["loadmoretimer",{"2":{"215":1}}],["loadmore",{"0":{"144":1},"2":{"215":1}}],["load",{"2":{"92":1,"144":1,"145":1}}],["location",{"2":{"156":1}}],["located",{"2":{"115":1,"175":1}}],["localized",{"2":{"40":1}}],["localization",{"2":{"38":1}}],["local",{"0":{"196":1},"1":{"197":1,"198":1,"199":1,"200":1,"201":1,"202":1,"203":1,"204":1},"2":{"36":1,"124":1}}],["locales",{"0":{"38":1},"2":{"38":2,"110":1}}],["locale",{"0":{"38":1},"2":{"36":2,"38":2}}],["locked",{"2":{"47":1,"152":1}}],["lock",{"2":{"47":2,"150":3,"152":3,"175":2}}],["lower",{"2":{"200":1}}],["lowest",{"2":{"90":1}}],["low",{"2":{"38":1,"90":1,"110":1,"139":1,"140":1,"141":1,"142":1,"179":70,"182":3,"212":3,"213":3,"214":3,"215":5,"216":4,"217":3,"218":3,"219":3,"220":3,"221":3}}],["longer",{"2":{"29":1,"37":1,"184":1}}],["long",{"2":{"10":1}}],["logo",{"2":{"222":2}}],["logarithm",{"2":{"212":1}}],["log",{"0":{"0":1},"1":{"1":1,"2":1,"3":1,"4":1,"5":1,"6":1,"7":1,"8":1,"9":1,"10":1,"11":1,"12":1,"13":1,"14":1,"15":1,"16":1,"17":1,"18":1,"19":1,"20":1,"21":1,"22":1,"23":1,"24":1,"25":1,"26":1,"27":1,"28":1,"29":1,"30":1,"31":1,"32":1,"33":1,"34":1},"2":{"23":1,"30":1,"31":1,"32":1,"150":14,"152":14,"182":1,"212":1}}],["bc1qnwzukszzk5xfk0zs3sr8etzgctgnrtqts43jzp3khe6gm7xazprsp4y6n3",{"2":{"226":1}}],["btc",{"2":{"226":1}}],["build",{"2":{"203":16}}],["built",{"0":{"96":1,"113":1,"173":1,"209":1,"210":1},"1":{"97":1,"98":1,"99":1,"100":1,"101":1,"102":1},"2":{"9":1,"16":1,"17":1,"25":2,"26":1,"36":1,"38":1,"92":1,"94":1,"96":1,"103":1,"109":1,"112":1,"114":1,"115":4,"171":1,"172":1,"174":1,"175":3,"176":1,"203":8,"211":1,"218":1}}],["business",{"2":{"200":1}}],["button",{"2":{"212":24,"214":9,"216":9,"217":14,"218":9,"219":9,"220":9,"221":26}}],["buttoncontainer",{"2":{"212":7,"214":4,"216":4,"217":7,"218":4,"219":4,"220":4}}],["but",{"2":{"178":1}}],["bun",{"2":{"178":1}}],["bmp",{"2":{"167":1}}],["bbi",{"2":{"113":1}}],["brar",{"2":{"113":1}}],["browser",{"0":{"92":1},"2":{"92":1}}],["browsers",{"2":{"10":1}}],["bias",{"2":{"113":1}}],["big",{"2":{"36":1}}],["b",{"2":{"61":2,"68":2}}],["body>",{"2":{"179":2}}],["box",{"2":{"171":1}}],["boundary",{"2":{"145":1}}],["bounding",{"2":{"45":3,"85":1,"115":4,"146":1,"147":1,"175":1,"191":2}}],["boll",{"2":{"113":1,"147":2,"217":1}}],["bordered",{"2":{"176":1}}],["borderradius",{"2":{"81":2,"82":2,"100":1,"101":1,"182":8}}],["border",{"2":{"78":4,"80":4,"81":5,"82":5,"98":3,"99":3,"100":4,"101":4,"105":1,"106":5,"107":1,"176":1,"212":2,"214":2,"216":2,"217":2,"218":2,"219":2,"220":2,"221":2}}],["borderdashedvalue",{"2":{"78":2,"80":2,"81":2,"82":2,"98":1,"99":1,"100":1,"101":1,"107":2,"147":2,"182":11,"219":4}}],["bordersize",{"2":{"78":2,"80":2,"81":2,"82":2,"98":1,"99":1,"100":1,"101":1,"106":2,"107":2,"147":2,"182":13,"219":4}}],["borderstyle",{"2":{"29":4,"78":2,"80":2,"81":2,"82":2,"98":1,"99":1,"100":1,"101":1,"106":2,"107":2,"147":2,"182":11,"219":4}}],["bordercolor",{"2":{"78":2,"80":2,"81":2,"82":2,"98":1,"99":1,"100":1,"101":1,"106":2,"107":2,"182":10}}],["bool",{"2":{"60":1}}],["boolean",{"2":{"36":2,"42":1,"45":4,"47":25,"55":1,"56":1,"57":1,"58":1,"59":1,"60":1,"71":1,"72":1,"73":1,"74":1,"75":1,"76":1,"104":2,"115":4,"126":1,"127":1,"128":1,"129":1,"139":1,"140":1,"145":1,"146":7,"147":4,"150":38,"152":19,"161":2,"165":1,"166":1,"167":1,"175":22}}],["bottom",{"2":{"36":2,"76":1,"82":2,"85":1,"87":1,"101":1,"115":4,"120":1,"146":5,"161":4,"175":2,"200":1}}],["background",{"2":{"82":1,"101":1,"105":1,"106":2,"167":1,"212":1,"214":1,"216":1,"217":1,"218":1,"219":1,"220":1,"221":1}}],["backgroundcolor",{"0":{"167":1},"2":{"82":2,"101":1,"167":2,"182":7,"219":2}}],["backward",{"2":{"10":1,"145":2}}],["bash",{"2":{"202":1}}],["bashbun",{"2":{"178":1}}],["bashpnpm",{"2":{"178":1}}],["bashyarn",{"2":{"178":1}}],["bashnpm",{"2":{"178":1}}],["basetitle",{"2":{"221":3}}],["basebuttoncontainer",{"2":{"221":6}}],["baseprice",{"2":{"212":3,"213":3,"214":3,"215":3,"216":3,"217":3,"218":3,"219":3,"220":3,"221":3}}],["based",{"2":{"92":1,"152":1}}],["baseline",{"2":{"76":2,"82":2,"101":1}}],["basevalue",{"2":{"45":2,"115":1,"146":2,"147":2}}],["base",{"2":{"24":1,"115":1,"221":1}}],["basically",{"2":{"171":1,"180":1}}],["basic",{"0":{"213":1},"2":{"1":1,"42":1,"43":1,"94":1,"176":1,"200":1}}],["barcount",{"0":{"134":1,"135":1},"2":{"134":1,"135":1}}],["barspace",{"2":{"45":3,"115":3,"146":1,"147":1,"175":1,"191":1,"217":2}}],["bars",{"2":{"29":1,"147":1,"182":1,"186":1,"219":2}}],["bar",{"2":{"12":2,"20":1,"23":6,"29":1,"115":1,"175":1,"182":1,"186":1,"219":2}}],["by",{"2":{"7":1,"22":1,"39":1,"40":1,"43":1,"69":1,"70":1,"115":2,"148":1,"151":1,"153":1,"176":1,"191":1,"209":1,"222":1}}],["blue",{"2":{"182":1}}],["blurry",{"2":{"1":1,"12":1}}],["blank",{"2":{"6":1,"184":1}}],["berlin",{"2":{"220":2}}],["best",{"2":{"117":1}}],["between",{"2":{"115":1,"175":1}}],["beginpath",{"2":{"107":3}}],["benchmark",{"2":{"101":1}}],["been",{"2":{"29":1,"139":1,"140":1,"141":1,"144":1,"152":1}}],["being",{"2":{"5":1}}],["be",{"0":{"206":1},"2":{"3":1,"5":1,"8":1,"36":3,"37":2,"83":1,"84":1,"90":1,"94":1,"95":1,"102":1,"115":6,"117":4,"121":1,"123":1,"127":1,"130":1,"131":1,"139":1,"140":1,"141":3,"143":1,"146":6,"147":1,"148":2,"150":1,"152":2,"154":1,"155":1,"156":1,"157":1,"158":2,"159":1,"160":1,"161":5,"165":3,"166":2,"167":3,"171":1,"175":13,"176":1,"180":1,"182":3,"197":1,"211":2,"212":1,"214":1,"216":1,"217":1,"218":1,"219":1,"220":1,"221":1,"222":1}}],["🙋",{"0":{"205":1},"1":{"206":1,"207":1,"208":1,"209":1,"210":1,"211":1}}],["💬",{"0":{"192":1},"1":{"193":1,"194":1,"195":1}}],["🛡",{"2":{"171":1}}],["📱",{"2":{"171":1}}],["💪",{"2":{"171":1}}],["🚀",{"0":{"177":1},"1":{"178":1,"179":1},"2":{"171":1}}],["📦",{"2":{"171":1}}],["📃",{"0":{"169":1},"1":{"170":1,"171":1}}],["📚",{"0":{"90":1}}],["🗑",{"2":{"29":1}}],["👉",{"2":{"29":1}}],["🛠️",{"0":{"183":1},"1":{"184":1,"185":1,"186":1,"187":1,"188":1,"189":1,"190":1,"191":1}}],["🛠",{"2":{"29":1}}],["🖋️",{"2":{"13":1}}],["💄",{"2":{"1":2,"3":1,"6":1,"7":4,"8":2,"9":2,"10":2,"12":1,"13":2,"16":3,"17":1,"18":2,"19":1,"20":3,"21":1,"22":2,"23":2,"24":3,"25":1,"26":1,"27":1}}],["🐞",{"2":{"1":3,"2":2,"3":2,"4":1,"5":3,"6":2,"7":1,"8":1,"9":2,"10":3,"11":2,"12":2,"13":2,"14":2,"15":1,"16":1,"18":2,"21":1,"24":2,"25":2,"26":1,"28":1}}],["📠",{"0":{"0":1},"1":{"1":1,"2":1,"3":1,"4":1,"5":1,"6":1,"7":1,"8":1,"9":1,"10":1,"11":1,"12":1,"13":1,"14":1,"15":1,"16":1,"17":1,"18":1,"19":1,"20":1,"21":1,"22":1,"23":1,"24":1,"25":1,"26":1,"27":1,"28":1,"29":1,"30":1,"31":1,"32":1,"33":1,"34":1}}],["8px",{"2":{"212":1,"214":1,"216":1,"217":1,"218":1,"219":1,"220":1,"221":1}}],["800",{"2":{"212":1,"213":1,"214":1,"215":1,"216":1,"217":1,"218":1,"219":1,"220":1,"221":1}}],["85",{"2":{"182":3,"219":1}}],["88",{"2":{"179":7}}],["888888",{"2":{"147":2,"182":14,"219":4}}],["89",{"2":{"179":7}}],["8",{"0":{"1":1,"2":1,"3":2,"4":1,"5":1,"6":1,"7":1,"8":1,"9":1,"10":1,"30":1,"49":1,"50":1,"66":1,"84":1,"145":1},"1":{"85":1,"86":1,"87":1,"88":1,"89":1},"2":{"7":1,"30":1,"36":1,"139":1,"140":1,"141":1,"144":1,"146":1,"150":1,"152":1,"161":1,"179":1,"182":7,"183":2}}],["96",{"2":{"179":7}}],["935ebd",{"2":{"182":1}}],["93",{"2":{"179":21}}],["94",{"2":{"179":7}}],["99",{"2":{"179":14}}],["9",{"0":{"1":1,"2":2,"3":1,"4":1,"5":1,"6":1,"7":1,"8":1,"9":1,"10":1,"11":1,"12":1,"13":1,"14":1,"15":1,"16":1,"17":1,"18":1,"19":1,"20":1,"21":1,"22":1,"23":1,"24":1,"25":1,"26":1,"27":1,"28":1,"29":1},"2":{"113":3,"139":1,"140":1,"141":1,"144":1,"183":1}}]],"serializationVersion":2}';export{e as default}; diff --git a/assets/chunks/@localSearchIndexroot.CaCbrMu3.js b/assets/chunks/@localSearchIndexroot.CaCbrMu3.js new file mode 100644 index 0000000..d09607d --- /dev/null +++ b/assets/chunks/@localSearchIndexroot.CaCbrMu3.js @@ -0,0 +1 @@ +const e='{"documentCount":230,"nextId":230,"documentIds":{"0":"/guide/changelog#📠-更新日志","1":"/guide/changelog#_9-8-10","2":"/guide/changelog#_9-8-9","3":"/guide/changelog#_9-8-8","4":"/guide/changelog#_9-8-7","5":"/guide/changelog#_9-8-6","6":"/guide/changelog#_9-8-5","7":"/guide/changelog#_9-8-3","8":"/guide/changelog#_9-8-2","9":"/guide/changelog#_9-8-1","10":"/guide/changelog#_9-8-0","11":"/guide/changelog#_9-7-2","12":"/guide/changelog#_9-7-1","13":"/guide/changelog#_9-7-0","14":"/guide/changelog#_9-6-0","15":"/guide/changelog#_9-5-4","16":"/guide/changelog#_9-5-3","17":"/guide/changelog#_9-5-2","18":"/guide/changelog#_9-5-1","19":"/guide/changelog#_9-5-0","20":"/guide/changelog#_9-4-0","21":"/guide/changelog#_9-3-0","22":"/guide/changelog#_9-2-2","23":"/guide/changelog#_9-2-1","24":"/guide/changelog#_9-2-0","25":"/guide/changelog#_9-1-3","26":"/guide/changelog#_9-1-2","27":"/guide/changelog#_9-1-1","28":"/guide/changelog#_9-1-0","29":"/guide/changelog#_9-0-1","30":"/guide/changelog#_9-0-0","31":"/guide/changelog#_8-x","32":"/guide/changelog#_7-x","33":"/guide/changelog#_6-x","34":"/guide/changelog#_5-x","35":"/guide/changelog#_4-x","36":"/guide/custom-axis#自定义坐标轴-9-8-0","37":"/guide/custom-axis#入参说明","38":"/guide/custom-axis#使用说明","39":"/guide/custom-axis#使用-init-方法","40":"/guide/custom-axis#使用-createindicator-方法","41":"/guide/custom-axis#使用-setpaneoptions-方法","42":"/guide/data-source#📚-数据","43":"/guide/chart-api#图表api","44":"/guide/chart-api#init-ds-options","45":"/guide/chart-api#dispose-dcs","46":"/guide/chart-api#registerlocale-locale-locales","47":"/guide/chart-api#getoverlayclass","48":"/guide/chart-api#getsupportedlocales","49":"/guide/chart-api#registerstyles-name-styles","50":"/guide/chart-api#registerfigure-figure","51":"/guide/chart-api#getsupportedfigures","52":"/guide/chart-api#getfigureclass-name","53":"/guide/chart-api#registerindicator-indicator","54":"/guide/chart-api#getsupportedindicators","55":"/guide/chart-api#registeroverlay-overlay","56":"/guide/chart-api#getsupportedoverlays","57":"/guide/chart-api#registerxaxis-axis-9-8-0","58":"/guide/chart-api#registeryaxis-axis-9-8-0","59":"/guide/chart-api#version","60":"/guide/chart-api#utils","61":"/guide/chart-api#utils-clone-target","62":"/guide/chart-api#utils-merge-target-source","63":"/guide/chart-api#utils-isstring-value","64":"/guide/chart-api#utils-isnumber-value","65":"/guide/chart-api#utils-isvalid-value","66":"/guide/chart-api#utils-isobject-value","67":"/guide/chart-api#utils-isfunction-value","68":"/guide/chart-api#utils-isboolean-value","69":"/guide/chart-api#utils-formatvalue-value-key-defaultvalue","70":"/guide/chart-api#utils-formatprecision-value","71":"/guide/chart-api#utils-formatbignumber-value","72":"/guide/chart-api#utils-formatdate-datetimeformat-timestamp-format","73":"/guide/chart-api#utils-formatthousands-value-sign","74":"/guide/chart-api#utils-formatfolddecimal-value-threshold-9-8-0","75":"/guide/chart-api#utils-calctextwidth-text-size-weight-family-9-3-0","76":"/guide/chart-api#utils-getlinearslopeintercept-coordinate1-coordinate2","77":"/guide/chart-api#utils-getlinearyfromcoordinates-coordinate1-coordinate2-targetcoordinate","78":"/guide/chart-api#utils-getlinearyfromslopeintercept-kb-targetcoordinate","79":"/guide/chart-api#utils-checkcoordinateonarc-coordinate-arc","80":"/guide/chart-api#utils-checkcoordinateoncircle-coordinate-circle","81":"/guide/chart-api#utils-checkcoordinateonline-coordinate-line","82":"/guide/chart-api#utils-checkcoordinateonpolygon-coordinate-polygon","83":"/guide/chart-api#utils-checkcoordinateonrect-coordinate-rect","84":"/guide/chart-api#utils-checkcoordinateontext-coordinate-text-styles","85":"/guide/chart-api#utils-drawarc-ctx-arc-styles","86":"/guide/chart-api#utils-drawcircle-ctx-circle-styles","87":"/guide/chart-api#utils-drawline-ctx-line-styles","88":"/guide/chart-api#utils-drawpolygon-ctx-polygon-styles","89":"/guide/chart-api#utils-drawrect-ctx-rect-styles","90":"/guide/chart-api#utils-drawtext-ctx-text-styles","91":"/guide/chart-api#utils-drawrecttext-ctx-recttext-styles","92":"/guide/environment#🏝️-环境要求","93":"/guide/environment#浏览器支持","94":"/guide/environment#兼容处理","95":"/guide/hot-key#⌨️-快捷键","96":"/guide/figure#基础图形","97":"/guide/figure#使用示例","98":"/guide/figure#内置基础图形","99":"/guide/figure#arc","100":"/guide/figure#circle","101":"/guide/figure#line","102":"/guide/figure#polygon","103":"/guide/figure#rect","104":"/guide/figure#text","105":"/guide/figure#recttext","106":"/guide/figure#自定义基础图形","107":"/guide/figure#属性说明","108":"/guide/figure#示例","109":"/guide/figure#步骤一","110":"/guide/figure#步骤二","111":"/guide/i18n#🌏-国际化","112":"/guide/i18n#增加语言包","113":"/guide/i18n#使用语言包","114":"/guide/indicator#技术指标","115":"/guide/indicator#内置技术指标","116":"/guide/indicator#自定义技术指标","117":"/guide/indicator#属性说明","118":"/guide/indicator#示例","119":"/guide/indicator#步骤一","120":"/guide/indicator#步骤二","121":"/guide/introduction#📃-介绍","122":"/guide/introduction#什么是-klinechart","123":"/guide/introduction#特性","124":"/guide/instance-api#实例api","125":"/guide/instance-api#getdom-paneid-position","126":"/guide/instance-api#getsize-paneid-position","127":"/guide/instance-api#setstyles-styles","128":"/guide/instance-api#getstyles","129":"/guide/instance-api#setpricevolumeprecision-priceprecision-volumeprecision","130":"/guide/instance-api#settimezone-timezone","131":"/guide/instance-api#gettimezone","132":"/guide/instance-api#setzoomenabled-enabled","133":"/guide/instance-api#iszoomenabled","134":"/guide/instance-api#setscrollenabled-enabled","135":"/guide/instance-api#isscrollenabled","136":"/guide/instance-api#setoffsetrightdistance-distance","137":"/guide/instance-api#getoffsetrightdistance-9-2-0","138":"/guide/instance-api#setmaxoffsetleftdistance-9-7-0","139":"/guide/instance-api#setmaxoffsetrightdistance-9-7-0","140":"/guide/instance-api#setleftminvisiblebarcount-barcount","141":"/guide/instance-api#setrightminvisiblebarcount-barcount","142":"/guide/instance-api#setbarspace-space","143":"/guide/instance-api#getbarspace","144":"/guide/instance-api#getvisiblerange","145":"/guide/instance-api#applynewdata-datalist-more-callback","146":"/guide/instance-api#applymoredata-datalist-more-callback","147":"/guide/instance-api#updatedata-data-callback","148":"/guide/instance-api#getdatalist","149":"/guide/instance-api#cleardata","150":"/guide/instance-api#loadmore-cb","151":"/guide/instance-api#setloaddatacallback-cb-9-8-0","152":"/guide/instance-api#createindicator-value-isstack-paneoptions-callback","153":"/guide/instance-api#overrideindicator-override-paneid-callback","154":"/guide/instance-api#getindicatorbypaneid-paneid-name","155":"/guide/instance-api#removeindicator-paneid-name","156":"/guide/instance-api#createoverlay-value-paneid","157":"/guide/instance-api#getoverlaybyid-id","158":"/guide/instance-api#overrideoverlay-override","159":"/guide/instance-api#removeoverlay-remove","160":"/guide/instance-api#scrollbydistance-distance-animationduration","161":"/guide/instance-api#scrolltorealtime-animationduration","162":"/guide/instance-api#scrolltodataindex-dataindex-animationduration","163":"/guide/instance-api#scrolltotimestamp-timestamp-animationduration","164":"/guide/instance-api#zoomatcoordinate-scale-coordinate-animationduration","165":"/guide/instance-api#zoomatdataindex-scale-dataindex-animationduration","166":"/guide/instance-api#zoomattimestamp-scale-timestamp-animationduration","167":"/guide/instance-api#setpaneoptions-options","168":"/guide/instance-api#executeaction-type-data-9-2-0","169":"/guide/instance-api#subscribeaction-type-callback","170":"/guide/instance-api#unsubscribeaction-type-callback","171":"/guide/instance-api#converttopixel-value-finder","172":"/guide/instance-api#convertfrompixel-coordinate-finder","173":"/guide/instance-api#getconvertpictureurl-includeoverlay-type-backgroundcolor","174":"/guide/instance-api#resize","175":"/guide/overlay#覆盖物","176":"/guide/overlay#内置覆盖物类型","177":"/guide/overlay#自定义覆盖物","178":"/guide/overlay#属性说明","179":"/guide/overlay#示例","180":"/guide/quick-start#🚀-快速上手","181":"/guide/quick-start#获取klinechart","182":"/guide/quick-start#创建第一个图表","183":"/guide/styles#🎨-样式配置","184":"/guide/styles#图解说明","185":"/guide/styles#默认完整配置","186":"/guide/v8-to-v9#🛠️-从-v8-到-v9","187":"/guide/v8-to-v9#引入调整","188":"/guide/v8-to-v9#设计调整","189":"/guide/v8-to-v9#样式配置调整","190":"/guide/v8-to-v9#api调整","191":"/guide/v8-to-v9#图表api","192":"/guide/v8-to-v9#实例api","193":"/guide/v8-to-v9#图形辅助api","194":"/guide/v8-to-v9#自定义技术指标调整","195":"/more/faq#🙋-常见问题","196":"/more/faq#初始化图表后-只能看到一条线-是怎么回事","197":"/more/faq#蜡烛柱显示趋近于一条线-看不到波动-怎么办","198":"/more/faq#分时图怎么创建","199":"/more/faq#内置的技术指标-计算出来的数据不是想要的-怎么办","200":"/more/faq#想创建一个内置技术指标之外的指标-怎么办","201":"/more/faq#想标记一下买卖点-该怎么做","202":"/more/feedback#💬-反馈和共建","203":"/more/feedback#github","204":"/more/feedback#telegram","205":"/more/feedback#微信讨论群","206":"/more/local-development#本地开发","207":"/more/local-development#摘要","208":"/more/local-development#须知","209":"/more/local-development#文件目录说明","210":"/more/local-development#模块依赖关系","211":"/more/local-development#开发","212":"/more/local-development#安装依赖","213":"/more/local-development#npm-执行命令说明","214":"/more/local-development#调试","215":"/sample/axis#坐标轴","216":"/sample/basic#基础展示","217":"/sample/candle-type#蜡烛类型","218":"/sample/data#数据加载","219":"/sample/i18n#多语言","220":"/sample/indicator#技术指标","221":"/sample/overlay#覆盖物","222":"/sample/theme#主题","223":"/sample/timezone#时区","224":"/sample/tooltip#提示条","225":"/sponsor#❤️-赞助","226":"/sponsor#赞助渠道","227":"/sponsor#支付宝","228":"/sponsor#微信支付","229":"/sponsor#加密资产"},"fieldIds":{"title":0,"titles":1,"text":2},"fieldLength":{"0":[2,1,1],"1":[3,2,31],"2":[2,2,13],"3":[2,2,14],"4":[3,2,6],"5":[3,2,17],"6":[3,2,9],"7":[3,2,25],"8":[3,2,10],"9":[3,2,11],"10":[3,2,11],"11":[3,2,18],"12":[3,2,7],"13":[3,2,11],"14":[3,2,29],"15":[3,2,12],"16":[3,2,6],"17":[3,2,11],"18":[3,2,13],"19":[3,2,17],"20":[3,2,13],"21":[3,2,21],"22":[2,2,8],"23":[3,2,11],"24":[3,2,31],"25":[3,2,16],"26":[3,2,10],"27":[2,2,8],"28":[3,2,9],"29":[3,2,6],"30":[2,2,117],"31":[2,2,7],"32":[2,2,7],"33":[2,2,7],"34":[2,2,5],"35":[2,2,5],"36":[4,1,8],"37":[1,4,49],"38":[1,4,21],"39":[3,5,21],"40":[3,5,12],"41":[3,5,13],"42":[2,1,35],"43":[1,1,1],"44":[4,1,84],"45":[3,1,14],"46":[4,1,19],"47":[2,1,9],"48":[2,1,5],"49":[4,1,13],"50":[3,1,25],"51":[2,1,5],"52":[3,1,8],"53":[3,1,85],"54":[2,1,5],"55":[3,1,106],"56":[2,1,5],"57":[5,1,22],"58":[5,1,22],"59":[2,1,5],"60":[1,1,2],"61":[4,2,6],"62":[5,2,8],"63":[4,2,7],"64":[4,2,7],"65":[4,2,7],"66":[4,2,7],"67":[4,2,7],"68":[4,2,7],"69":[6,2,19],"70":[4,2,9],"71":[4,2,10],"72":[6,2,19],"73":[5,2,9],"74":[7,2,9],"75":[9,2,11],"76":[5,2,15],"77":[6,2,10],"78":[5,2,12],"79":[5,2,20],"80":[5,2,16],"81":[5,2,14],"82":[5,2,14],"83":[5,2,18],"84":[6,2,43],"85":[6,2,35],"86":[6,2,40],"87":[6,2,31],"88":[6,2,38],"89":[6,2,44],"90":[6,2,74],"91":[6,2,10],"92":[2,1,1],"93":[1,2,11],"94":[1,2,1],"95":[2,1,10],"96":[1,1,10],"97":[1,1,25],"98":[1,1,9],"99":[1,2,31],"100":[1,2,35],"101":[1,2,28],"102":[1,2,36],"103":[1,2,39],"104":[1,2,65],"105":[1,2,5],"106":[1,1,6],"107":[1,2,28],"108":[1,2,2],"109":[1,3,33],"110":[1,3,53],"111":[2,1,8],"112":[1,2,28],"113":[1,2,8],"114":[1,1,2],"115":[1,1,48],"116":[1,1,6],"117":[1,2,182],"118":[1,2,5],"119":[1,3,29],"120":[1,3,63],"121":[2,1,1],"122":[3,2,3],"123":[1,2,24],"124":[1,1,1],"125":[4,1,16],"126":[4,1,23],"127":[3,1,14],"128":[2,1,6],"129":[4,1,15],"130":[3,1,13],"131":[2,1,5],"132":[3,1,7],"133":[2,1,5],"134":[3,1,7],"135":[2,1,5],"136":[3,1,7],"137":[4,1,5],"138":[4,1,7],"139":[4,1,7],"140":[3,1,7],"141":[3,1,7],"142":[3,1,7],"143":[2,1,5],"144":[2,1,9],"145":[5,1,43],"146":[5,1,34],"147":[4,1,36],"148":[2,1,16],"149":[2,1,9],"150":[3,1,20],"151":[5,1,26],"152":[6,1,125],"153":[5,1,130],"154":[4,1,17],"155":[4,1,17],"156":[4,1,87],"157":[3,1,8],"158":[3,1,117],"159":[3,1,23],"160":[4,1,12],"161":[3,1,11],"162":[4,1,12],"163":[4,1,12],"164":[5,1,18],"165":[5,1,14],"166":[5,1,14],"167":[3,1,47],"168":[6,1,11],"169":[4,1,21],"170":[4,1,22],"171":[4,1,31],"172":[4,1,27],"173":[5,1,20],"174":[2,1,10],"175":[1,1,2],"176":[1,1,16],"177":[1,1,6],"178":[1,2,199],"179":[1,2,46],"180":[2,1,1],"181":[1,2,44],"182":[1,2,189],"183":[2,1,9],"184":[1,2,1],"185":[1,2,227],"186":[5,1,12],"187":[1,5,8],"188":[1,5,5],"189":[1,5,33],"190":[1,5,1],"191":[1,6,9],"192":[1,6,71],"193":[1,6,3],"194":[1,5,39],"195":[2,1,1],"196":[4,2,3],"197":[4,2,6],"198":[2,2,7],"199":[4,2,2],"200":[3,2,3],"201":[3,2,7],"202":[2,1,1],"203":[1,2,10],"204":[1,2,5],"205":[1,2,7],"206":[1,1,1],"207":[1,1,8],"208":[1,1,1],"209":[1,2,1],"210":[1,2,39],"211":[1,1,1],"212":[1,2,16],"213":[2,2,27],"214":[1,2,14],"215":[1,1,174],"216":[1,1,64],"217":[1,1,154],"218":[1,1,79],"219":[1,1,153],"220":[1,1,204],"221":[1,1,170],"222":[1,1,195],"223":[1,1,145],"224":[1,1,179],"225":[2,1,33],"226":[1,2,1],"227":[1,3,1],"228":[1,3,1],"229":[1,3,9]},"averageFieldLength":[2.7217391304347824,1.7434782608695647,27.691304347826094],"storedFields":{"0":{"title":"📠 更新日志","titles":[]},"1":{"title":"9.8.10","titles":["📠 更新日志"]},"2":{"title":"9.8.9","titles":["📠 更新日志"]},"3":{"title":"9.8.8","titles":["📠 更新日志"]},"4":{"title":"9.8.7","titles":["📠 更新日志"]},"5":{"title":"9.8.6","titles":["📠 更新日志"]},"6":{"title":"9.8.5","titles":["📠 更新日志"]},"7":{"title":"9.8.3","titles":["📠 更新日志"]},"8":{"title":"9.8.2","titles":["📠 更新日志"]},"9":{"title":"9.8.1","titles":["📠 更新日志"]},"10":{"title":"9.8.0","titles":["📠 更新日志"]},"11":{"title":"9.7.2","titles":["📠 更新日志"]},"12":{"title":"9.7.1","titles":["📠 更新日志"]},"13":{"title":"9.7.0","titles":["📠 更新日志"]},"14":{"title":"9.6.0","titles":["📠 更新日志"]},"15":{"title":"9.5.4","titles":["📠 更新日志"]},"16":{"title":"9.5.3","titles":["📠 更新日志"]},"17":{"title":"9.5.2","titles":["📠 更新日志"]},"18":{"title":"9.5.1","titles":["📠 更新日志"]},"19":{"title":"9.5.0","titles":["📠 更新日志"]},"20":{"title":"9.4.0","titles":["📠 更新日志"]},"21":{"title":"9.3.0","titles":["📠 更新日志"]},"22":{"title":"9.2.2","titles":["📠 更新日志"]},"23":{"title":"9.2.1","titles":["📠 更新日志"]},"24":{"title":"9.2.0","titles":["📠 更新日志"]},"25":{"title":"9.1.3","titles":["📠 更新日志"]},"26":{"title":"9.1.2","titles":["📠 更新日志"]},"27":{"title":"9.1.1","titles":["📠 更新日志"]},"28":{"title":"9.1.0","titles":["📠 更新日志"]},"29":{"title":"9.0.1","titles":["📠 更新日志"]},"30":{"title":"9.0.0","titles":["📠 更新日志"]},"31":{"title":"8.x","titles":["📠 更新日志"]},"32":{"title":"7.x","titles":["📠 更新日志"]},"33":{"title":"6.x","titles":["📠 更新日志"]},"34":{"title":"5.x","titles":["📠 更新日志"]},"35":{"title":"4.x","titles":["📠 更新日志"]},"36":{"title":"自定义坐标轴 ^9.8.0","titles":[]},"37":{"title":"入参说明","titles":["自定义坐标轴 ^9.8.0"]},"38":{"title":"使用说明","titles":["自定义坐标轴 ^9.8.0"]},"39":{"title":"使用 init 方法","titles":["自定义坐标轴 ^9.8.0","使用说明"]},"40":{"title":"使用 createIndicator 方法","titles":["自定义坐标轴 ^9.8.0","使用说明"]},"41":{"title":"使用 setPaneOptions 方法","titles":["自定义坐标轴 ^9.8.0","使用说明"]},"42":{"title":"📚 数据","titles":[]},"43":{"title":"图表API","titles":[]},"44":{"title":"init(ds, options)","titles":["图表API"]},"45":{"title":"dispose(dcs)","titles":["图表API"]},"46":{"title":"registerLocale(locale, locales)","titles":["图表API"]},"47":{"title":"getOverlayClass()","titles":["图表API"]},"48":{"title":"getSupportedLocales()","titles":["图表API"]},"49":{"title":"registerStyles(name, styles)","titles":["图表API"]},"50":{"title":"registerFigure(figure)","titles":["图表API"]},"51":{"title":"getSupportedFigures()","titles":["图表API"]},"52":{"title":"getFigureClass(name)","titles":["图表API"]},"53":{"title":"registerIndicator(indicator)","titles":["图表API"]},"54":{"title":"getSupportedIndicators()","titles":["图表API"]},"55":{"title":"registerOverlay(overlay)","titles":["图表API"]},"56":{"title":"getSupportedOverlays()","titles":["图表API"]},"57":{"title":"registerXAxis(axis) ^9.8.0","titles":["图表API"]},"58":{"title":"registerYAxis(axis) ^9.8.0","titles":["图表API"]},"59":{"title":"version()","titles":["图表API"]},"60":{"title":"utils","titles":["图表API"]},"61":{"title":"utils.clone(target)","titles":["图表API","utils"]},"62":{"title":"utils.merge(target, source)","titles":["图表API","utils"]},"63":{"title":"utils.isString(value)","titles":["图表API","utils"]},"64":{"title":"utils.isNumber(value)","titles":["图表API","utils"]},"65":{"title":"utils.isValid(value)","titles":["图表API","utils"]},"66":{"title":"utils.isObject(value)","titles":["图表API","utils"]},"67":{"title":"utils.isFunction(value)","titles":["图表API","utils"]},"68":{"title":"utils.isBoolean(value)","titles":["图表API","utils"]},"69":{"title":"utils.formatValue(value, key, defaultValue)","titles":["图表API","utils"]},"70":{"title":"utils.formatPrecision(value)","titles":["图表API","utils"]},"71":{"title":"utils.formatBigNumber(value)","titles":["图表API","utils"]},"72":{"title":"utils.formatDate(dateTimeFormat, timestamp, format)","titles":["图表API","utils"]},"73":{"title":"utils.formatThousands(value, sign)","titles":["图表API","utils"]},"74":{"title":"utils.formatFoldDecimal(value, threshold) ^9.8.0","titles":["图表API","utils"]},"75":{"title":"utils.calcTextWidth(text, size, weight, family) ^9.3.0","titles":["图表API","utils"]},"76":{"title":"utils.getLinearSlopeIntercept(coordinate1, coordinate2)","titles":["图表API","utils"]},"77":{"title":"utils.getLinearYFromCoordinates(coordinate1, coordinate2, targetCoordinate)","titles":["图表API","utils"]},"78":{"title":"utils.getLinearYFromSlopeIntercept(kb, targetCoordinate)","titles":["图表API","utils"]},"79":{"title":"utils.checkCoordinateOnArc(coordinate, arc)","titles":["图表API","utils"]},"80":{"title":"utils.checkCoordinateOnCircle(coordinate, circle)","titles":["图表API","utils"]},"81":{"title":"utils.checkCoordinateOnLine(coordinate, line)","titles":["图表API","utils"]},"82":{"title":"utils.checkCoordinateOnPolygon(coordinate, polygon)","titles":["图表API","utils"]},"83":{"title":"utils.checkCoordinateOnRect(coordinate, rect)","titles":["图表API","utils"]},"84":{"title":"utils.checkCoordinateOnText(coordinate, text, styles)","titles":["图表API","utils"]},"85":{"title":"utils.drawArc(ctx, arc, styles)","titles":["图表API","utils"]},"86":{"title":"utils.drawCircle(ctx, circle, styles)","titles":["图表API","utils"]},"87":{"title":"utils.drawLine(ctx, line, styles)","titles":["图表API","utils"]},"88":{"title":"utils.drawPolygon(ctx, polygon, styles)","titles":["图表API","utils"]},"89":{"title":"utils.drawRect(ctx, rect, styles)","titles":["图表API","utils"]},"90":{"title":"utils.drawText(ctx, text, styles)","titles":["图表API","utils"]},"91":{"title":"utils.drawRectText(ctx, rectText, styles)","titles":["图表API","utils"]},"92":{"title":"🏝️ 环境要求","titles":[]},"93":{"title":"浏览器支持","titles":["🏝️ 环境要求"]},"94":{"title":"兼容处理","titles":["🏝️ 环境要求"]},"95":{"title":"⌨️ 快捷键","titles":[]},"96":{"title":"基础图形","titles":[]},"97":{"title":"使用示例","titles":["基础图形"]},"98":{"title":"内置基础图形","titles":["基础图形"]},"99":{"title":"arc","titles":["基础图形","内置基础图形"]},"100":{"title":"circle","titles":["基础图形","内置基础图形"]},"101":{"title":"line","titles":["基础图形","内置基础图形"]},"102":{"title":"polygon","titles":["基础图形","内置基础图形"]},"103":{"title":"rect","titles":["基础图形","内置基础图形"]},"104":{"title":"text","titles":["基础图形","内置基础图形"]},"105":{"title":"rectText","titles":["基础图形","内置基础图形"]},"106":{"title":"自定义基础图形","titles":["基础图形"]},"107":{"title":"属性说明","titles":["基础图形","自定义基础图形"]},"108":{"title":"示例","titles":["基础图形","自定义基础图形"]},"109":{"title":"步骤一","titles":["基础图形","自定义基础图形","示例"]},"110":{"title":"步骤二","titles":["基础图形","自定义基础图形","示例"]},"111":{"title":"🌏 国际化","titles":[]},"112":{"title":"增加语言包","titles":["🌏 国际化"]},"113":{"title":"使用语言包","titles":["🌏 国际化"]},"114":{"title":"技术指标","titles":[]},"115":{"title":"内置技术指标","titles":["技术指标"]},"116":{"title":"自定义技术指标","titles":["技术指标"]},"117":{"title":"属性说明","titles":["技术指标","自定义技术指标"]},"118":{"title":"示例","titles":["技术指标","自定义技术指标"]},"119":{"title":"步骤一","titles":["技术指标","自定义技术指标","示例"]},"120":{"title":"步骤二","titles":["技术指标","自定义技术指标","示例"]},"121":{"title":"📃 介绍","titles":[]},"122":{"title":"什么是 KLineChart?","titles":["📃 介绍"]},"123":{"title":"特性","titles":["📃 介绍"]},"124":{"title":"实例API","titles":[]},"125":{"title":"getDom(paneId, position)","titles":["实例API"]},"126":{"title":"getSize(paneId, position)","titles":["实例API"]},"127":{"title":"setStyles(styles)","titles":["实例API"]},"128":{"title":"getStyles()","titles":["实例API"]},"129":{"title":"setPriceVolumePrecision(pricePrecision, volumePrecision)","titles":["实例API"]},"130":{"title":"setTimezone(timezone)","titles":["实例API"]},"131":{"title":"getTimezone()","titles":["实例API"]},"132":{"title":"setZoomEnabled(enabled)","titles":["实例API"]},"133":{"title":"isZoomEnabled()","titles":["实例API"]},"134":{"title":"setScrollEnabled(enabled)","titles":["实例API"]},"135":{"title":"isScrollEnabled()","titles":["实例API"]},"136":{"title":"setOffsetRightDistance(distance)","titles":["实例API"]},"137":{"title":"getOffsetRightDistance() ^9.2.0","titles":["实例API"]},"138":{"title":"setMaxOffsetLeftDistance() ^9.7.0","titles":["实例API"]},"139":{"title":"setMaxOffsetRightDistance() ^9.7.0","titles":["实例API"]},"140":{"title":"setLeftMinVisibleBarCount(barCount)","titles":["实例API"]},"141":{"title":"setRightMinVisibleBarCount(barCount)","titles":["实例API"]},"142":{"title":"setBarSpace(space)","titles":["实例API"]},"143":{"title":"getBarSpace()","titles":["实例API"]},"144":{"title":"getVisibleRange()","titles":["实例API"]},"145":{"title":"applyNewData(dataList, more, callback)","titles":["实例API"]},"146":{"title":"applyMoreData(dataList, more, callback)","titles":["实例API"]},"147":{"title":"updateData(data, callback)","titles":["实例API"]},"148":{"title":"getDataList()","titles":["实例API"]},"149":{"title":"clearData()","titles":["实例API"]},"150":{"title":"loadMore(cb)","titles":["实例API"]},"151":{"title":"setLoadDataCallback(cb) ^9.8.0","titles":["实例API"]},"152":{"title":"createIndicator(value, isStack, paneOptions, callback)","titles":["实例API"]},"153":{"title":"overrideIndicator(override, paneId, callback)","titles":["实例API"]},"154":{"title":"getIndicatorByPaneId(paneId, name)","titles":["实例API"]},"155":{"title":"removeIndicator(paneId, name)","titles":["实例API"]},"156":{"title":"createOverlay(value, paneId)","titles":["实例API"]},"157":{"title":"getOverlayById(id)","titles":["实例API"]},"158":{"title":"overrideOverlay(override)","titles":["实例API"]},"159":{"title":"removeOverlay(remove)","titles":["实例API"]},"160":{"title":"scrollByDistance(distance, animationDuration)","titles":["实例API"]},"161":{"title":"scrollToRealTime(animationDuration)","titles":["实例API"]},"162":{"title":"scrollToDataIndex(dataIndex, animationDuration)","titles":["实例API"]},"163":{"title":"scrollToTimestamp(timestamp, animationDuration)","titles":["实例API"]},"164":{"title":"zoomAtCoordinate(scale, coordinate, animationDuration)","titles":["实例API"]},"165":{"title":"zoomAtDataIndex(scale, dataIndex, animationDuration)","titles":["实例API"]},"166":{"title":"zoomAtTimestamp(scale, timestamp, animationDuration)","titles":["实例API"]},"167":{"title":"setPaneOptions(options)","titles":["实例API"]},"168":{"title":"executeAction(type, data) ^9.2.0","titles":["实例API"]},"169":{"title":"subscribeAction(type, callback)","titles":["实例API"]},"170":{"title":"unsubscribeAction(type, callback)","titles":["实例API"]},"171":{"title":"convertToPixel(value, finder)","titles":["实例API"]},"172":{"title":"convertFromPixel(coordinate, finder)","titles":["实例API"]},"173":{"title":"getConvertPictureUrl(includeOverlay, type, backgroundColor)","titles":["实例API"]},"174":{"title":"resize()","titles":["实例API"]},"175":{"title":"覆盖物","titles":[]},"176":{"title":"内置覆盖物类型","titles":["覆盖物"]},"177":{"title":"自定义覆盖物","titles":["覆盖物"]},"178":{"title":"属性说明","titles":["覆盖物","自定义覆盖物"]},"179":{"title":"示例","titles":["覆盖物","自定义覆盖物"]},"180":{"title":"🚀 快速上手","titles":[]},"181":{"title":"获取KLineChart","titles":["🚀 快速上手"]},"182":{"title":"创建第一个图表","titles":["🚀 快速上手"]},"183":{"title":"🎨 样式配置","titles":[]},"184":{"title":"图解说明","titles":["🎨 样式配置"]},"185":{"title":"默认完整配置","titles":["🎨 样式配置"]},"186":{"title":"🛠️ 从 V8 到 V9","titles":[]},"187":{"title":"引入调整","titles":["🛠️ 从 V8 到 V9"]},"188":{"title":"设计调整","titles":["🛠️ 从 V8 到 V9"]},"189":{"title":"样式配置调整","titles":["🛠️ 从 V8 到 V9"]},"190":{"title":"API调整","titles":["🛠️ 从 V8 到 V9"]},"191":{"title":"图表API","titles":["🛠️ 从 V8 到 V9","API调整"]},"192":{"title":"实例API","titles":["🛠️ 从 V8 到 V9","API调整"]},"193":{"title":"图形辅助API","titles":["🛠️ 从 V8 到 V9","API调整"]},"194":{"title":"自定义技术指标调整","titles":["🛠️ 从 V8 到 V9"]},"195":{"title":"🙋 常见问题","titles":[]},"196":{"title":"初始化图表后,只能看到一条线,是怎么回事?","titles":["🙋 常见问题"]},"197":{"title":"蜡烛柱显示趋近于一条线,看不到波动,怎么办?","titles":["🙋 常见问题"]},"198":{"title":"分时图怎么创建?","titles":["🙋 常见问题"]},"199":{"title":"内置的技术指标,计算出来的数据不是想要的,怎么办?","titles":["🙋 常见问题"]},"200":{"title":"想创建一个内置技术指标之外的指标,怎么办?","titles":["🙋 常见问题"]},"201":{"title":"想标记一下买卖点,该怎么做?","titles":["🙋 常见问题"]},"202":{"title":"💬 反馈和共建","titles":[]},"203":{"title":"Github","titles":["💬 反馈和共建"]},"204":{"title":"Telegram","titles":["💬 反馈和共建"]},"205":{"title":"微信讨论群","titles":["💬 反馈和共建"]},"206":{"title":"本地开发","titles":[]},"207":{"title":"摘要","titles":["本地开发"]},"208":{"title":"须知","titles":["本地开发"]},"209":{"title":"文件目录说明","titles":["本地开发","须知"]},"210":{"title":"模块依赖关系","titles":["本地开发","须知"]},"211":{"title":"开发","titles":["本地开发"]},"212":{"title":"安装依赖","titles":["本地开发","开发"]},"213":{"title":"NPM 执行命令说明","titles":["本地开发","开发"]},"214":{"title":"调试","titles":["本地开发","开发"]},"215":{"title":"坐标轴","titles":[]},"216":{"title":"基础展示","titles":[]},"217":{"title":"蜡烛类型","titles":[]},"218":{"title":"数据加载","titles":[]},"219":{"title":"多语言","titles":[]},"220":{"title":"技术指标","titles":[]},"221":{"title":"覆盖物","titles":[]},"222":{"title":"主题","titles":[]},"223":{"title":"时区","titles":[]},"224":{"title":"提示条","titles":[]},"225":{"title":"❤️ 赞助","titles":[]},"226":{"title":"赞助渠道","titles":["❤️ 赞助"]},"227":{"title":"支付宝","titles":["❤️ 赞助","赞助渠道"]},"228":{"title":"微信支付","titles":["❤️ 赞助","赞助渠道"]},"229":{"title":"加密资产","titles":["❤️ 赞助","赞助渠道"]}},"dirtCount":0,"index":[["微信支付",{"0":{"228":1}}],["微信讨论群",{"0":{"205":1}}],["支付宝",{"0":{"227":1}}],["支持字符串模版",{"2":{"185":1}}],["支持多种下载方式",{"2":{"181":1}}],["支持合并",{"2":{"127":1}}],["支持root",{"2":{"125":1,"126":1}}],["支持移动端",{"2":{"123":1}}],["支持嵌套",{"2":{"69":1}}],["支持事件选择",{"2":{"26":1}}],["支持千分符显示",{"2":{"24":1}}],["支持数组",{"2":{"20":1}}],["支持增量",{"2":{"17":1,"44":1,"49":1,"117":1}}],["支持向前和向后添加数据",{"2":{"10":1}}],["支持长小数折叠",{"2":{"10":1}}],["支持指标绘制到未来时间",{"2":{"10":1}}],["支持自定义坐标轴",{"2":{"10":1}}],["发送邮件到",{"2":{"225":1}}],["首页",{"2":{"225":1}}],["首先确定计算参数",{"2":{"119":1}}],["那就真的太感谢了",{"2":{"225":1}}],["☕️",{"2":{"225":1}}],["希望你能在",{"2":{"225":1}}],["希望提示的和参数一样",{"2":{"120":1}}],["许可的开源项目",{"2":{"225":1}}],["赞助渠道",{"0":{"226":1},"1":{"227":1,"228":1,"229":1}}],["赞助额前三名",{"2":{"225":1}}],["赞助",{"0":{"225":1},"1":{"226":1,"227":1,"228":1,"229":1}}],["❤️",{"0":{"225":1},"1":{"226":1,"227":1,"228":1,"229":1}}],["跟随十字光标",{"2":{"224":1}}],["芝加哥",{"2":{"223":1}}],["柏林",{"2":{"223":1}}],["红涨绿跌",{"2":{"222":1}}],["绿涨红跌",{"2":{"222":1}}],["深色",{"2":{"222":1}}],["深度复制",{"2":{"61":1}}],["浅色",{"2":{"222":1}}],["主页链接等信息",{"2":{"225":1}}],["主题",{"0":{"222":1}}],["主图指标",{"2":{"220":1}}],["主图的窗口id",{"2":{"152":1,"153":1,"154":1,"155":1,"156":1,"167":1}}],["价格线",{"2":{"221":1}}],["价格精度",{"2":{"129":1,"178":1}}],["副图指标",{"2":{"220":1}}],["🥑",{"2":{"220":1}}],["🥭",{"2":{"220":1}}],["🥝",{"2":{"220":1}}],["🥥",{"2":{"220":1}}],["繁体中文",{"2":{"219":1}}],["多语言",{"0":{"219":1}}],["多边形",{"2":{"210":1}}],["多边形参数",{"2":{"88":1}}],["跌空心",{"2":{"217":1}}],["涨空心",{"2":{"217":1}}],["全空心",{"2":{"217":1}}],["全实心",{"2":{"217":1}}],["全局添加",{"2":{"177":1}}],["反向",{"2":{"215":1}}],["反馈和共建",{"0":{"202":1},"1":{"203":1,"204":1,"205":1}}],["正向",{"2":{"215":1}}],["百分比轴",{"2":{"215":1}}],["内部",{"2":{"215":1}}],["内置",{"2":{"221":1}}],["内置的覆盖物有一个simpleannotation",{"2":{"201":1}}],["内置的技术指标",{"0":{"199":1}}],["内置的右击删除将无效",{"2":{"178":1}}],["内置覆盖物类型",{"0":{"176":1}}],["内置多种指标和画线模型",{"2":{"123":1}}],["内置一些转换方法",{"2":{"117":4,"178":2}}],["内置技术指标",{"0":{"115":1}}],["内置基础图形",{"0":{"98":1},"1":{"99":1,"100":1,"101":1,"102":1,"103":1,"104":1,"105":1}}],["内置支持zh",{"2":{"44":1}}],["外部",{"2":{"215":1}}],["以下仅仅是为了协助代码演示",{"2":{"215":1,"217":1,"219":1,"220":1,"221":1,"222":1,"223":1,"224":1}}],["以一个填充带边框的圆来具体说明如何配置",{"2":{"179":1}}],["以一个名为",{"2":{"118":1}}],["以一个可以有边框和背景菱形来具体说明自定义",{"2":{"108":1}}],["入口文件的方式进行调试",{"2":{"214":1}}],["入参说明",{"0":{"37":1}}],["入参是空数组时不刷新问题",{"2":{"25":1}}],["引入",{"2":{"214":1}}],["引入调整",{"0":{"187":1}}],["依赖文件",{"2":{"213":2}}],["生成",{"2":{"213":1}}],["生产环境模块",{"2":{"213":1}}],["打包成",{"2":{"213":4}}],["检验代码规则",{"2":{"213":1}}],["检查一下容器是否有高度",{"2":{"196":1}}],["检查某个坐标点是否在文字上",{"2":{"84":1}}],["检查某个坐标点是否在矩形上",{"2":{"83":1}}],["检查某个坐标点是否在多边形上",{"2":{"82":1}}],["检查某个坐标点是否在线上",{"2":{"81":1}}],["检查某个坐标点是否在圆上",{"2":{"80":1}}],["检查某个坐标点是否在圆弧上",{"2":{"79":1}}],["检查某个值是否有效",{"2":{"65":1}}],["检查某个值是否是bool值",{"2":{"68":1}}],["检查某个值是否是方法",{"2":{"67":1}}],["检查某个值是否是对象",{"2":{"66":1}}],["检查某个值是否是数字",{"2":{"64":1}}],["检查某个值是否是字符串",{"2":{"63":1}}],["检查事件是否在图形上",{"2":{"50":1}}],["运行",{"2":{"213":10}}],["项目根目录下执行",{"2":{"212":1}}],["项目采用依赖",{"2":{"212":1}}],["环境",{"2":{"212":1}}],["环境要求",{"0":{"92":1},"1":{"93":1,"94":1}}],["安装依赖",{"0":{"212":1}}],["还进行事件分发",{"2":{"210":1}}],["形成最终的图表",{"2":{"210":1}}],["进行项目创建",{"2":{"214":1}}],["进行清理打包好的文件",{"2":{"213":1}}],["进行组装到一起",{"2":{"210":1}}],["进行单一业务绘制",{"2":{"210":1}}],["进行更改",{"2":{"183":1}}],["矩形框",{"2":{"224":1}}],["矩形",{"2":{"210":1}}],["矩形参数",{"2":{"83":1,"89":1}}],["模块",{"2":{"213":6}}],["模块依赖关系",{"0":{"210":1}}],["模式灵敏度",{"2":{"55":1,"158":1,"178":1}}],["模式",{"2":{"55":1,"158":1,"178":2}}],["文本",{"2":{"210":1}}],["文件目录说明",{"0":{"209":1}}],["文字内容",{"2":{"84":1,"90":1,"104":1}}],["文字参数",{"2":{"84":1,"90":1}}],["须知",{"0":{"208":1},"1":{"209":1,"210":1}}],["编写的此文档",{"2":{"207":1}}],["编组id",{"2":{"158":1,"159":1}}],["感谢",{"2":{"207":1}}],["核心感兴趣",{"2":{"207":1}}],["你可以使用",{"2":{"212":1,"214":1}}],["你可以通过",{"2":{"181":1}}],["你可能会对改进",{"2":{"207":1}}],["摘要",{"0":{"207":1}}],["本地开发",{"0":{"206":1},"1":{"207":1,"208":1,"209":1,"210":1,"211":1,"212":1,"213":1,"214":1}}],["本文档将帮助你从",{"2":{"186":1}}],["本文档介绍了图表内置的覆盖物和如何自定义一个覆盖物",{"2":{"175":1}}],["本文档介绍了图表内置的技术指标和如何自定义一个技术指标",{"2":{"114":1}}],["加密资产",{"0":{"229":1}}],["加入群聊",{"2":{"205":1}}],["加载边界的数据",{"2":{"151":1}}],["加载",{"2":{"93":1}}],["备注",{"2":{"205":1}}],["扫一扫",{"2":{"205":1}}],["该怎么做",{"0":{"201":1}}],["该方法自版本9",{"2":{"146":1,"150":1}}],["想标记一下买卖点",{"0":{"201":1}}],["想创建一个内置技术指标之外的指标",{"0":{"200":1}}],["想显示时间",{"2":{"185":1}}],["通过样式设置",{"2":{"198":1}}],["通过图表实例",{"2":{"42":1}}],["分时图怎么创建",{"0":{"198":1}}],["分割线事件响应回退",{"2":{"18":1}}],["怎么办",{"0":{"197":1,"199":1,"200":1}}],["看不到波动",{"0":{"197":1}}],["初始化图表后",{"0":{"196":1}}],["初始化一个图表",{"2":{"44":1}}],["常见问题",{"0":{"195":1},"1":{"196":1,"197":1,"198":1,"199":1,"200":1,"201":1}}],["子项方法color",{"2":{"194":1}}],["合并成一个方法getsize",{"2":{"192":1}}],["合并为candle",{"2":{"189":1}}],["更改为dashed",{"2":{"189":1}}],["更新数据",{"2":{"147":1}}],["更新日志",{"0":{"0":1},"1":{"1":1,"2":1,"3":1,"4":1,"5":1,"6":1,"7":1,"8":1,"9":1,"10":1,"11":1,"12":1,"13":1,"14":1,"15":1,"16":1,"17":1,"18":1,"19":1,"20":1,"21":1,"22":1,"23":1,"24":1,"25":1,"26":1,"27":1,"28":1,"29":1,"30":1,"31":1,"32":1,"33":1,"34":1,"35":1}}],["设计调整",{"0":{"188":1}}],["设置下精度",{"2":{"197":1}}],["设置窗口配置",{"2":{"167":1}}],["设置自动加载数据回调方法",{"2":{"151":1}}],["设置加载更多回调函数",{"2":{"150":1}}],["设置右边最小可见的蜡烛数量",{"2":{"141":1}}],["设置左边最小可见的蜡烛数量",{"2":{"140":1}}],["设置图表单根蜡烛柱的宽度",{"2":{"142":1}}],["设置图表右边最大可空出来的间隙",{"2":{"139":1}}],["设置图表右边可以空出来的间隙",{"2":{"136":1}}],["设置图表左边最大可空出来的间隙",{"2":{"138":1}}],["设置是否可以拖拽滚动",{"2":{"134":1}}],["设置是否缩放",{"2":{"132":1}}],["设置时区",{"2":{"130":1}}],["设置价格和数量精度",{"2":{"129":1}}],["设置样式配置",{"2":{"127":1}}],["到",{"0":{"186":1},"1":{"187":1,"188":1,"189":1,"190":1,"191":1,"192":1,"193":1,"194":1}}],["配置",{"2":{"185":1}}],["提示条",{"0":{"224":1}}],["提示",{"2":{"185":2}}],["提供完整的类型定义文件",{"2":{"123":1}}],["面积图",{"2":{"185":1,"210":1,"217":1}}],["蜡烛类型",{"0":{"217":1}}],["蜡烛图类型",{"2":{"185":1}}],["蜡烛图",{"2":{"185":1}}],["蜡烛柱显示趋近于一条线",{"0":{"197":1}}],["蜡烛柱",{"2":{"185":1}}],["蜡烛柱不包含蜡烛柱之间间隙的尺寸",{"2":{"117":1,"178":1}}],["蜡烛柱尺寸",{"2":{"117":1,"178":1}}],["蜡烛柱的尺寸信息",{"2":{"117":1,"178":1}}],["蜡烛柱默认宽度改为8",{"2":{"7":1}}],["网格线",{"2":{"185":1,"210":1}}],["网站",{"2":{"181":1}}],["quick",{"2":{"182":2}}],["销毁图表",{"2":{"182":1}}],["销毁一个图表",{"2":{"45":1}}],["享受整个生态圈和工具链带来的诸多好处",{"2":{"181":1}}],["推荐使用包管理工具的方式进行开发",{"2":{"181":1}}],["所以需要",{"2":{"212":1}}],["所以你可以在任何一个前端框架中使用",{"2":{"182":1}}],["所以也可以从",{"2":{"181":1}}],["所有的api都迁移至klinecharts",{"2":{"193":1}}],["所有线的样式选项dash",{"2":{"189":1}}],["所有dashvalue变更为dashedvalue",{"2":{"30":1}}],["所有line",{"2":{"30":1}}],["所有visiblerange新增realfrom和realto",{"2":{"24":1}}],["版本升级到",{"2":{"186":1}}],["版本",{"2":{"181":1,"186":1}}],["另外",{"2":{"181":1}}],["另一个计算10个周期时间的均值",{"2":{"119":1}}],["包管理工具下载",{"2":{"181":1}}],["或",{"2":{"181":2}}],["或者直接引入",{"2":{"214":1}}],["或者更老的版本",{"2":{"186":1}}],["或者图表实例方法setstyles",{"2":{"183":1}}],["或者",{"2":{"129":1,"185":2,"212":1}}],["或者setlocale",{"2":{"113":1}}],["或者使用实例方法",{"2":{"38":1}}],["快速上手",{"0":{"180":1},"1":{"181":1,"182":1}}],["快捷键",{"0":{"95":1}}],["其它选择使用默认样式",{"2":{"179":1}}],["选择边框且填充",{"2":{"179":1}}],["选中回调事件",{"2":{"178":1}}],["选中事件",{"2":{"55":1,"158":1}}],["确定对应点生成的圆的坐标",{"2":{"179":1}}],["确定其它属性",{"2":{"120":1}}],["完成一个圆的绘制需要三个步骤",{"2":{"179":1}}],["完成语言切换",{"2":{"113":1}}],["双击回调事件",{"2":{"178":1}}],["双击事件",{"2":{"55":1,"158":1}}],["处理按住移动操作",{"2":{"178":1}}],["处理在绘制过程中移动操作",{"2":{"178":1}}],["事件所在点的信息",{"2":{"178":1}}],["事件所在点的索引",{"2":{"178":1}}],["事件的坐标",{"2":{"107":1}}],["非必须",{"2":{"178":12}}],["非必须字段",{"2":{"42":2}}],["作为覆盖物创建的唯一标识",{"2":{"178":1}}],["必须字段",{"2":{"178":1}}],["必要字段",{"2":{"42":5,"107":1}}],["名称",{"2":{"178":1,"179":1}}],["名字",{"2":{"50":1,"117":1}}],["频繁调用可能会影响到性能",{"2":{"174":1}}],["总是显示",{"2":{"224":1}}],["总是会填充容器大小",{"2":{"174":1}}],["总共需要多少步操作才行绘制完成",{"2":{"178":1}}],["总的实现步骤",{"2":{"55":1}}],["调试",{"0":{"214":1}}],["调用setpricevolumeprecision",{"2":{"197":1}}],["调用请谨慎",{"2":{"174":1}}],["调用createoverlay方法是返回的标识",{"2":{"157":1,"159":1}}],["调整图表大小",{"2":{"174":1}}],["三种中的一种",{"2":{"173":1}}],["转换后的图片类型",{"2":{"173":1}}],["只能看到一条线",{"0":{"196":1}}],["只作用于y轴",{"2":{"171":1,"172":1}}],["只需要生成一个技术指标信息",{"2":{"116":1}}],["只需要生成基础图形信息",{"2":{"106":1}}],["过滤条件",{"2":{"171":1,"172":1}}],["对于赞助",{"2":{"225":1}}],["对数轴",{"2":{"215":1}}],["对chartstore里面的数据进行操作",{"2":{"210":1}}],["对pane进行管理",{"2":{"210":1}}],["对象类型为",{"2":{"185":1}}],["对应y轴的值",{"2":{"171":1,"178":3}}],["对齐方式",{"2":{"104":1}}],["订阅时的回调方法",{"2":{"170":1}}],["订阅图表动作",{"2":{"169":1}}],["执行命令说明",{"0":{"213":1}}],["执行动作需要的数据",{"2":{"168":1}}],["执行图表动作",{"2":{"168":1}}],["轴名字",{"2":{"167":1}}],["轴上是否可以滚动缩放",{"2":{"152":1,"167":1}}],["在实际项目中根据情况进行调整",{"2":{"215":1,"217":1,"219":1,"220":1,"221":1,"222":1,"223":1,"224":1}}],["在指定时间戳上缩放",{"2":{"166":1}}],["在某个位置缩放",{"2":{"165":1}}],["在某个坐标点缩放",{"2":{"164":1}}],["动画时间",{"2":{"160":1,"161":1,"162":1,"163":1,"164":1,"165":1,"166":1}}],["移除图形",{"2":{"159":1}}],["移除技术指标",{"2":{"155":1}}],["移动绘制过程中触发",{"2":{"178":1}}],["移动端",{"2":{"123":1}}],["移动事件过程中特殊处理方法",{"2":{"55":1}}],["\\tbars",{"2":{"153":1}}],["覆盖已绘制的覆盖物",{"2":{"158":1}}],["覆盖技术指标信息",{"2":{"153":1}}],["覆盖物实例",{"2":{"178":1}}],["覆盖物",{"0":{"175":1,"221":1},"1":{"176":1,"177":1,"178":1,"179":1},"2":{"185":1}}],["覆盖物标识",{"2":{"158":1}}],["覆盖物名称",{"2":{"159":1}}],["覆盖物名或者对象",{"2":{"156":1}}],["覆盖物名",{"2":{"55":1,"158":1}}],["覆盖物信息",{"2":{"55":1}}],["覆盖物支持双击强制结束绘制",{"2":{"28":1}}],["特殊的id",{"2":{"152":1,"153":1,"154":1,"155":1,"156":1,"167":1}}],["特性",{"0":{"123":1}}],["此项目没有调试项目",{"2":{"214":1}}],["此外",{"2":{"210":1}}],["此方法会重新计算整个图表各个模块的大小",{"2":{"174":1}}],["此方法会清空图表数据",{"2":{"145":1}}],["此参数对应图表实例方法",{"2":{"152":1}}],["边距",{"2":{"152":1,"167":1}}],["边框虚线参数",{"2":{"100":1,"102":1,"103":1,"104":1}}],["边框虚线参数值",{"2":{"86":1,"88":1,"89":1,"90":1}}],["边框尺寸",{"2":{"100":1,"102":1,"103":1,"104":1}}],["边框圆角尺寸",{"2":{"90":1}}],["边框圆角值",{"2":{"89":1,"103":1,"104":1}}],["边框样式",{"2":{"86":1,"88":1,"89":1,"90":1,"100":1,"102":1,"103":1,"104":1}}],["边框粗细",{"2":{"86":1,"88":1,"89":1,"90":1}}],["边框颜色",{"2":{"86":1,"88":1,"89":1,"90":1,"100":1,"102":1,"103":1,"104":1}}],["都需要此标识",{"2":{"152":1}}],["后续对该窗口的一些操作",{"2":{"152":1}}],["后续计算参数发生变化的时候",{"2":{"120":1}}],["类型有",{"2":{"185":2}}],["类型为klinecharts",{"2":{"178":1}}],["类型参与",{"2":{"178":2}}],["类型参阅",{"2":{"117":6}}],["类型参阅样式",{"2":{"49":1}}],["类型是",{"2":{"173":1}}],["类型和图表方法overrideindicator的入参一致",{"2":{"152":1}}],["类型",{"2":{"151":1}}],["回调参数和`performeventmovefordrawing`一致",{"2":{"178":1}}],["回调参数",{"2":{"151":1}}],["回调方法",{"2":{"151":2}}],["回调方法新增参数",{"2":{"1":1}}],["为了避免重复绘制",{"2":{"149":1}}],["清空图表数据",{"2":{"149":1}}],["单条k线数据",{"2":{"147":1}}],["相同则覆盖",{"2":{"147":1}}],["请提供付款账号或地址",{"2":{"225":1}}],["请通过getdom",{"2":{"192":1}}],["请统一使用import",{"2":{"187":1}}],["请先参考之前的升级文档升级到",{"2":{"186":1}}],["请使用",{"2":{"145":1,"147":1,"150":1}}],["请用overrideoverlay",{"2":{"192":1}}],["请用overlay代替",{"2":{"189":1}}],["请用removeoverlay",{"2":{"192":1}}],["请用registeroverlay",{"2":{"191":1}}],["请用createoverlay",{"2":{"192":1}}],["请用text代替",{"2":{"105":1}}],["请用",{"2":{"93":1}}],["请用utils",{"2":{"91":1}}],["自版本9",{"2":{"145":1,"147":1}}],["自定义",{"2":{"221":1}}],["自定义显示",{"2":{"185":1}}],["自定义一个覆盖物",{"2":{"177":1}}],["自定义一些api",{"2":{"44":1}}],["自定义覆盖物",{"0":{"177":1},"1":{"178":1,"179":1}}],["自定义绘制",{"2":{"117":1}}],["自定义绘制方法",{"2":{"53":1,"153":1}}],["自定义技术指标调整",{"0":{"194":1}}],["自定义技术指标",{"0":{"116":1},"1":{"117":1,"118":1,"119":1,"120":1}}],["自定义基础图形",{"0":{"106":1},"1":{"107":1,"108":1,"109":1,"110":1}}],["自定义布局",{"2":{"44":1}}],["自定义坐标轴",{"0":{"36":1},"1":{"37":1,"38":1,"39":1,"40":1,"41":1}}],["自定义扩展",{"2":{"30":2}}],["成功回调",{"2":{"145":1,"146":1,"147":1,"153":1}}],["成交額",{"2":{"112":1}}],["成交额",{"2":{"42":1}}],["成交量",{"2":{"42":1,"112":1,"219":1}}],["告诉图表还有没有更多历史数据",{"2":{"145":1,"146":1}}],["不显示",{"2":{"224":1}}],["不再区分klinecharts",{"2":{"187":1}}],["不受前端框架限制",{"2":{"182":1}}],["不仅可在开发环境轻松调试",{"2":{"181":1}}],["不触发事件",{"2":{"178":1}}],["不同则追加",{"2":{"147":1}}],["不需要额外调用cleardata方法",{"2":{"145":1}}],["不生效问题",{"2":{"11":1}}],["数组的子项类型为",{"2":{"185":1}}],["数量精度",{"2":{"129":1,"178":1}}],["数据加载",{"0":{"218":1}}],["数据的索引",{"2":{"162":1,"165":1}}],["数据类型详情可参阅数据源",{"2":{"145":1,"146":1,"147":1}}],["数据索引",{"2":{"117":1,"171":1,"178":3}}],["数据源",{"2":{"117":8}}],["数据信息",{"2":{"117":1}}],["数据",{"0":{"42":1}}],["也可放心地在生产环境打包部署使用",{"2":{"181":1}}],["也可以是数组",{"2":{"171":1,"172":1}}],["也可以是id组成的数组",{"2":{"159":1}}],["也可以是object",{"2":{"44":1}}],["也提供了",{"2":{"181":1}}],["也会受影响",{"2":{"129":1}}],["详情请查阅覆盖物",{"2":{"188":1}}],["详情可参阅样式",{"2":{"127":1}}],["详情参阅技术指标",{"2":{"200":1}}],["详情参阅",{"2":{"178":1}}],["详情参阅覆盖物",{"2":{"55":1}}],["详情参阅基础图形",{"2":{"50":1}}],["详情参阅样式",{"2":{"44":1}}],["位置",{"2":{"126":1,"152":1}}],["缺省则取消当前类型所有",{"2":{"170":1}}],["缺省则在图表中间位置缩放",{"2":{"164":1}}],["缺省则无动画",{"2":{"160":1,"161":1,"162":1,"163":1,"164":1,"165":1,"166":1}}],["缺省则删除对应窗口上所有的",{"2":{"159":1}}],["缺省则删除所有",{"2":{"159":1}}],["缺省则返回所有",{"2":{"154":1}}],["缺省则设置所有",{"2":{"153":1}}],["缺省则是root",{"2":{"125":1,"126":1}}],["缺省则是整个图表容器",{"2":{"125":1,"126":1}}],["缺省将显示name",{"2":{"117":1}}],["窗口是否可以拖拽调整高度",{"2":{"152":1,"167":1}}],["窗口最小高度",{"2":{"152":1,"167":1}}],["窗口高度",{"2":{"152":1,"167":1}}],["窗口配置信息",{"2":{"152":1,"167":1}}],["窗口id",{"2":{"125":1,"126":1,"152":1,"153":1,"154":1,"155":1,"156":1,"159":1,"167":1,"171":1,"172":1}}],["窗口尺寸信息",{"2":{"37":1,"117":2,"178":1}}],["搞定多端",{"2":{"123":1}}],["功能扩展随心所欲",{"2":{"123":1}}],["功能强大",{"2":{"123":1}}],["丰富的样式配置和api",{"2":{"123":1}}],["零依赖",{"2":{"123":1}}],["轻量流畅",{"2":{"123":1}}],["简体中文",{"2":{"219":1}}],["简单快速集成",{"2":{"123":1}}],["简短名字",{"2":{"53":1,"153":1}}],["什么是",{"0":{"122":1}}],["介绍",{"0":{"121":1},"1":{"122":1,"123":1}}],["介绍如何去做自定义技术指标",{"2":{"118":1}}],["每个key需要和figures中的子项key对应的值一致",{"2":{"120":1}}],["j++",{"2":{"215":1,"216":1,"217":1,"218":1,"219":1,"220":1,"221":1,"222":1,"223":1,"224":1}}],["jsimport",{"2":{"215":1,"216":1,"217":1,"218":1,"219":1,"220":1,"221":1,"222":1,"223":1,"224":1}}],["jsximport",{"2":{"182":1}}],["js",{"2":{"181":1,"182":2,"212":2}}],["jsdelivr",{"2":{"181":1,"182":1}}],["jpeg",{"2":{"173":2}}],["j",{"2":{"120":6,"215":2,"216":2,"217":2,"218":2,"219":2,"220":2,"221":2,"222":2,"223":2,"224":2}}],["javascripthtml",{"2":{"216":1,"218":1}}],["javascripthtmlcss",{"2":{"215":1,"217":1,"219":1,"220":1,"221":1,"222":1,"223":1,"224":1}}],["javascriptchart",{"2":{"152":1,"153":1,"156":1,"158":1,"167":1,"198":1}}],["javascript",{"2":{"97":1,"110":1,"119":1,"120":1,"178":1,"179":1,"182":1,"185":1}}],["用图表api创建即可createoverlay",{"2":{"201":1}}],["用",{"2":{"120":1,"214":1}}],["用于回传数据给图表",{"2":{"151":1}}],["用于生成样式",{"2":{"117":1}}],["用于生成自定义图形的属性",{"2":{"117":1}}],["用于tooltip显示",{"2":{"117":1}}],["用于取计算结果中值",{"2":{"117":1}}],["用于创建的唯一标识",{"2":{"55":1,"158":1}}],["用于创建和操作的唯一标识",{"2":{"53":1,"153":1}}],["用于显示",{"2":{"53":1,"117":1,"153":1}}],["第二条线",{"2":{"119":1}}],["第一条线",{"2":{"119":1}}],["因此figures配置为",{"2":{"119":1}}],["则依据索引转换",{"2":{"171":1}}],["则会以id为依据去覆盖",{"2":{"158":1}}],["则会移除所有",{"2":{"155":1}}],["则figures配置的图形不会绘制",{"2":{"117":1}}],["则不会显示",{"2":{"117":1}}],["则需要为该字段填充数据",{"2":{"42":1}}],["十字光标线",{"2":{"210":1}}],["十字光标垂直线及文字",{"2":{"185":1}}],["十字光标水平线及文字",{"2":{"185":1}}],["十字光标",{"2":{"185":1}}],["十字光标交叉点所在的窗口id",{"2":{"117":1}}],["十字光标的信息",{"2":{"117":1}}],["会在计算参数发生变化后触发",{"2":{"117":1}}],["参阅",{"2":{"117":3}}],["参数finder",{"2":{"192":1}}],["参数type选项变更为onzoom",{"2":{"192":1}}],["参数position选项变更为root",{"2":{"192":1}}],["参数paneoptions新增position",{"2":{"14":1}}],["参数和返回值和`createpointfigures`一致",{"2":{"178":2}}],["参数和overrideoverlay一致",{"2":{"156":1}}],["参数options新增layout",{"2":{"14":1}}],["参数",{"2":{"5":1,"38":2,"145":1,"147":1}}],["技术图表实例",{"2":{"117":1}}],["技术指标名",{"2":{"154":1,"155":1}}],["技术指标名或者技术指标对象",{"2":{"152":1}}],["技术指标需要展示两个周期的收盘价平均值连起来的线",{"2":{"119":1}}],["技术指标实例",{"2":{"117":3}}],["技术指标数据",{"2":{"117":1}}],["技术指标",{"0":{"114":1,"220":1},"1":{"115":1,"116":1,"117":1,"118":1,"119":1,"120":1},"2":{"118":1,"185":1}}],["技术指标信息",{"2":{"53":1}}],["技术指标删除属性shouldcheckparamcount",{"2":{"30":1}}],["技术指标模版不再保存相关属性",{"2":{"30":1}}],["技术指标属性render变更为draw",{"2":{"30":1}}],["技术指标属性regenerateplots变更为regeneratefigures",{"2":{"30":1}}],["技术指标属性calctechnicalindicator变更为calc",{"2":{"30":1}}],["技术指标属性calcparams",{"2":{"30":1}}],["技术指标属性plots变更为figures",{"2":{"30":1}}],["下边距",{"2":{"152":1,"167":1}}],["下一个图形的数据",{"2":{"117":1}}],["下内边距",{"2":{"90":1,"104":1}}],["上海",{"2":{"223":1}}],["上图是按照下层作为上层的容器",{"2":{"210":1}}],["上边距",{"2":{"152":1,"167":1}}],["上一个图形的数据",{"2":{"117":1}}],["上内边距",{"2":{"90":1,"104":1}}],["一般情况下不用手动调用",{"2":{"149":1}}],["一般用于type是",{"2":{"117":1}}],["一个图表",{"2":{"123":1}}],["一个计算5个周期时间的均值",{"2":{"119":1}}],["一条名为",{"2":{"119":1}}],["一条为",{"2":{"119":1}}],["一旦销毁",{"2":{"45":1}}],["将使用超大logo展示",{"2":{"225":1}}],["将widget组装到一起",{"2":{"210":1}}],["将相关的",{"2":{"210":1}}],["将坐标转换成值",{"2":{"172":1}}],["将值转换成坐标",{"2":{"171":1}}],["将以这个值上下去绘制",{"2":{"117":1}}],["将一个对象合并到另一个对象",{"2":{"62":1}}],["系列",{"2":{"117":1}}],["层级",{"2":{"117":1,"153":1}}],["比如100000是否需要格式化100k",{"2":{"117":1}}],["从上到下列出图表模块层级",{"2":{"210":1}}],["从",{"0":{"186":1},"1":{"187":1,"188":1,"189":1,"190":1,"191":1,"192":1,"193":1,"194":1},"2":{"210":1}}],["从1000开始格式化",{"2":{"117":1}}],["从某个值取对应的值",{"2":{"69":1}}],["无论数额多少",{"2":{"225":1}}],["无特殊含义",{"2":{"178":1}}],["无",{"2":{"115":2}}],["无法生效问题",{"2":{"5":1}}],["漲幅",{"2":{"112":1}}],["收",{"2":{"112":1,"219":1}}],["收盘价",{"2":{"42":1}}],["低",{"2":{"112":1,"219":1}}],["開",{"2":{"112":1,"219":1}}],["時間",{"2":{"112":1,"219":1}}],["例如删除和添加操作",{"2":{"210":1}}],["例如",{"2":{"112":1,"185":1}}],["去完成",{"2":{"112":1}}],["去github上查看",{"2":{"31":1,"32":1,"33":1,"34":1,"35":1}}],["增加语言包通过klinecharts",{"2":{"112":1}}],["增加语言包",{"0":{"112":1}}],["默认",{"2":{"224":1}}],["默认完整配置",{"0":{"185":1}}],["默认样式",{"2":{"178":1}}],["默认null",{"2":{"117":2}}],["默认的技术指标样式",{"2":{"117":3}}],["默认为true",{"2":{"145":1,"146":1}}],["默认为null",{"2":{"117":2}}],["默认为",{"2":{"117":1,"152":1,"173":2}}],["默认为4",{"2":{"117":1}}],["默认计算参数",{"2":{"115":3}}],["默认语言是en",{"2":{"111":1}}],["默认生成的分割文字信息",{"2":{"37":1}}],["目前只会匹配当前最后一条数据的时间戳",{"2":{"147":1}}],["目前图表内置了en",{"2":{"111":1}}],["目前快捷键仅支持移动和缩放",{"2":{"95":1}}],["国际化",{"0":{"111":1},"1":{"112":1,"113":1}}],["实际终点数据索引",{"2":{"117":2}}],["实际起点数据索引",{"2":{"117":2}}],["实现checkeventon和draw两个方法",{"2":{"110":1}}],["实例化并绘制",{"2":{"97":1}}],["实例apiapplynewdata",{"2":{"24":1}}],["实例api新增getoffsetrightdistance和executeaction",{"2":{"24":1}}],["实例api",{"0":{"124":1,"192":1},"1":{"125":1,"126":1,"127":1,"128":1,"129":1,"130":1,"131":1,"132":1,"133":1,"134":1,"135":1,"136":1,"137":1,"138":1,"139":1,"140":1,"141":1,"142":1,"143":1,"144":1,"145":1,"146":1,"147":1,"148":1,"149":1,"150":1,"151":1,"152":1,"153":1,"154":1,"155":1,"156":1,"157":1,"158":1,"159":1,"160":1,"161":1,"162":1,"163":1,"164":1,"165":1,"166":1,"167":1,"168":1,"169":1,"170":1,"171":1,"172":1,"173":1,"174":1},"2":{"20":1}}],["实例方法removetechnicalindicator变更为removeindicator",{"2":{"30":1}}],["实例方法gettechnicalindicatorbypaneid变更为getindicatorbypaneid",{"2":{"30":1}}],["实例方法getstyleoptions变更为getstyles",{"2":{"30":1}}],["实例方法overlaytechnicalindicator变更为overlayindicator",{"2":{"30":1}}],["实例方法createtechnicalindicator变更为createindicator",{"2":{"30":1}}],["实例方法createindicator",{"2":{"14":1}}],["实例方法setoffsetrightspace变更为setoffsetrightdistance",{"2":{"30":1}}],["实例方法setpaneoptions",{"2":{"30":1}}],["实例方法setstyleoptions变更为setstyles",{"2":{"30":1}}],["实例方法新增setmaxoffsetleftdistance和setmaxoffsetrightdistance",{"2":{"13":1}}],["步骤二",{"0":{"110":1,"120":1}}],["步骤一",{"0":{"109":1,"119":1}}],["我们可以定义三个选项stroke",{"2":{"109":1}}],["先确定属性和样式",{"2":{"109":1}}],["示例",{"0":{"108":1,"118":1,"179":1},"1":{"109":1,"110":1,"119":1,"120":1},"2":{"152":1,"153":1,"156":1,"158":1,"167":1,"185":2}}],["返回值由",{"2":{"194":1}}],["返回值是一个标识窗口的字符串",{"2":{"152":1}}],["返回一个字符串类型的标识",{"2":{"156":1}}],["返回一个boolean值",{"2":{"107":1}}],["返回数据类型可参阅数据源",{"2":{"148":1}}],["返回数据个数需要和klinedatalist的数据个数一致",{"2":{"120":1}}],["返回完整类型参阅样式",{"2":{"128":1}}],["返回类型参阅figures",{"2":{"117":1}}],["返回图表实例",{"2":{"44":1}}],["校验事件是否在图形上",{"2":{"107":1}}],["然后通过klinecharts",{"2":{"106":1,"116":1,"177":1}}],["同时打包",{"2":{"213":3}}],["同时技术指标系列是",{"2":{"129":1}}],["同text",{"2":{"105":1}}],["同utils",{"2":{"91":1}}],["基础信息提示",{"2":{"224":1}}],["基础展示",{"0":{"216":1}}],["基础图形可以通过图表方法klinecharts",{"2":{"96":1}}],["基础图形是图表重要的组成部分",{"2":{"96":1}}],["基础图形",{"0":{"96":1},"1":{"97":1,"98":1,"99":1,"100":1,"101":1,"102":1,"103":1,"104":1,"105":1,"106":1,"107":1,"108":1,"109":1,"110":1}}],["基础图形信息",{"2":{"50":1}}],["基本图形",{"2":{"210":1}}],["基本都可以自定义样式",{"2":{"183":1}}],["基本零成本上手",{"2":{"123":1}}],["基准值",{"2":{"117":1}}],["基准",{"2":{"104":1}}],["虚线参数",{"2":{"99":1,"101":1}}],["虚线参数值",{"2":{"85":1,"87":1}}],["属性plots变更为figures",{"2":{"194":1}}],["属性说明",{"0":{"107":1,"117":1,"178":1}}],["属性",{"2":{"97":1,"109":1}}],["等进行下载",{"2":{"181":1}}],["等",{"2":{"97":1,"210":1}}],["需要创建新的工程",{"2":{"214":1}}],["需要返回一个数组",{"2":{"185":1}}],["需要返回一个boolean类型的值",{"2":{"178":1}}],["需要转换的值",{"2":{"171":1,"172":1}}],["需要覆盖的参数",{"2":{"158":1}}],["需要覆盖的一些参数",{"2":{"153":1}}],["需要在有画布上下文的情况下使用",{"2":{"97":1}}],["需要运行在支持",{"2":{"93":1}}],["注意",{"2":{"97":1,"120":1,"145":1,"146":1,"147":1,"150":1,"174":1}}],["这样你的第一个图表就创建完成了",{"2":{"182":1}}],["这样一个自定义覆盖物就完成了",{"2":{"179":1}}],["这样一个自定义指标就完成了",{"2":{"120":1}}],["这样一个自定义的基础图形就完成了",{"2":{"110":1}}],["这非常重要",{"2":{"152":1}}],["这里只是清除数据",{"2":{"149":1}}],["这里每一项的数据格式应该是",{"2":{"120":1}}],["这里计算不能及时响应",{"2":{"120":1}}],["这里的",{"2":{"39":3,"40":1,"41":1}}],["这篇文档介绍了内置的基本图形和如何自定义一个基础图形",{"2":{"96":1}}],["建议仔细阅读",{"2":{"96":1}}],["缩放比例",{"2":{"164":1,"165":1,"166":1}}],["缩放不准确问题",{"2":{"1":1}}],["缩小",{"2":{"95":1}}],["放大",{"2":{"95":1}}],["左侧",{"2":{"215":1}}],["左移",{"2":{"95":1}}],["左内边距",{"2":{"90":1,"104":1}}],["←",{"2":{"95":1}}],["→",{"2":{"95":1}}],["⌨️",{"0":{"95":1}}],["兼容处理",{"0":{"94":1}}],["构建",{"2":{"93":1}}],["浏览器支持",{"0":{"93":1}}],["🌟",{"2":{"225":1}}],["🍍",{"2":{"220":1}}],["🍑",{"2":{"220":1}}],["🍒",{"2":{"220":1}}],["🍈",{"2":{"220":1}}],["🍓",{"2":{"220":1}}],["🍇",{"2":{"220":1}}],["🍉",{"2":{"220":1}}],["🍌",{"2":{"220":1}}],["🍋",{"2":{"220":1}}],["🍊",{"2":{"220":1}}],["🍐",{"2":{"220":1}}],["🍎",{"2":{"220":1}}],["🍏",{"2":{"220":2}}],["🎨",{"0":{"183":1},"1":{"184":1,"185":1},"2":{"123":1}}],["🌏",{"0":{"111":1},"1":{"112":1,"113":1}}],["🏝️",{"0":{"92":1},"1":{"93":1,"94":1}}],["🆕",{"2":{"10":4,"13":2,"14":3,"18":2,"19":2,"20":3,"21":3,"24":5,"28":2,"30":1}}],["已废弃",{"2":{"91":1,"105":1,"145":1,"146":1,"147":1,"150":1}}],["背景色",{"2":{"90":1,"104":1,"173":1}}],["右侧",{"2":{"215":1}}],["右击回调事件",{"2":{"178":1}}],["右击事件",{"2":{"55":1,"158":1}}],["右移",{"2":{"95":1}}],["右内边距",{"2":{"90":1,"104":1}}],["线性轴",{"2":{"215":1}}],["线样式",{"2":{"87":1}}],["线参数",{"2":{"87":1}}],["粗细",{"2":{"85":1,"87":1,"104":1}}],["弧样式",{"2":{"85":1}}],["画布上下文",{"2":{"85":1,"86":1,"87":1,"88":1,"89":1,"90":1,"97":1,"107":1,"117":1}}],["权重",{"2":{"84":1,"90":1}}],["字体",{"2":{"84":1,"90":1,"104":1}}],["尺寸",{"2":{"84":1,"90":1,"99":1,"101":1,"104":1}}],["颜色",{"2":{"84":1,"85":1,"86":1,"87":1,"88":1,"89":1,"90":1,"99":1,"100":1,"101":1,"102":1,"103":1,"104":1}}],["垂直对齐方式",{"2":{"84":1,"90":1}}],["水平对齐方式",{"2":{"84":1,"90":1}}],["结束角度",{"2":{"79":1,"85":1,"99":1}}],["起始点y轴坐标值",{"2":{"103":1,"104":1}}],["起始点y轴值",{"2":{"83":1,"84":1,"89":1,"90":1}}],["起始点x轴坐标值",{"2":{"103":1,"104":1}}],["起始点x轴值",{"2":{"83":1,"84":1,"89":1,"90":1}}],["起始角度",{"2":{"79":1,"85":1}}],["起点数据索引",{"2":{"117":2}}],["起点",{"2":{"37":1}}],["半径",{"2":{"79":1,"80":1,"85":1,"86":1,"99":1,"100":1}}],["圆",{"2":{"221":1}}],["圆心y轴坐标值",{"2":{"99":1,"100":1}}],["圆心x轴坐标值",{"2":{"99":1,"100":1}}],["圆心的y轴值",{"2":{"79":1,"80":1,"85":1,"86":1}}],["圆心的x轴值",{"2":{"79":1,"80":1,"85":1,"86":1}}],["圆参数",{"2":{"80":1,"86":1}}],["圆弧参数",{"2":{"79":1,"85":1}}],["+=",{"2":{"215":1,"216":1,"217":1,"218":3,"219":1,"220":1,"221":1,"222":1,"223":1,"224":1}}],["+098syuqtzi0ynzll",{"2":{"204":1}}],["+",{"2":{"76":1,"95":5,"110":5,"120":2,"179":1,"215":9,"216":9,"217":9,"218":9,"219":9,"220":11,"221":10,"222":9,"223":9,"224":9}}],["即可",{"2":{"181":1}}],["即可使用图表方法",{"2":{"38":1}}],["即全局样式配置中的overlay",{"2":{"178":1}}],["即全局设置的技术指标样式",{"2":{"117":3}}],["即调用createindicator方法时返回的窗口标识",{"2":{"154":1,"155":1}}],["即title的值需要改变",{"2":{"120":1}}],["即",{"2":{"119":2}}],["即y",{"2":{"76":1}}],["获取到对应的dom后操作",{"2":{"192":1}}],["获取klinechart",{"0":{"181":1}}],["获取可见区间范围",{"2":{"144":1}}],["获取样式配置",{"2":{"128":1}}],["获取尺寸",{"2":{"126":1}}],["获取dom容器",{"2":{"125":1}}],["获取基础图形实例",{"2":{"97":1}}],["获取",{"2":{"96":1}}],["获取一个点在斜率和常数项形成的线上的y轴坐标值",{"2":{"78":1}}],["获取一个点在另外两个坐标点形成的线上的y轴坐标值",{"2":{"77":1}}],["获取点组成的线的斜率和常数项",{"2":{"76":1}}],["获取图表转换成图片后的图片url",{"2":{"173":1}}],["获取图表目前的数据源",{"2":{"148":1}}],["获取图表单根蜡烛柱的宽度",{"2":{"143":1}}],["获取图表右边可以空出来的间隙",{"2":{"137":1}}],["获取图表时区名",{"2":{"131":1}}],["获取图表当前版本号",{"2":{"59":1}}],["获取图表支持的覆盖物",{"2":{"56":1}}],["获取图表支持的技术指标",{"2":{"54":1}}],["获取图表支持的基础图形类型",{"2":{"51":1}}],["获取图表支持的本地化语言类型",{"2":{"48":1}}],["获取图形类",{"2":{"52":1}}],["根据需要通知下级组件进行更新",{"2":{"210":1}}],["根据id获取覆盖物信息",{"2":{"157":1}}],["根据窗口id获取技术指标信息",{"2":{"154":1}}],["根据两个坐标点",{"2":{"76":1}}],["根据覆盖物名称获取图表内覆盖物的属性",{"2":{"47":1}}],["y轴线",{"2":{"185":1}}],["y轴",{"2":{"185":1}}],["y轴组件",{"2":{"117":2,"178":1}}],["yarn",{"2":{"181":1,"212":1}}],["yaxis",{"2":{"2":1,"30":3,"53":3,"117":6,"125":2,"126":2,"152":1,"153":1,"178":2,"185":1,"189":3,"194":4,"215":4,"220":2}}],["ydis",{"2":{"110":2,"179":3,"221":3}}],["y是中心点y轴坐标值",{"2":{"109":1}}],["y",{"2":{"76":2,"77":3,"78":1,"79":3,"80":3,"81":2,"82":2,"83":3,"84":3,"85":2,"86":2,"87":1,"88":1,"89":2,"90":2,"99":1,"100":1,"101":1,"102":1,"103":1,"104":1,"107":1,"109":1,"110":12,"164":1,"171":2,"172":2,"178":1,"179":2,"220":2,"221":2}}],["yyyy",{"2":{"72":1}}],["取消回调事件",{"2":{"178":1}}],["取消订阅图表动作",{"2":{"170":1}}],["取消选中事件",{"2":{"55":1,"158":1}}],["取c的值",{"2":{"69":1}}],["===",{"2":{"110":5,"179":1,"221":1,"222":2}}],["=",{"2":{"69":1,"76":1,"97":1,"110":14,"120":6,"145":1,"147":1,"179":3,"182":8,"215":31,"216":16,"217":22,"218":22,"219":22,"220":39,"221":25,"222":28,"223":22,"224":35}}],["=>",{"2":{"37":1,"44":3,"45":1,"46":1,"47":1,"48":1,"49":1,"50":3,"51":1,"52":1,"53":9,"54":1,"55":20,"56":1,"57":2,"58":2,"59":1,"61":1,"62":1,"63":1,"64":1,"65":1,"66":1,"67":1,"68":1,"69":1,"70":1,"71":1,"72":1,"73":1,"74":1,"75":1,"76":1,"77":1,"78":1,"79":1,"80":1,"81":1,"82":1,"83":1,"84":1,"85":1,"86":1,"87":1,"88":1,"89":1,"90":1,"99":1,"100":1,"101":1,"102":1,"103":1,"104":1,"107":2,"110":2,"117":6,"120":5,"125":1,"126":1,"127":1,"128":1,"129":1,"130":1,"131":1,"132":1,"133":1,"134":1,"135":1,"136":1,"137":1,"138":1,"139":1,"140":1,"141":1,"142":1,"143":1,"144":1,"145":2,"146":2,"147":2,"148":1,"149":1,"150":2,"151":3,"152":10,"153":13,"154":1,"155":1,"156":29,"157":1,"158":15,"159":1,"160":1,"161":1,"162":1,"163":1,"164":1,"165":1,"166":1,"167":1,"168":2,"169":2,"170":2,"171":1,"172":1,"173":1,"174":1,"178":17,"179":1,"182":13,"215":8,"217":2,"218":3,"219":2,"220":7,"221":3,"222":2,"223":2,"224":8}}],["辅助方法集合",{"2":{"60":1}}],["鼠标移出事件",{"2":{"55":1,"158":1,"178":1}}],["鼠标移入事件",{"2":{"55":1,"158":1,"178":1}}],["按住拖动结束回调事件",{"2":{"178":1}}],["按住拖动回调事件",{"2":{"178":1}}],["按住拖动开始回调事件",{"2":{"178":1}}],["按住某个操作点移动过程中触发",{"2":{"178":1}}],["按住移动结束事件",{"2":{"55":1,"158":1}}],["按住移动中事件",{"2":{"55":1,"158":1}}],["按住移动事件特殊处理方法",{"2":{"55":1}}],["按住开始移动事件",{"2":{"55":1,"158":1}}],["点一个",{"2":{"225":1}}],["点击回调事件",{"2":{"178":1}}],["点击事件",{"2":{"55":1,"158":1}}],["点信息",{"2":{"55":1,"158":1,"178":2}}],["开发环境和生产环境模块并生成",{"2":{"213":1}}],["开发环境和生产环境模块",{"2":{"213":2}}],["开发环境模块",{"2":{"213":1}}],["开发",{"0":{"211":1},"1":{"212":1,"213":1,"214":1}}],["开盘和收盘",{"2":{"185":1}}],["开盘价",{"2":{"42":1}}],["开箱即用",{"2":{"123":1}}],["开始角度",{"2":{"99":1}}],["开始绘制事件",{"2":{"55":1,"158":1}}],["仅支持",{"2":{"168":1}}],["仅仅在创建新的窗口时有效",{"2":{"152":1}}],["仅",{"2":{"55":1,"158":1,"178":1}}],["越靠前显示",{"2":{"55":1}}],["will",{"2":{"215":1,"217":1,"219":1,"220":1,"221":1,"222":1,"223":1,"224":1}}],["widget",{"2":{"210":1}}],["width=device",{"2":{"182":1}}],["width是宽度",{"2":{"109":1}}],["width",{"2":{"37":1,"83":2,"89":2,"90":2,"103":1,"104":1,"109":1,"110":8,"117":2,"126":1,"178":1,"182":8}}],["window",{"2":{"182":1}}],["wrap",{"2":{"215":2,"217":2,"219":2,"220":2,"221":2,"222":2,"223":2,"224":2}}],["wr",{"2":{"115":1}}],["web",{"2":{"178":1}}],["webview",{"2":{"93":1}}],["weight",{"0":{"75":1},"2":{"75":1,"84":2,"90":2,"104":1,"185":10}}],["weak",{"2":{"55":3,"156":3,"158":4,"178":3}}],["zh",{"2":{"112":1,"178":1,"219":3}}],["zlevel",{"2":{"55":2,"117":1,"152":1,"153":3,"156":3,"158":3,"178":1}}],["zoomattimestamp",{"0":{"166":1},"2":{"1":1}}],["zoomatdataindex",{"0":{"165":1},"2":{"1":1}}],["zoomatcoordinate",{"0":{"164":1},"2":{"1":1}}],["创建dom容器",{"2":{"210":1}}],["创建canvas",{"2":{"210":1}}],["创建第一个图表",{"0":{"182":1}}],["创建时候的id",{"2":{"159":1}}],["创建覆盖物",{"2":{"156":1}}],["创建一个技术指标",{"2":{"152":1}}],["创建一个自定义技术指标",{"2":{"116":1}}],["创建一个自定义基础图形",{"2":{"106":1}}],["创建自定义提示文字",{"2":{"117":1}}],["创建自定义提示信息方法",{"2":{"53":1,"153":1}}],["创建分割文字",{"2":{"57":1,"58":1}}],["创建分割文字方法实现",{"2":{"37":1}}],["创建y轴上的图形",{"2":{"55":1,"178":1}}],["创建x轴上的图形",{"2":{"55":1,"178":1}}],["创建点对应的图形信息",{"2":{"179":1}}],["创建点对应的图形",{"2":{"55":1,"178":1}}],["重新生成数图形配置方法",{"2":{"117":1}}],["重新生成图形信息方法",{"2":{"53":1,"153":1}}],["重构窗口之间的分割线模块",{"2":{"14":1}}],["计算出来的数据不是想要的",{"0":{"199":1}}],["计算结果",{"2":{"120":1}}],["计算文字宽度",{"2":{"75":1}}],["计算方法",{"2":{"53":1,"117":1,"153":1}}],["计算参数最好取回调参数calcparams",{"2":{"120":1}}],["计算参数是2个",{"2":{"119":1}}],["计算参数文字",{"2":{"117":1}}],["计算参数",{"2":{"53":1,"117":2,"153":1}}],["指定的轴的名字",{"2":{"152":1}}],["指定的最大值",{"2":{"117":1}}],["指定的最小值",{"2":{"117":1}}],["指定高",{"2":{"104":1}}],["指定宽",{"2":{"104":1}}],["指定最大值",{"2":{"53":1,"153":1}}],["指定最小值",{"2":{"53":1,"153":1}}],["指标信息提示",{"2":{"224":1}}],["指标等等",{"2":{"210":1}}],["指标创建完成回调方法",{"2":{"152":1}}],["指标简短名称",{"2":{"117":1}}],["指标系列",{"2":{"53":1,"153":1}}],["指标名",{"2":{"53":1,"115":3,"117":1,"153":1}}],["指标图形配置支持自定义",{"2":{"21":1}}],["指标新增zlevel属性",{"2":{"13":1}}],["扩展数据",{"2":{"53":1,"55":1,"117":1,"153":1,"158":1,"178":1}}],["精度",{"2":{"53":1,"117":1,"153":1,"178":1}}],["k",{"2":{"215":2,"216":2,"217":2,"218":2,"219":2,"220":2,"221":2,"222":4,"223":2,"224":2}}],["k线数据",{"2":{"117":2}}],["kdj",{"2":{"115":1}}],["kb",{"0":{"78":1},"2":{"78":1}}],["kx",{"2":{"76":1}}],["klinechart",{"0":{"122":1},"2":{"122":1,"181":1,"182":1,"203":2,"205":1,"207":1,"225":2}}],["klinecharts",{"2":{"24":1,"97":1,"181":7,"182":8,"186":2,"187":1,"215":1,"216":1,"217":1,"218":1,"219":1,"220":1,"221":1,"222":1,"223":1,"224":1,"225":1}}],["klinedata>",{"2":{"151":1}}],["klinedatalist",{"2":{"117":2,"120":3,"194":4,"220":2}}],["klinedata",{"2":{"53":1,"117":11,"120":2,"151":1,"152":1,"153":1,"220":2}}],["keywords",{"2":{"182":1}}],["key",{"0":{"69":1},"2":{"53":2,"55":6,"69":1,"112":1,"113":1,"117":1,"119":2,"120":4,"152":2,"153":2,"178":2,"179":1,"185":1,"215":17,"217":8,"219":5,"220":1,"221":5,"222":6,"223":5,"224":13}}],["绘制结束回调事件",{"2":{"178":1}}],["绘制结束事件",{"2":{"55":1,"158":1}}],["绘制过程中回调事件",{"2":{"178":1}}],["绘制开始回调事件",{"2":{"178":1}}],["绘制边框的菱形",{"2":{"110":1}}],["绘制填充的菱形",{"2":{"110":1}}],["绘制",{"2":{"107":1}}],["绘制带背景的文字",{"2":{"90":1}}],["绘制矩形",{"2":{"89":1}}],["绘制多边形",{"2":{"88":1}}],["绘制线",{"2":{"87":1}}],["绘制圆",{"2":{"86":1}}],["绘制圆弧",{"2":{"85":1}}],["绘制中事件",{"2":{"55":1,"158":1}}],["绘制层级",{"2":{"55":1,"158":1,"178":1}}],["绘制方法",{"2":{"50":1}}],["绘制模糊问题",{"2":{"1":1}}],["唯一标识",{"2":{"50":1}}],["添加开发者",{"2":{"205":1}}],["添加历史更多数据",{"2":{"146":1}}],["添加新数据",{"2":{"145":1}}],["添加到图表即可和内置覆盖物一样去使用",{"2":{"177":1}}],["添加到图表即可和内置技术指标一样去使用",{"2":{"116":1}}],["添加到图表即可和内置基础图形一样去使用",{"2":{"106":1}}],["添加一个中文繁体的语言包",{"2":{"112":1}}],["添加一个自定义y轴",{"2":{"58":1}}],["添加一个自定义x轴",{"2":{"57":1}}],["添加一个覆盖物",{"2":{"55":1}}],["添加一个技术指标",{"2":{"53":1}}],["添加一个基础图形",{"2":{"50":1}}],["添加一个样式配置",{"2":{"49":1}}],["添加一个本地化语言",{"2":{"46":1}}],["添加重复数据问题",{"2":{"7":1}}],["元素id或者图表实例",{"2":{"45":1}}],["小数折叠阈值",{"2":{"44":1,"178":1}}],["千分符",{"2":{"44":1,"178":1}}],["格式化折叠小数",{"2":{"74":1}}],["格式化精度",{"2":{"70":1}}],["格式化大的数字",{"2":{"44":1,"71":1}}],["格式化日期和时间的对象的构造器",{"2":{"178":1}}],["格式化日期千分符",{"2":{"73":1}}],["格式化日期",{"2":{"44":1,"72":1}}],["如k线柱",{"2":{"210":1}}],["如圆",{"2":{"210":1}}],["如const",{"2":{"69":1}}],["如1000转换成1k",{"2":{"44":1,"53":1,"71":1,"153":1}}],["如果能够打赏一杯",{"2":{"225":1}}],["如果你觉得插件还不错",{"2":{"225":1}}],["如果你看到此处",{"2":{"207":1}}],["如果你是",{"2":{"186":1}}],["如果dataindex和timestamp同时存在",{"2":{"171":1}}],["如果id存在",{"2":{"158":1}}],["如果缺省",{"2":{"155":1}}],["如果有值的情况下",{"2":{"120":1}}],["如果不是",{"2":{"120":1}}],["如果不设置会自动获取本机时区",{"2":{"44":1,"130":1}}],["如果无值",{"2":{"120":1}}],["如果返回true",{"2":{"117":1,"178":1}}],["如果name无值",{"2":{"117":1}}],["如果给定",{"2":{"117":1}}],["如果需要将组织官网或者个人主页展示在",{"2":{"225":1}}],["如果需要使用其他语言",{"2":{"111":1}}],["如果需要制作复杂的自定义技术指标和覆盖物",{"2":{"96":1}}],["如果需要运行在移动端",{"2":{"93":1}}],["如果需要展示技术指标",{"2":{"42":1}}],["如",{"2":{"44":1,"72":1,"97":1,"130":1}}],["语言配置",{"2":{"46":1}}],["语言名",{"2":{"46":1}}],["语言",{"2":{"44":1}}],["容器",{"2":{"44":1}}],["gendata",{"2":{"215":2,"216":2,"217":2,"218":4,"219":2,"220":2,"221":2,"222":2,"223":2,"224":2}}],["getelementbyid",{"2":{"215":1,"217":1,"219":1,"220":1,"221":1,"222":3,"223":1,"224":1}}],["getwidth",{"2":{"192":1}}],["getalphablue",{"2":{"185":1}}],["getconvertpictureurl",{"0":{"173":1}}],["getindicatorbypaneid",{"0":{"154":1}}],["getdatalist",{"0":{"148":1},"2":{"218":1}}],["getdom",{"0":{"125":1},"2":{"192":1}}],["getbarspace",{"0":{"143":1}}],["getoffsetrightdistance",{"0":{"137":1}}],["getoverlayclass",{"0":{"47":1}}],["getoverlaybyid",{"0":{"157":1},"2":{"30":1}}],["gettime",{"2":{"215":1,"216":1,"217":1,"218":1,"219":1,"220":1,"221":1,"222":1,"223":1,"224":1}}],["gettimezone",{"0":{"131":1}}],["gettechnicalindicatorbypaneid",{"2":{"192":1}}],["gettechnicalindicatortemplate",{"2":{"30":1}}],["getlinearyfromslopeintercept",{"0":{"78":1}}],["getlinearyfromcoordinates",{"0":{"77":1}}],["getlinearslopeintercept",{"0":{"76":1}}],["getlocal",{"2":{"30":1}}],["getheight",{"2":{"30":1}}],["getvisiblerange",{"0":{"144":1},"2":{"30":1}}],["getstyleoptions",{"2":{"192":1}}],["getstyles",{"0":{"128":1}}],["getsize",{"0":{"126":1},"2":{"30":1}}],["getsupportedoverlays",{"0":{"56":1}}],["getsupportedindicators",{"0":{"54":1}}],["getsupportedfigures",{"0":{"51":1}}],["getsupportedlocales",{"0":{"48":1}}],["getsupportlocales",{"2":{"30":1}}],["getsupportoverlays",{"2":{"30":1}}],["getsupportfigures返回值中的一种",{"2":{"178":1}}],["getsupportfigures",{"2":{"30":1}}],["getfigureclass",{"0":{"52":1},"2":{"30":1,"96":1,"97":1}}],["github",{"0":{"203":1},"2":{"203":2,"225":1}}],["green",{"2":{"222":15}}],["grid",{"2":{"185":1}}],["groupid",{"2":{"156":3,"158":3,"159":2}}],["global",{"2":{"178":1}}],["gt",{"2":{"145":1,"147":1}}],["gzip压缩下仅40k",{"2":{"123":1}}],["gapbar",{"2":{"117":1,"178":1,"220":1}}],["gap",{"2":{"44":1,"152":3,"167":3,"215":1,"217":1,"219":1,"220":1,"221":1,"222":1,"223":1,"224":1}}],["最新值标记",{"2":{"185":1}}],["最新价标记",{"2":{"185":1}}],["最新价线不显示问题",{"2":{"15":1}}],["最低价标记",{"2":{"185":1}}],["最低价",{"2":{"42":1}}],["最高价标记",{"2":{"185":1}}],["最高价",{"2":{"42":1}}],["毫秒级别",{"2":{"42":1}}],["代替即可",{"2":{"120":1}}],["代替",{"2":{"39":2,"40":1,"41":1,"91":1,"145":1,"147":1,"150":1,"191":1,"192":3}}],["`strong",{"2":{"178":1}}],["`stroke",{"2":{"100":1,"102":1,"103":1,"104":1}}],["`stroke`",{"2":{"100":1,"102":1,"103":1,"104":1}}],["`weak",{"2":{"178":1}}],["`ma$",{"2":{"120":2}}],["`dashed`",{"2":{"99":1,"101":1}}],["`",{"2":{"39":3,"40":1,"41":1,"120":2,"182":1}}],["`$",{"2":{"39":3,"40":1,"41":1}}],["方法render",{"2":{"194":1}}],["方法regenerateplots",{"2":{"194":1}}],["方法createtooltipdatasource",{"2":{"194":1}}],["方法calctechnicalindicator",{"2":{"194":1}}],["方法",{"0":{"39":1,"40":1,"41":1}}],["使用完全免费",{"2":{"225":1}}],["使用全局变量",{"2":{"181":1}}],["使用语言包",{"0":{"113":1}}],["使用示例",{"0":{"97":1}}],["使用自定义x轴时的",{"2":{"39":1}}],["使用自定义y轴时的",{"2":{"39":1,"40":1,"41":1}}],["使用自己定义的容器id代替",{"2":{"39":1}}],["使用",{"0":{"39":1,"40":1,"41":1}}],["使用说明",{"0":{"38":1},"1":{"39":1,"40":1,"41":1}}],["来安装依赖",{"2":{"212":1}}],["来和图表进行数据交互",{"2":{"42":1}}],["来指定",{"2":{"38":1}}],["来指定坐标轴",{"2":{"38":1}}],["来实现",{"2":{"36":1}}],[">`",{"2":{"182":1}}],[">=",{"2":{"120":1}}],[">",{"2":{"37":2,"44":1,"53":4,"55":4,"57":1,"58":1,"81":1,"82":1,"87":1,"88":1,"101":1,"102":1,"117":2,"145":1,"146":1,"148":1,"152":4,"153":4,"156":3,"158":1,"171":2,"172":1,"178":4,"181":1,"182":13,"205":1,"215":2,"216":1,"217":2,"218":1,"219":2,"220":2,"221":2,"222":2,"223":2,"224":2}}],["展示的文字",{"2":{"37":2}}],["||",{"2":{"110":2,"120":1}}],["|",{"2":{"37":2,"44":7,"45":2,"53":5,"55":17,"57":1,"58":1,"70":1,"71":1,"73":1,"74":1,"75":1,"84":10,"85":1,"86":4,"87":1,"88":4,"89":4,"90":13,"99":1,"100":3,"101":1,"102":3,"103":3,"104":5,"117":5,"125":2,"126":2,"127":1,"150":1,"151":1,"152":17,"153":14,"156":8,"158":3,"159":1,"169":7,"170":7,"171":2,"172":2,"178":9,"185":54}}],["值小余1则是百分比",{"2":{"152":2,"167":2}}],["值信息",{"2":{"117":1}}],["值越大越靠前显示",{"2":{"158":1,"178":1}}],["值越大",{"2":{"55":1}}],["值",{"2":{"37":2}}],["坐标轴",{"0":{"215":1}}],["坐标轴名字",{"2":{"37":1,"57":1,"58":1}}],["坐标点",{"2":{"164":1}}],["坐标点信息",{"2":{"79":1,"80":1,"83":1,"84":1}}],["坐标集合",{"2":{"101":1,"102":1}}],["坐标信息",{"2":{"57":1,"58":1}}],["坐标位置",{"2":{"37":2}}],["距离",{"2":{"160":1}}],["距离底部距离",{"2":{"37":1,"117":2,"178":1}}],["距离顶部距离",{"2":{"37":1,"117":2,"178":1}}],["距离右边距离",{"2":{"37":1,"117":2,"178":1}}],["距离左边距离",{"2":{"37":1,"117":2,"178":1}}],["高可扩展",{"2":{"123":1}}],["高度",{"2":{"83":1,"89":1,"90":1,"103":1}}],["高",{"2":{"37":1,"112":1,"117":2,"178":1,"219":1}}],["宽度",{"2":{"83":1,"89":1,"90":1,"103":1}}],["宽",{"2":{"37":1,"117":2,"178":1}}],["真实数据索引",{"2":{"117":1}}],["真实的x坐标",{"2":{"117":1}}],["真实区间长度",{"2":{"37":1}}],["真实终点",{"2":{"37":1}}],["真实起点",{"2":{"37":1}}],["区间长度",{"2":{"37":1}}],["区间相关的信息",{"2":{"37":1}}],["终点数据索引",{"2":{"117":2}}],["终点",{"2":{"37":1}}],["n",{"2":{"185":2}}],["ngondestroy",{"2":{"182":1}}],["ngafterviewinit",{"2":{"182":1}}],["npmyarnpnpmbuncdn",{"2":{"181":1}}],["npm",{"0":{"213":1},"2":{"181":2,"182":1,"212":2,"213":10,"214":1}}],["neue",{"2":{"185":12,"220":1}}],["net",{"2":{"181":1,"182":1}}],["next",{"2":{"117":1}}],["newdata",{"2":{"218":10}}],["new",{"2":{"97":1,"215":1,"216":1,"217":1,"218":1,"219":1,"220":1,"221":1,"222":1,"223":1,"224":1}}],["needdefaultyaxisfigure",{"2":{"55":2,"156":3,"158":3,"178":1,"221":1}}],["needdefaultxaxisfigure",{"2":{"55":2,"156":3,"158":3,"178":1,"221":1}}],["needdefaultpointfigure",{"2":{"55":2,"156":3,"158":3,"178":1,"221":1}}],["node",{"2":{"212":2}}],["none",{"2":{"185":2,"215":2,"217":2,"219":2,"220":2,"221":2,"222":2,"223":2,"224":3}}],["normal",{"2":{"53":2,"55":2,"117":2,"152":1,"153":2,"156":2,"158":2,"178":2,"185":14,"215":1}}],["nochangecolor",{"2":{"153":2,"185":5,"222":4}}],["nochangewickcolor",{"2":{"24":1,"185":1}}],["nochangebordercolor",{"2":{"24":1,"185":1}}],["null",{"2":{"150":1,"152":2,"153":3,"156":1,"158":1}}],["nullable",{"2":{"47":1,"151":1}}],["number>",{"2":{"78":1,"86":1,"88":1,"89":1}}],["number",{"2":{"37":16,"42":7,"44":8,"53":5,"55":6,"57":2,"58":2,"70":2,"71":1,"72":1,"73":1,"74":2,"75":3,"76":4,"77":7,"78":3,"79":7,"80":5,"81":4,"82":4,"83":6,"84":6,"85":7,"86":4,"87":4,"88":3,"89":6,"90":13,"99":7,"100":5,"101":4,"102":4,"103":7,"104":13,"107":2,"117":32,"126":6,"129":2,"136":1,"137":1,"138":1,"139":1,"140":1,"141":1,"142":1,"143":1,"144":4,"145":7,"146":7,"147":7,"148":7,"150":1,"152":10,"153":6,"156":10,"158":5,"160":2,"161":2,"162":2,"163":2,"164":4,"165":3,"166":3,"167":4,"171":10,"172":10,"178":29}}],["name=",{"2":{"182":4}}],["name为基础图形名字",{"2":{"97":1}}],["name",{"0":{"49":1,"52":1,"154":1,"155":1},"2":{"37":1,"38":2,"39":4,"40":2,"41":2,"44":1,"47":1,"49":2,"50":2,"52":2,"53":3,"55":2,"57":2,"58":2,"96":1,"97":1,"107":1,"110":1,"117":2,"120":1,"152":5,"153":4,"154":2,"155":2,"156":3,"158":3,"159":2,"167":3,"178":1,"179":1,"192":5,"194":1,"201":1,"220":11,"221":3}}],["^9",{"0":{"36":1,"57":1,"58":1,"74":1,"75":1,"137":1,"138":1,"139":1,"151":1,"168":1},"1":{"37":1,"38":1,"39":1,"40":1,"41":1},"2":{"44":2,"55":2,"145":1,"146":1,"147":1,"152":3,"153":1,"158":2,"167":2}}],["的组织或个人",{"2":{"225":1}}],["的包管理器管理",{"2":{"212":1}}],["的浏览器上",{"2":{"93":1}}],["的版本记录",{"2":{"34":1,"35":1}}],["的",{"2":{"31":1,"32":1,"33":1}}],["x轴分割线",{"2":{"185":2}}],["x轴分割文字",{"2":{"185":2}}],["x轴线",{"2":{"185":1}}],["x轴",{"2":{"185":1}}],["x轴组件",{"2":{"117":2,"178":1}}],["xxxxxxxx",{"2":{"156":1,"158":1}}],["xxx",{"2":{"120":2,"194":8}}],["xdis",{"2":{"110":2,"179":3,"221":3}}],["x是中心点x轴坐标值",{"2":{"109":1}}],["x3c",{"2":{"37":2,"44":2,"47":1,"53":4,"55":4,"57":1,"58":1,"78":1,"81":1,"82":1,"86":1,"87":1,"88":2,"89":1,"101":1,"102":1,"110":1,"117":7,"145":1,"146":1,"148":1,"151":1,"152":4,"153":4,"156":3,"158":1,"171":2,"172":2,"178":4,"181":2,"182":32,"215":5,"216":3,"217":5,"218":3,"219":5,"220":6,"221":5,"222":5,"223":5,"224":5}}],["x",{"0":{"31":1,"32":1,"33":1,"34":1,"35":1},"2":{"31":1,"32":1,"33":1,"34":1,"35":1,"76":2,"77":3,"78":1,"79":3,"80":3,"81":2,"82":2,"83":3,"84":3,"85":2,"86":2,"87":1,"88":1,"89":2,"90":2,"99":1,"100":1,"101":1,"102":1,"103":1,"104":1,"107":1,"109":1,"110":12,"164":1,"171":2,"172":2,"178":1,"179":2,"186":4,"220":2,"221":2}}],["xaxis",{"2":{"30":3,"39":1,"44":1,"53":3,"117":6,"152":1,"153":1,"178":2,"185":1,"189":3,"194":4,"220":2}}],["xaxis新增方法converttimestampfrompixel和converttimestamptopixel",{"2":{"20":1}}],["删除属性shouldcheckparamcount",{"2":{"194":1}}],["删除gettechnicalindicatorbypaneid",{"2":{"192":1}}],["删除setshapeoptions",{"2":{"192":1}}],["删除shape",{"2":{"30":2,"189":1}}],["删除removeshape",{"2":{"192":1}}],["删除createhtml",{"2":{"192":1}}],["删除createshape",{"2":{"192":1}}],["删除candle",{"2":{"30":1}}],["删除extension",{"2":{"191":1}}],["删除回调事件",{"2":{"178":1}}],["删除一个html元素",{"2":{"159":1}}],["删除事件",{"2":{"55":1,"158":1}}],["删除实例方法createhtml",{"2":{"30":1}}],["删除实例方法createshape",{"2":{"30":1}}],["删除实例方法setshapeoptions",{"2":{"30":1}}],["删除实例方法removeshape",{"2":{"30":1}}],["删除实例方法getwidth",{"2":{"30":1}}],["改用overlay",{"2":{"30":2}}],["改用overrideoverlay",{"2":{"30":1}}],["改用removeoverlay",{"2":{"30":1}}],["改用createoverlay",{"2":{"30":1}}],["改用getsize",{"2":{"30":1}}],["废弃",{"2":{"30":1}}],["hu",{"2":{"225":1}}],["hide",{"2":{"224":1}}],["high",{"2":{"42":1,"46":1,"112":1,"145":1,"146":1,"147":1,"148":1,"182":70,"185":3,"215":3,"216":3,"217":3,"218":5,"219":4,"220":3,"221":3,"222":3,"223":3,"224":3}}],["helvetica",{"2":{"185":12,"220":1}}],["head>",{"2":{"182":2}}],["height是高度",{"2":{"109":1}}],["height",{"2":{"37":1,"44":1,"83":2,"89":2,"90":2,"103":1,"104":1,"109":1,"110":8,"117":2,"126":1,"152":3,"167":3,"178":1,"182":7,"215":1,"216":1,"217":1,"218":1,"219":1,"220":1,"221":1,"222":1,"223":1,"224":1}}],["height变更为yaxis",{"2":{"30":1,"189":1}}],["height变更为xaxis",{"2":{"30":1,"189":1}}],["hooks",{"2":{"182":1}}],["horizontalstraightline",{"2":{"176":1}}],["horizontalsegment",{"2":{"176":1}}],["horizontalrayline",{"2":{"176":1}}],["horizontal",{"2":{"30":1,"185":2}}],["https",{"2":{"178":1,"181":1,"182":1,"203":2,"204":1,"225":1}}],["html>",{"2":{"182":2}}],["html",{"2":{"181":1,"182":1,"192":1}}],["htmlid",{"2":{"159":1,"192":1}}],["html5",{"2":{"93":1}}],["htmlelement",{"2":{"44":1,"45":1,"125":1,"127":1}}],["halfgapbar",{"2":{"117":1,"178":1}}],["halfbar",{"2":{"117":1,"178":1}}],["hanging",{"2":{"84":1,"90":1}}],["hk",{"2":{"112":1,"219":2}}],["hh",{"2":{"72":1}}],["变更为draw",{"2":{"194":1}}],["变更为",{"2":{"194":1}}],["变更为createtooltipdatasource",{"2":{"194":1}}],["变更为createindicator",{"2":{"192":1}}],["变更为calc",{"2":{"194":1}}],["变更为regeneratefigures",{"2":{"194":1}}],["变更为registerindicator",{"2":{"191":1}}],["变更为removeindicator",{"2":{"192":1}}],["变更为overrideindicator",{"2":{"192":1}}],["变更为setoffsetrightdistance",{"2":{"192":1}}],["变更为setstyles",{"2":{"192":1}}],["变更为getindicatorbypaneid",{"2":{"192":1}}],["变更为getstyles",{"2":{"192":1}}],["变更为getdom",{"2":{"192":1}}],["变更为支持任意类型",{"2":{"30":1}}],["变更",{"2":{"30":1}}],["bc1qnwzukszzk5xfk0zs3sr8etzgctgnrtqts43jzp3khe6gm7xazprsp4y6n3",{"2":{"229":1}}],["btc",{"2":{"229":1}}],["berlin",{"2":{"223":2}}],["be",{"2":{"215":1,"217":1,"219":1,"220":1,"221":1,"222":1,"223":1,"224":1}}],["beginpath",{"2":{"110":3}}],["built",{"2":{"221":1}}],["build",{"2":{"213":16}}],["button",{"2":{"215":24,"217":9,"219":9,"220":14,"221":9,"222":9,"223":9,"224":26}}],["buttoncontainer",{"2":{"215":7,"217":4,"219":4,"220":7,"221":4,"222":4,"223":4}}],["bun",{"2":{"181":1}}],["blank和klinecharts",{"2":{"187":1}}],["blue",{"2":{"185":1}}],["bmp",{"2":{"173":1}}],["bbi",{"2":{"115":1}}],["brar",{"2":{"115":1}}],["bias",{"2":{"115":1}}],["b中的k和b",{"2":{"76":1}}],["b",{"2":{"69":2}}],["bash",{"2":{"212":1}}],["bashbun",{"2":{"181":1}}],["bashpnpm",{"2":{"181":1}}],["bashyarn",{"2":{"181":1}}],["bashnpm",{"2":{"181":1}}],["base",{"2":{"224":1}}],["basetitle",{"2":{"224":3}}],["basebuttoncontainer",{"2":{"224":6}}],["baseprice",{"2":{"215":3,"216":3,"217":3,"218":3,"219":3,"220":3,"221":3,"222":3,"223":3,"224":3}}],["baseline",{"2":{"84":2,"90":2,"104":1}}],["basevalue",{"2":{"53":2,"117":1,"152":2,"153":2}}],["background",{"2":{"215":1,"217":1,"219":1,"220":1,"221":1,"222":1,"223":1,"224":1}}],["backgroundcolor",{"0":{"173":1},"2":{"90":2,"104":1,"173":2,"185":7,"222":2}}],["backward",{"2":{"151":1}}],["barcount",{"0":{"140":1,"141":1},"2":{"140":1,"141":1}}],["barspace",{"2":{"53":3,"117":3,"152":1,"153":1,"178":1,"194":1,"220":2}}],["bars",{"2":{"30":1,"185":1,"189":1,"222":2}}],["bar变更为indicator",{"2":{"30":1,"189":1}}],["bar",{"2":{"24":6,"117":1,"178":1,"185":1,"222":2}}],["body>",{"2":{"182":2}}],["boll",{"2":{"115":1,"153":2,"220":1}}],["border",{"2":{"215":2,"217":2,"219":2,"220":2,"221":2,"222":2,"223":2,"224":2}}],["borderradius",{"2":{"89":2,"90":2,"103":1,"104":1,"185":8}}],["borderdashedvalue",{"2":{"86":2,"88":2,"89":2,"90":2,"100":1,"102":1,"103":1,"104":1,"110":2,"153":2,"185":11,"222":4}}],["bordersize是边框尺寸",{"2":{"109":1}}],["bordersize",{"2":{"86":2,"88":2,"89":2,"90":2,"100":1,"102":1,"103":1,"104":1,"109":1,"110":2,"153":2,"185":13,"222":4}}],["borderstyle是边框样式",{"2":{"109":1}}],["borderstyle",{"2":{"30":4,"86":2,"88":2,"89":2,"90":2,"100":1,"102":1,"103":1,"104":1,"109":1,"110":2,"153":2,"185":11,"222":4}}],["bordercolor是边框颜色",{"2":{"109":1}}],["bordercolor",{"2":{"86":2,"88":2,"89":2,"90":2,"100":1,"102":1,"103":1,"104":1,"109":1,"110":2,"185":10}}],["boolean",{"2":{"44":2,"50":1,"53":4,"55":25,"63":1,"64":1,"65":1,"66":1,"67":1,"68":1,"79":1,"80":1,"81":1,"82":1,"83":1,"84":1,"107":1,"117":4,"132":1,"133":1,"134":1,"135":1,"145":1,"146":1,"151":1,"152":7,"153":4,"156":38,"158":19,"167":2,"171":1,"172":1,"173":1,"178":21}}],["bottom",{"2":{"37":1,"39":1,"44":2,"84":1,"90":1,"117":2,"126":1,"152":4,"167":3,"178":1}}],["bounding",{"2":{"37":1,"53":3,"117":4,"152":1,"153":1,"178":1,"194":2}}],["li888",{"2":{"225":1}}],["light",{"2":{"222":3}}],["link",{"2":{"214":1}}],["lint",{"2":{"213":2}}],["liner",{"2":{"215":1}}],["linecolor",{"2":{"185":1}}],["linewidth",{"2":{"110":1}}],["lineto",{"2":{"110":6}}],["linesize",{"2":{"185":1}}],["lines",{"2":{"30":1,"153":1,"185":1,"189":1}}],["line变更为indicator",{"2":{"30":1,"189":1}}],["line",{"0":{"81":1,"87":1,"101":1},"2":{"1":1,"81":1,"87":2,"98":1,"119":2,"120":3,"156":1,"158":1,"185":4,"215":2,"216":2,"217":2,"218":2,"219":2,"220":2,"221":3,"222":4,"223":2,"224":2}}],["liihuu",{"2":{"203":2}}],["let",{"2":{"215":3,"216":3,"217":3,"218":3,"219":3,"220":4,"221":3,"222":3,"223":3,"224":3}}],["length",{"2":{"179":1,"185":2,"215":3,"216":3,"217":3,"218":4,"219":3,"220":3,"221":4,"222":3,"223":3,"224":3}}],["left",{"2":{"37":1,"84":1,"90":1,"117":2,"126":1,"178":1,"185":5,"215":2}}],["loadmoretimer",{"2":{"218":1}}],["loadmore",{"0":{"150":1},"2":{"218":1}}],["lock",{"2":{"55":2,"156":3,"158":3,"178":1}}],["locales",{"0":{"46":1},"2":{"46":2,"112":1}}],["locale",{"0":{"46":1},"2":{"44":2,"46":2}}],["low",{"2":{"42":1,"46":1,"112":1,"145":1,"146":1,"147":1,"148":1,"182":70,"185":3,"215":3,"216":3,"217":3,"218":5,"219":4,"220":3,"221":3,"222":3,"223":3,"224":3}}],["logo",{"2":{"225":1}}],["logarithm",{"2":{"215":1}}],["log",{"2":{"31":1,"32":1,"33":1,"156":14,"158":14,"185":1,"215":1}}],["lang",{"2":{"219":2}}],["lang=",{"2":{"182":1}}],["labels和candle",{"2":{"189":1}}],["layout",{"2":{"38":1,"39":1,"44":2}}],["lastdata",{"2":{"218":2}}],["lastvaluemark",{"2":{"30":1,"185":1}}],["last",{"2":{"30":1,"185":1,"222":2,"224":1}}],["span",{"2":{"220":2,"224":2}}],["space",{"0":{"142":1},"2":{"142":1,"192":1}}],["sub",{"2":{"220":1}}],["subtitle",{"2":{"220":4}}],["subindicators",{"2":{"220":2}}],["subscribeaction",{"0":{"169":1},"2":{"1":1,"145":1,"147":1,"192":1}}],["smooth",{"2":{"185":7}}],["sma",{"2":{"115":1}}],["svelte",{"2":{"182":1}}],["src=",{"2":{"181":1,"182":1}}],["sqrt",{"2":{"179":1,"221":1}}],["samplecircle",{"2":{"179":2}}],["sar",{"2":{"115":1}}],["script>",{"2":{"181":1,"182":6}}],["script",{"2":{"181":1,"182":2}}],["scrolltotimestamp",{"0":{"163":1}}],["scrolltodataindex",{"0":{"162":1}}],["scrolltorealtime",{"0":{"161":1}}],["scrollbydistance",{"0":{"160":1}}],["scrollzoomenabled",{"2":{"44":1,"152":3,"167":3}}],["scale=1",{"2":{"182":1}}],["scale",{"0":{"164":1,"165":1,"166":1},"2":{"164":2,"165":2,"166":2}}],["sort",{"2":{"215":1,"216":1,"217":1,"218":1,"219":1,"220":1,"221":1,"222":1,"223":1,"224":1}}],["solid是实线",{"2":{"109":1}}],["solid",{"2":{"85":1,"86":1,"87":1,"88":1,"89":1,"90":1,"99":1,"100":1,"101":1,"102":1,"103":1,"104":1,"110":1,"152":2,"153":5,"156":1,"158":1,"182":1,"185":37,"217":2,"222":4}}],["source",{"0":{"62":1},"2":{"62":1}}],["situation",{"2":{"215":1,"217":1,"219":1,"220":1,"221":1,"222":1,"223":1,"224":1}}],["simple",{"2":{"187":1}}],["simpletag",{"2":{"176":1}}],["simpleannotation",{"2":{"176":1,"201":1}}],["sign",{"0":{"73":1},"2":{"73":1}}],["size",{"0":{"75":1},"2":{"30":2,"75":1,"84":2,"85":2,"87":2,"90":2,"99":1,"101":1,"104":1,"153":1,"156":1,"158":1,"185":31,"189":2,"215":1,"217":1,"219":1,"220":1,"221":1,"222":1,"223":1,"224":1}}],["ss",{"2":{"72":1}}],["separator",{"2":{"185":1}}],["selector",{"2":{"182":1}}],["segment",{"2":{"156":3,"158":3,"176":1}}],["series",{"2":{"53":2,"117":1,"152":1,"153":3}}],["setindicatortooltipshowtype",{"2":{"224":2}}],["setindicatortooltipshowrule",{"2":{"224":2}}],["setinside",{"2":{"215":2}}],["setcandletooltipshowtype",{"2":{"224":2}}],["setcandletooltipshowrule",{"2":{"224":2}}],["setcustomapi",{"2":{"30":1}}],["setmainindicator",{"2":{"220":2}}],["setmaxoffsetrightdistance",{"0":{"139":1}}],["setmaxoffsetleftdistance",{"0":{"138":1}}],["setreverse",{"2":{"215":2}}],["setrightminvisiblebarcount",{"0":{"141":1}}],["settheme",{"2":{"222":2}}],["settimeout",{"2":{"218":2}}],["settimezone",{"0":{"130":1},"2":{"223":3}}],["settype",{"2":{"215":2,"217":2}}],["setoffsetrightspace",{"2":{"192":1}}],["setoffsetrightdistance",{"0":{"136":1}}],["setup>",{"2":{"182":1}}],["setbarspace",{"0":{"142":1}}],["setsubindicator",{"2":{"220":2}}],["setstyleoptions",{"2":{"192":1}}],["setstyles",{"0":{"127":1},"2":{"198":1,"215":4,"217":1,"222":1,"224":4}}],["setscrollenabled",{"0":{"134":1}}],["setzoomenabled",{"0":{"132":1}}],["setposition",{"2":{"215":2}}],["setpricevolumeprecision",{"0":{"129":1}}],["setpaneoptions",{"0":{"41":1,"167":1},"2":{"38":1,"167":1}}],["setlang",{"2":{"219":2}}],["setloaddatacallback",{"0":{"151":1},"2":{"150":1}}],["setlocale",{"2":{"30":1,"219":1}}],["setleftminvisiblebarcount",{"0":{"140":1}}],["setlinedash",{"2":{"110":2}}],["shape",{"2":{"188":1}}],["shanghai",{"2":{"44":1,"130":1,"223":2}}],["shift",{"2":{"95":4}}],["showparams",{"2":{"185":1}}],["showtype",{"2":{"185":2,"224":4}}],["showrule",{"2":{"185":2,"224":4}}],["show",{"2":{"185":27}}],["showname",{"2":{"153":1,"185":1}}],["shouldformatbignumber",{"2":{"53":2,"117":1,"152":1,"153":3}}],["shouldohlc",{"2":{"53":2,"117":1,"152":1,"153":3}}],["shortname",{"2":{"53":2,"117":1,"120":1,"152":1,"153":2}}],["standard",{"2":{"185":4,"224":2}}],["start",{"2":{"84":1,"90":1,"182":3}}],["startangle",{"2":{"79":2,"85":2,"99":1}}],["straightline",{"2":{"176":1}}],["strokestyle",{"2":{"110":1}}],["stroke只有边框",{"2":{"109":1}}],["stroke",{"2":{"86":2,"88":2,"89":2,"90":2,"100":2,"102":2,"103":2,"104":2,"109":2,"110":4,"152":4,"153":4,"179":1,"185":25,"217":6,"221":1}}],["strong",{"2":{"55":2,"156":2,"158":2,"178":2}}],["string>",{"2":{"44":1}}],["string",{"2":{"37":5,"44":11,"45":1,"46":7,"47":1,"48":1,"49":1,"50":1,"51":1,"52":1,"53":16,"54":1,"55":13,"56":1,"57":3,"58":3,"59":1,"69":1,"70":2,"71":2,"72":2,"73":3,"74":2,"75":3,"84":3,"85":1,"86":2,"87":1,"88":2,"89":2,"90":5,"99":1,"100":2,"101":1,"102":2,"103":2,"104":5,"107":1,"117":14,"125":1,"126":1,"127":1,"130":1,"131":1,"152":22,"153":19,"154":2,"155":2,"156":10,"157":1,"158":4,"159":4,"167":2,"171":1,"172":1,"173":3,"178":6}}],["style=",{"2":{"182":7,"215":1,"216":1,"217":1,"218":1,"219":1,"220":1,"221":1,"222":1,"223":1,"224":1}}],["style是样式类型",{"2":{"109":1}}],["style",{"2":{"85":2,"86":2,"87":2,"88":2,"89":2,"90":2,"99":1,"100":1,"101":1,"102":1,"103":1,"104":1,"109":1,"110":5,"152":2,"153":5,"156":1,"158":1,"179":1,"185":23,"220":1,"221":1,"222":6}}],["styles",{"0":{"49":1,"84":1,"85":1,"86":1,"87":1,"88":1,"89":1,"90":1,"91":1,"127":1},"2":{"44":2,"49":2,"50":2,"53":4,"55":8,"84":2,"85":2,"86":2,"87":2,"88":2,"89":2,"90":2,"91":2,"97":2,"99":1,"100":1,"101":1,"102":1,"103":1,"104":1,"107":1,"110":4,"117":2,"127":2,"152":3,"153":5,"156":3,"158":3,"178":3,"179":1,"183":1,"192":2,"194":1,"221":1}}],["style选项变更为solid和dashed",{"2":{"30":1}}],["rules",{"2":{"224":3}}],["run",{"2":{"213":10}}],["rise",{"2":{"222":6}}],["rippleradius",{"2":{"185":1}}],["ripplecolor",{"2":{"185":1}}],["right",{"2":{"37":1,"84":1,"90":1,"117":2,"126":1,"178":1,"185":4,"215":2}}],["rigisteroverlay",{"2":{"30":1}}],["rgba",{"2":{"185":17,"222":2}}],["random",{"2":{"215":4,"216":4,"217":4,"218":6,"219":4,"220":5,"221":4,"222":4,"223":4,"224":4}}],["range",{"2":{"37":2}}],["radius",{"2":{"179":2,"185":2,"215":1,"217":1,"219":1,"220":1,"221":3,"222":1,"223":1,"224":1}}],["rayline",{"2":{"176":1}}],["round",{"2":{"215":3,"216":3,"217":3,"218":4,"219":3,"220":3,"221":3,"222":3,"223":3,"224":3}}],["root",{"2":{"125":1,"126":1}}],["roc",{"2":{"115":1}}],["rsi",{"2":{"115":1}}],["r",{"2":{"79":2,"80":2,"85":2,"86":2,"99":1,"100":1,"179":1,"221":1}}],["red",{"2":{"222":15}}],["result",{"2":{"220":3}}],["resize",{"0":{"174":1}}],["reverse",{"2":{"185":1,"215":5}}],["react",{"2":{"182":1}}],["reactvueangularpreactsolidsveltevanilla",{"2":{"182":1}}],["realdataindex",{"2":{"117":1}}],["realx",{"2":{"117":1}}],["realrange",{"2":{"37":1}}],["realto",{"2":{"37":1,"117":2,"144":1}}],["realfrom",{"2":{"37":1,"117":2,"144":1}}],["reference",{"2":{"178":1}}],["return",{"2":{"110":1,"120":4,"156":1,"158":1,"179":2,"182":5,"215":1,"216":1,"217":1,"218":1,"219":1,"220":3,"221":3,"222":1,"223":1,"224":1}}],["regularity",{"2":{"215":1}}],["regeneratefigures",{"2":{"53":2,"117":1,"120":1,"152":1,"153":3}}],["registerfigure全局添加",{"2":{"106":1}}],["registerfigure",{"0":{"50":1}}],["registeryaxis",{"0":{"58":1},"2":{"36":1,"152":1}}],["registerxaxis",{"0":{"57":1},"2":{"36":1}}],["registerstyles注册的样式名",{"2":{"44":1}}],["registerstyles",{"0":{"49":1},"2":{"30":1,"222":3}}],["registerlocale",{"0":{"46":1},"2":{"30":1,"112":2,"219":2}}],["registeroverlay",{"0":{"55":1},"2":{"5":1,"177":1,"221":2}}],["registerindicator全局添加",{"2":{"116":1}}],["registerindicator",{"0":{"53":1},"2":{"5":1,"220":2}}],["removetechnicalindicator",{"2":{"192":1}}],["removetag",{"2":{"30":1,"192":1}}],["remove",{"0":{"159":1},"2":{"159":1}}],["removeindicator",{"0":{"155":1}}],["removehtml",{"2":{"30":1,"192":1}}],["removeannotation",{"2":{"30":1,"192":1}}],["removeoverlay",{"0":{"159":1},"2":{"30":1}}],["recttext",{"0":{"91":1,"105":1},"2":{"98":1,"185":1}}],["rect",{"0":{"83":1,"89":1,"103":1},"2":{"1":1,"24":2,"83":2,"89":2,"98":1,"117":1,"185":4,"210":1,"224":2}}],["滚动到指定时间戳",{"2":{"163":1}}],["滚动到指定的位置",{"2":{"162":1}}],["滚动到最初的位置",{"2":{"161":1}}],["滚动一定的距离",{"2":{"160":1}}],["滚动",{"2":{"30":1}}],["新特性",{"2":{"30":1}}],["新增candle",{"2":{"30":1}}],["新增实例方法",{"2":{"30":1}}],["新增基图表方法registerfigure",{"2":{"30":1}}],["新增y轴方向缩放",{"2":{"30":1}}],["新增figurekey和figureindex",{"2":{"25":1}}],["新增options",{"2":{"21":1}}],["新增图表api",{"2":{"21":1}}],["新增属性modesensitivity",{"2":{"19":1}}],["新增",{"2":{"7":1}}],["新增回调参数",{"2":{"1":1}}],["日志输出",{"2":{"24":1}}],["ue900",{"2":{"185":2}}],["utf",{"2":{"182":1}}],["utils",{"0":{"60":1,"61":1,"62":1,"63":1,"64":1,"65":1,"66":1,"67":1,"68":1,"69":1,"70":1,"71":1,"72":1,"73":1,"74":1,"75":1,"76":1,"77":1,"78":1,"79":1,"80":1,"81":1,"82":1,"83":1,"84":1,"85":1,"86":1,"87":1,"88":1,"89":1,"90":1,"91":1},"1":{"61":1,"62":1,"63":1,"64":1,"65":1,"66":1,"67":1,"68":1,"69":1,"70":1,"71":1,"72":1,"73":1,"74":1,"75":1,"76":1,"77":1,"78":1,"79":1,"80":1,"81":1,"82":1,"83":1,"84":1,"85":1,"86":1,"87":1,"88":1,"89":1,"90":1,"91":1},"2":{"21":1,"24":2,"193":1}}],["umd",{"2":{"181":2,"182":1,"213":11}}],["unsubscribeaction",{"0":{"170":1}}],["usdt",{"2":{"229":2}}],["useeffect",{"2":{"182":4}}],["us和zh",{"2":{"111":1}}],["us",{"2":{"44":1,"46":1,"111":1,"219":1}}],["up",{"2":{"185":1,"217":2}}],["upcolor",{"2":{"153":2,"185":5,"222":10}}],["updatedata",{"0":{"147":1},"2":{"218":4}}],["upwickcolor",{"2":{"24":1,"185":1,"222":2}}],["upbordercolor",{"2":{"24":1,"185":1,"222":2}}],["fruits",{"2":{"220":2}}],["from",{"2":{"37":1,"117":2,"144":1,"182":11,"187":1,"215":1,"216":1,"217":1,"218":1,"219":1,"220":3,"221":1,"222":1,"223":1,"224":1}}],["flex",{"2":{"215":2,"217":2,"219":2,"220":2,"221":2,"222":2,"223":2,"224":2}}],["floor",{"2":{"215":1,"216":1,"217":1,"218":1,"219":1,"220":2,"221":1,"222":1,"223":1,"224":1}}],["fefefe",{"2":{"185":1}}],["f2f3f5",{"2":{"185":1}}],["foxmail",{"2":{"225":1}}],["font",{"2":{"215":1,"217":1,"219":1,"220":2,"221":1,"222":1,"223":1,"224":1}}],["fontfamily",{"2":{"185":2}}],["following",{"2":{"215":1,"217":1,"219":1,"220":1,"221":1,"222":1,"223":1,"224":1}}],["follow",{"2":{"185":2,"224":2}}],["for",{"2":{"215":3,"216":2,"217":3,"218":2,"219":3,"220":4,"221":3,"222":3,"223":3,"224":3}}],["forward",{"2":{"151":1}}],["foreach",{"2":{"120":1,"215":4,"217":1,"219":1,"220":2,"221":1,"222":1,"223":1,"224":4}}],["formatfolddecimal",{"0":{"74":1}}],["formatthousands",{"0":{"73":1}}],["format格式",{"2":{"72":1}}],["formatprecision",{"0":{"70":1}}],["formatvalue",{"0":{"69":1},"2":{"69":1}}],["format",{"0":{"72":1},"2":{"44":1,"72":1}}],["formatdate",{"0":{"72":1},"2":{"44":2}}],["formatbignumber",{"0":{"71":1},"2":{"24":1,"44":2}}],["fff",{"2":{"215":1,"217":1,"219":1,"220":1,"221":1,"222":1,"223":1,"224":1}}],["ffffff",{"2":{"173":1,"185":6,"222":1}}],["ff9600",{"2":{"153":1,"185":1}}],["function",{"2":{"156":14,"158":14,"182":1,"215":5,"216":1,"217":2,"218":2,"219":2,"220":3,"221":2,"222":2,"223":2,"224":5}}],["f00",{"2":{"156":1,"158":1}}],["fish2016",{"2":{"207":1}}],["fixed",{"2":{"185":2}}],["fibonacciline",{"2":{"176":1}}],["finder",{"0":{"171":1,"172":1},"2":{"171":2,"172":2,"192":2}}],["filltext",{"2":{"220":1}}],["fillstyle",{"2":{"110":1}}],["fill又有边框又有背景",{"2":{"109":1}}],["fill只有背景",{"2":{"109":1}}],["fill`",{"2":{"100":1,"102":1,"103":1,"104":1}}],["fill",{"2":{"86":2,"88":2,"89":2,"90":2,"100":2,"102":2,"103":2,"104":2,"109":2,"110":5,"152":4,"153":6,"179":1,"185":34,"221":1,"222":4}}],["figure",{"0":{"50":1},"2":{"50":2,"52":1,"97":2,"99":1,"100":1,"101":1,"102":1,"103":1,"104":1,"210":1}}],["figures",{"2":{"1":1,"53":2,"117":1,"119":2,"120":3,"152":1,"153":3,"220":1}}],["fall",{"2":{"222":6}}],["false",{"2":{"40":1,"152":1,"153":1,"156":5,"158":5,"185":11,"215":2,"220":1,"224":1}}],["family",{"0":{"75":1},"2":{"75":1,"84":2,"90":2,"104":1,"185":10}}],["f92855",{"2":{"23":1,"185":4,"222":1}}],["erc20",{"2":{"229":1}}],["eth",{"2":{"229":1}}],["europe",{"2":{"223":1}}],["esm",{"2":{"213":5}}],["e11d74",{"2":{"185":1}}],["ededed",{"2":{"185":2}}],["extension",{"2":{"191":1}}],["extenddata",{"2":{"5":1,"53":2,"55":2,"117":1,"152":1,"153":3,"156":3,"158":3,"178":1}}],["export",{"2":{"182":4}}],["executeaction",{"0":{"168":1}}],["ef5350",{"2":{"153":2}}],["ef5350变更为",{"2":{"23":1}}],["english",{"2":{"219":1}}],["en",{"2":{"219":1}}],["enabled",{"0":{"132":1,"134":1},"2":{"132":1,"134":1}}],["end",{"2":{"84":1,"90":1}}],["endangle",{"2":{"79":2,"85":2,"99":1}}],["emoji",{"2":{"220":3}}],["ema",{"2":{"115":1}}],["emv",{"2":{"42":1,"115":1}}],["else",{"2":{"110":1,"222":1}}],["event",{"2":{"55":14,"156":56,"158":42,"178":14}}],["↩️",{"2":{"18":1}}],["样式",{"2":{"53":1,"55":1,"84":1,"85":1,"86":2,"87":1,"88":2,"89":2,"90":2,"97":1,"99":1,"100":1,"101":1,"102":1,"103":1,"104":1,"109":1,"117":5,"153":1,"158":1,"178":3}}],["样式名",{"2":{"49":1}}],["样式列表",{"2":{"44":1}}],["样式配置调整",{"0":{"189":1}}],["样式配置",{"0":{"183":1},"1":{"184":1,"185":1},"2":{"30":3,"49":1,"127":1}}],["样式配置新增candle",{"2":{"24":1}}],["样式配置candle",{"2":{"18":1,"19":1}}],["样式candle",{"2":{"14":1}}],["v9",{"0":{"186":1},"1":{"187":1,"188":1,"189":1,"190":1,"191":1,"192":1,"193":1,"194":1}}],["v8",{"0":{"186":1},"1":{"187":1,"188":1,"189":1,"190":1,"191":1,"192":1,"193":1,"194":1}}],["var",{"2":{"182":1}}],["values",{"2":{"53":1,"117":1,"152":1,"153":1,"189":1,"194":1}}],["value",{"0":{"63":1,"64":1,"65":1,"66":1,"67":1,"68":1,"69":1,"70":1,"71":1,"73":1,"74":1,"152":1,"156":1,"171":1},"2":{"14":1,"21":1,"37":2,"38":1,"44":1,"53":1,"55":1,"57":1,"58":1,"63":1,"64":1,"65":1,"66":1,"67":1,"68":1,"70":1,"71":1,"73":1,"74":1,"117":1,"152":3,"153":1,"156":6,"158":3,"171":5,"172":2,"178":3,"185":13,"192":5,"194":2}}],["vite",{"2":{"214":1}}],["view",{"2":{"210":2}}],["viewport",{"2":{"182":1,"194":2}}],["visiblerange",{"2":{"117":2,"194":2,"220":2}}],["visible",{"2":{"53":2,"55":2,"117":1,"152":1,"153":3,"156":3,"158":3,"178":1}}],["vue",{"2":{"182":1}}],["vr",{"2":{"115":1}}],["v10之后会删除",{"2":{"91":1,"105":1}}],["version",{"0":{"59":1}}],["verticalstraightline",{"2":{"176":1}}],["verticalsegment",{"2":{"176":1}}],["verticalrayline",{"2":{"176":1}}],["vertical",{"2":{"15":1,"30":1,"185":2}}],["vol",{"2":{"115":1,"220":1,"222":1,"224":1}}],["volumeprecision",{"0":{"129":1},"2":{"129":2,"197":1}}],["volume",{"2":{"42":1,"46":1,"53":2,"112":1,"117":1,"129":1,"145":1,"146":1,"147":1,"148":1,"152":1,"153":2,"178":1,"182":70,"185":2,"215":3,"216":3,"217":3,"218":4,"219":4,"220":3,"221":3,"222":3,"223":3,"224":3}}],["void",{"2":{"45":1,"46":1,"49":1,"50":2,"53":1,"55":3,"57":1,"58":1,"62":1,"85":1,"86":1,"87":1,"88":1,"89":1,"90":1,"107":1,"129":1,"130":1,"132":1,"134":1,"136":1,"138":1,"139":1,"140":1,"141":1,"142":1,"145":2,"146":2,"147":2,"149":1,"150":2,"151":3,"152":1,"153":2,"159":1,"160":1,"161":1,"162":1,"163":1,"164":1,"165":1,"166":1,"167":1,"168":2,"169":2,"170":2,"174":1,"178":2,"182":2}}],["4px",{"2":{"215":1,"217":1,"219":1,"220":1,"221":1,"222":1,"223":1,"224":1}}],["430px",{"2":{"215":1,"216":1,"217":1,"218":1,"219":1,"220":1,"221":1,"222":1,"223":1,"224":1}}],["45",{"2":{"185":3,"222":1}}],["42",{"2":{"182":7}}],["4986",{"2":{"182":7}}],["4980",{"2":{"182":7}}],["4988",{"2":{"182":7}}],["4985",{"2":{"182":7}}],["4981",{"2":{"182":14}}],["4964",{"2":{"182":21}}],["4961",{"2":{"182":35}}],["4963",{"2":{"182":7}}],["4962",{"2":{"182":7}}],["4968",{"2":{"182":14}}],["4966",{"2":{"182":14}}],["4975",{"2":{"182":7}}],["4974",{"2":{"182":7}}],["4973",{"2":{"182":14}}],["4971",{"2":{"182":7}}],["4979",{"2":{"182":21}}],["4972",{"2":{"182":21}}],["4970",{"2":{"182":7}}],["4977",{"2":{"182":42}}],["4976",{"2":{"182":14}}],["40",{"2":{"115":1,"185":3,"222":1}}],["4",{"0":{"15":1,"20":1,"35":1},"2":{"35":1,"153":1,"185":48,"215":2,"216":2,"217":2,"218":2,"219":2,"220":2,"221":2,"222":2,"223":2,"224":2}}],["items",{"2":{"215":1,"217":3,"219":3,"220":1,"221":3,"222":3,"223":3,"224":1}}],["i++",{"2":{"215":1,"216":1,"217":1,"218":1,"219":1,"220":2,"221":1,"222":1,"223":1,"224":1}}],["iconfont",{"2":{"185":2}}],["icon",{"2":{"185":4}}],["icons",{"2":{"30":2,"185":2}}],["implements",{"2":{"182":1}}],["import",{"2":{"182":7,"215":1,"217":1,"219":1,"220":1,"221":1,"222":1,"223":1,"224":1}}],["i",{"2":{"120":5,"215":2,"216":2,"217":2,"218":2,"219":2,"220":6,"221":2,"222":2,"223":2,"224":2}}],["if",{"2":{"110":3,"120":1,"179":1,"221":1,"222":2}}],["ignoreevent",{"2":{"55":6,"178":2}}],["id=",{"2":{"182":7,"215":2,"216":1,"217":2,"218":1,"219":2,"220":2,"221":2,"222":2,"223":2,"224":2}}],["ideographic",{"2":{"84":1,"90":1}}],["id",{"0":{"157":1},"2":{"41":1,"44":1,"152":3,"156":3,"157":2,"158":3,"159":2,"167":3,"185":4,"192":2,"220":1,"224":1}}],["info",{"2":{"224":2}}],["innertext",{"2":{"215":4,"217":1,"219":1,"220":4,"221":1,"222":1,"223":1,"224":6}}],["in",{"2":{"215":2,"217":2,"219":2,"220":2,"221":3,"222":2,"223":2,"224":2}}],["index",{"2":{"187":2,"214":1,"215":1,"217":1,"219":1,"220":1,"221":1,"222":1,"223":1,"224":1}}],["indicatortitle",{"2":{"224":3}}],["indicatorbuttoncontainer",{"2":{"224":6}}],["indicatorfigure",{"2":{"117":1}}],["indicatorfigurestyle",{"2":{"117":1}}],["indicatorfigureattrs",{"2":{"117":1}}],["indicatorfigureattrscallbackcoordinate",{"2":{"117":1}}],["indicatorfigureattrscallbackdata",{"2":{"117":1}}],["indicatorstyle",{"2":{"117":4}}],["indicatordata",{"2":{"117":3}}],["indicator",{"0":{"53":1},"2":{"7":1,"30":2,"44":2,"53":5,"117":8,"152":3,"153":3,"185":1,"194":3,"220":4,"222":2,"224":3}}],["insideoutside",{"2":{"215":2}}],["inside",{"2":{"185":1,"215":3}}],["install",{"2":{"181":2,"212":1}}],["includeoverlay",{"0":{"173":1},"2":{"173":2}}],["intl",{"2":{"44":1,"72":1,"178":2}}],["initial",{"2":{"182":1}}],["init",{"0":{"39":1,"44":1},"2":{"38":1,"113":1,"182":12,"215":2,"216":2,"217":2,"218":2,"219":2,"220":2,"221":2,"222":2,"223":2,"224":2}}],["is",{"2":{"215":1,"217":1,"219":1,"220":1,"221":1,"222":1,"223":1,"224":1}}],["isdashed合并成styles",{"2":{"194":1}}],["issues",{"2":{"203":2}}],["isscrollenabled",{"0":{"135":1}}],["isstroke",{"2":{"194":1}}],["isstring",{"0":{"63":1}}],["isstack",{"0":{"152":1},"2":{"14":1,"21":1,"38":1,"152":2,"192":2}}],["iszoomenabled",{"0":{"133":1}}],["isboolean",{"0":{"68":1}}],["isfunction",{"0":{"67":1}}],["isobject",{"0":{"66":1}}],["isvalid",{"0":{"65":1}}],["isvalid和klinecharts",{"2":{"24":1}}],["isnumber",{"0":{"64":1}}],["dts",{"2":{"213":2}}],["d9d9d9",{"2":{"185":6}}],["d>>",{"2":{"117":1}}],["dma",{"2":{"115":1}}],["dmi",{"2":{"115":1}}],["div>",{"2":{"182":1,"215":1,"217":1,"219":1,"220":1,"221":1,"222":1,"223":1,"224":1}}],["div",{"2":{"182":7,"215":3,"216":1,"217":3,"218":1,"219":3,"220":3,"221":3,"222":3,"223":3,"224":4}}],["display",{"2":{"215":1,"217":1,"219":1,"220":1,"221":1,"222":1,"223":1,"224":2}}],["dispose",{"0":{"45":1},"2":{"182":11}}],["discussions",{"2":{"203":2}}],["dist",{"2":{"181":1,"182":1}}],["distance",{"0":{"136":1,"160":1},"2":{"136":1,"138":1,"139":1,"160":2,"161":1,"192":1}}],["diamond",{"2":{"110":1}}],["dark",{"2":{"222":3}}],["dashvalue更改为dashedvalue",{"2":{"189":1}}],["dashed是虚线",{"2":{"109":1}}],["dashedvalue是虚线值",{"2":{"109":1}}],["dashedvalue",{"2":{"85":2,"87":2,"99":1,"101":1,"109":1,"153":1,"156":1,"158":1,"185":12}}],["dashed",{"2":{"85":1,"86":1,"87":1,"88":1,"89":1,"90":1,"99":1,"100":1,"101":1,"102":1,"103":1,"104":1,"110":1,"152":2,"153":2,"185":22}}],["date",{"2":{"215":1,"216":1,"217":1,"218":1,"219":1,"220":1,"221":1,"222":1,"223":1,"224":1}}],["datetimeformat",{"0":{"72":1},"2":{"44":2,"72":2,"178":3}}],["datasource",{"2":{"194":2}}],["dataindex",{"0":{"162":1,"165":1},"2":{"55":1,"117":1,"156":2,"158":1,"162":2,"165":2,"171":3,"172":2,"178":3}}],["datalist",{"0":{"145":1,"146":1},"2":{"42":2,"53":1,"117":1,"145":2,"146":2,"151":1,"152":1,"153":1,"215":3,"216":3,"217":3,"218":6,"219":3,"220":3,"221":3,"222":3,"223":3,"224":3}}],["data",{"0":{"147":1,"168":1},"2":{"1":1,"42":1,"53":3,"69":1,"117":2,"147":2,"151":2,"152":3,"153":3,"168":2,"169":1,"170":1,"220":3}}],["dd",{"2":{"72":1}}],["drawtext",{"0":{"90":1},"2":{"91":2}}],["drawrecttext",{"0":{"91":1}}],["drawrect",{"0":{"89":1}}],["drawpolygon",{"0":{"88":1}}],["drawline",{"0":{"87":1}}],["drawcircle",{"0":{"86":1}}],["drawarc",{"0":{"85":1}}],["draw",{"2":{"50":2,"53":2,"97":1,"107":1,"110":1,"117":1,"152":1,"153":3,"220":1}}],["dragenabled",{"2":{"44":1,"152":3,"167":3}}],["dcs",{"0":{"45":1},"2":{"45":2}}],["document",{"2":{"215":6,"217":3,"219":3,"220":6,"221":3,"222":5,"223":3,"224":9}}],["doctype",{"2":{"182":1}}],["docs",{"2":{"178":1}}],["domid",{"2":{"39":2}}],["down",{"2":{"185":1,"217":2}}],["downcolor",{"2":{"153":2,"185":5,"222":10}}],["downwickcolor",{"2":{"24":1,"185":1,"222":2}}],["downbordercolor",{"2":{"24":1,"185":1,"222":2}}],["demonstration",{"2":{"215":1,"217":1,"219":1,"220":1,"221":1,"222":1,"223":1,"224":1}}],["dev",{"2":{"213":3}}],["developer",{"2":{"178":1}}],["description",{"2":{"182":1}}],["decimalfoldthreshold",{"2":{"44":2,"178":1}}],["default",{"2":{"152":1,"167":1,"182":3}}],["defaultvalue",{"0":{"69":1},"2":{"69":1,"185":2}}],["defaultstyles",{"2":{"53":2,"117":3,"152":2,"153":2,"178":1,"194":3}}],["defaultticks",{"2":{"37":1}}],["defaultzlevel和zlevel",{"2":{"20":1}}],["deeprequired",{"2":{"25":1}}],["ds",{"0":{"44":1},"2":{"14":1,"38":1,"44":2,"183":1}}],["图解说明",{"0":{"184":1}}],["图形辅助api",{"0":{"193":1}}],["图形类型",{"2":{"117":1,"178":1}}],["图形的样式",{"2":{"107":2}}],["图形的属性",{"2":{"107":2}}],["图形配置",{"2":{"53":1,"153":1}}],["图形名字",{"2":{"107":1}}],["图形名",{"2":{"52":1}}],["图形属性支持数组",{"2":{"7":1}}],["图表支持自定义技术指标",{"2":{"200":1}}],["图表支持自定义坐标轴",{"2":{"36":1}}],["图表默认价格精度为两位小数",{"2":{"197":1}}],["图表总是会填充容器",{"2":{"196":1}}],["图表之间的分割线",{"2":{"185":1}}],["图表上看到的不管是点还是线",{"2":{"183":1}}],["图表上所有的元素都是由基础图形组成",{"2":{"96":1}}],["图表不会重绘",{"2":{"149":1}}],["图表内置了基础图形",{"2":{"179":1}}],["图表内置了这些基础图形",{"2":{"98":1}}],["图表内置了zh",{"2":{"46":1}}],["图表基于",{"2":{"93":1}}],["图表将不再可用",{"2":{"45":1}}],["图表所需要的数据必须是固定格式",{"2":{"42":1}}],["图表实例方法subscribeaction和unsubscribeaction类型新增oncandlebarclick",{"2":{"28":1}}],["图表api",{"0":{"43":1,"191":1},"1":{"44":1,"45":1,"46":1,"47":1,"48":1,"49":1,"50":1,"51":1,"52":1,"53":1,"54":1,"55":1,"56":1,"57":1,"58":1,"59":1,"60":1,"61":1,"62":1,"63":1,"64":1,"65":1,"66":1,"67":1,"68":1,"69":1,"70":1,"71":1,"72":1,"73":1,"74":1,"75":1,"76":1,"77":1,"78":1,"79":1,"80":1,"81":1,"82":1,"83":1,"84":1,"85":1,"86":1,"87":1,"88":1,"89":1,"90":1,"91":1},"2":{"21":1}}],["图表方法extension",{"2":{"30":2}}],["图表方法新增getoverlayclass",{"2":{"18":1}}],["图表方法init",{"2":{"14":1}}],["显示",{"2":{"11":1}}],["me",{"2":{"204":1}}],["meta",{"2":{"182":5}}],["merge",{"0":{"62":1}}],["merge实现",{"2":{"14":1}}],["mtm",{"2":{"115":1}}],["middle",{"2":{"84":1,"90":1,"185":2}}],["min",{"2":{"181":1,"182":1,"218":1}}],["minheight",{"2":{"44":1,"152":3,"167":3}}],["minvalue",{"2":{"11":1,"53":2,"117":1,"152":1,"153":3}}],["mm",{"2":{"72":2}}],["mozilla",{"2":{"178":1}}],["moveto",{"2":{"110":2}}],["modesensitivity",{"2":{"55":2,"156":3,"158":3,"178":1}}],["mode",{"2":{"55":3,"156":3,"158":4,"178":3}}],["more",{"0":{"145":1,"146":1},"2":{"42":2,"145":2,"146":2,"151":1}}],["max",{"2":{"218":1}}],["maxvalue",{"2":{"11":1,"53":2,"117":1,"152":1,"153":3}}],["made",{"2":{"215":1,"217":1,"219":1,"220":1,"221":1,"222":1,"223":1,"224":1}}],["maintitle",{"2":{"220":3}}],["mainindicators",{"2":{"220":2}}],["main和yaxis",{"2":{"192":1}}],["main",{"2":{"125":2,"126":2,"220":1}}],["map",{"2":{"120":2,"220":1}}],["ma5",{"2":{"119":2,"120":1}}],["ma2",{"2":{"119":2,"120":2}}],["ma10",{"2":{"119":3,"120":1}}],["ma1",{"2":{"119":3,"120":2}}],["macd",{"2":{"115":1,"220":1}}],["math",{"2":{"110":2,"179":3,"215":8,"216":8,"217":8,"218":13,"219":8,"220":10,"221":11,"222":8,"223":8,"224":8}}],["magnet`",{"2":{"178":2}}],["magnet",{"2":{"55":5,"156":5,"158":6,"178":5}}],["ma",{"2":{"40":1,"115":1,"118":1,"119":1,"120":5,"152":1,"220":1,"224":1}}],["marginbottom",{"2":{"185":4}}],["marginright",{"2":{"185":4}}],["margintop",{"2":{"185":4}}],["marginleft",{"2":{"185":4}}],["margin",{"2":{"30":2,"215":1,"217":1,"219":1,"220":1,"221":1,"222":1,"223":1,"224":2}}],["marginend",{"2":{"30":2,"185":2,"189":2}}],["marginstart",{"2":{"30":2,"185":2,"189":2}}],["导致图表无法初始化问题",{"2":{"9":1}}],["导致小数折叠不对问题",{"2":{"5":1}}],["可用于扩展字段",{"2":{"178":1}}],["可缺省",{"2":{"145":1,"146":1,"152":5,"154":1,"156":1,"164":1,"167":4,"173":3,"178":16}}],["可见区域信息",{"2":{"117":2}}],["可选项为`normal`",{"2":{"178":1}}],["可选项为",{"2":{"169":1,"170":1}}],["可选项`fill`",{"2":{"100":1,"102":1,"103":1,"104":1}}],["可选项`solid`",{"2":{"99":1,"101":1}}],["可选项有",{"2":{"53":1,"55":1,"153":1,"158":1}}],["可选配置项",{"2":{"44":1}}],["可以使用覆盖物",{"2":{"201":1}}],["可以直接使用",{"2":{"179":1}}],["可以缺省",{"2":{"160":1,"161":1,"162":1,"163":1,"164":1,"165":1,"166":1}}],["可以通过图表api",{"2":{"113":1}}],["可以通过图表方法createindicator或者overrideindicator重写calc即可",{"2":{"199":1}}],["可以通过图表方法init",{"2":{"183":1}}],["可以通过图表方法",{"2":{"36":1}}],["可以这样做",{"2":{"112":1}}],["可以参考下面的方案",{"2":{"111":1}}],["可以定义两个选项solid和dashed",{"2":{"109":1}}],["可以是国际化的",{"2":{"185":1}}],["可以是回调方法也可以是数组",{"2":{"185":1}}],["可以是当个对象",{"2":{"171":1,"172":1}}],["可以是单个id",{"2":{"159":1}}],["可以是通过registerstyles注册进去的样式名",{"2":{"127":1}}],["可以是通过klinecharts",{"2":{"44":1}}],["可以是一个promise",{"2":{"117":1}}],["可以是dom元素",{"2":{"45":1}}],["可以是dom元素或者元素id",{"2":{"44":1}}],["可以无法拖动问题",{"2":{"5":1}}],["可能不对问题",{"2":{"8":1}}],["america",{"2":{"223":1}}],["actual",{"2":{"215":1,"217":1,"219":1,"220":1,"221":1,"222":1,"223":1,"224":1}}],["activeradius",{"2":{"185":1}}],["activebordersize",{"2":{"185":1}}],["activebordercolor",{"2":{"185":1}}],["activebackgroundcolor",{"2":{"185":3}}],["activecolor",{"2":{"185":1}}],["according",{"2":{"215":1,"217":1,"219":1,"220":1,"221":1,"222":1,"223":1,"224":1}}],["adjustments",{"2":{"215":1,"217":1,"219":1,"220":1,"221":1,"222":1,"223":1,"224":1}}],["addeventlistener",{"2":{"215":4,"217":1,"219":1,"220":2,"221":1,"222":1,"223":1,"224":4}}],["add",{"2":{"181":2}}],["addshapetemplate",{"2":{"30":1,"191":1}}],["addshapetemplate变更为registeroverlay",{"2":{"30":1}}],["addtechnicalindicatortemplate",{"2":{"30":1,"191":1}}],["addtechnicalindicatortemplate变更为registerindicator",{"2":{"30":1}}],["assisting",{"2":{"215":1,"217":1,"219":1,"220":1,"221":1,"222":1,"223":1,"224":1}}],["asia",{"2":{"44":1,"130":1,"223":1}}],["auto",{"2":{"185":2}}],["afterviewinit",{"2":{"182":2}}],["ao",{"2":{"115":1}}],["absoluteyaxis变更为finder",{"2":{"192":1}}],["absolute",{"2":{"171":2,"172":2,"192":1}}],["abs",{"2":{"110":2,"179":2,"221":2}}],["alphagreen",{"2":{"222":7}}],["alphared",{"2":{"222":7}}],["alphabetic",{"2":{"84":1,"90":1}}],["all",{"2":{"217":2}}],["always",{"2":{"185":4,"224":2}}],["align",{"2":{"84":2,"90":2,"104":1,"215":1,"217":1,"219":1,"220":1,"221":1,"222":1,"223":1,"224":1}}],["area",{"2":{"185":2,"198":1,"217":2}}],["arc",{"0":{"79":1,"85":1,"99":1},"2":{"79":2,"85":2,"97":1,"98":1,"185":1}}],["array",{"2":{"37":2,"44":2,"53":3,"55":4,"57":1,"58":1,"78":1,"81":1,"82":1,"86":1,"87":1,"88":2,"89":1,"101":1,"102":1,"117":5,"145":1,"146":1,"148":1,"152":3,"153":3,"156":3,"158":1,"171":2,"172":2,"178":4}}],["a",{"2":{"69":2,"185":2}}],["and",{"2":{"215":1,"217":1,"219":1,"220":1,"221":1,"222":3,"223":1,"224":1}}],["animation",{"2":{"185":1}}],["animationduration",{"0":{"160":1,"161":1,"162":1,"163":1,"164":1,"165":1,"166":1},"2":{"160":2,"161":2,"162":2,"163":2,"164":2,"165":2,"166":2,"185":1}}],["angular",{"2":{"182":1}}],["any>",{"2":{"117":1}}],["any>>",{"2":{"117":1}}],["any",{"2":{"50":2,"53":3,"55":19,"61":2,"63":1,"64":1,"65":1,"66":1,"67":1,"68":1,"69":3,"84":1,"90":1,"104":1,"107":3,"117":6,"152":3,"153":3,"156":2,"158":1,"168":1,"169":1,"170":1,"178":7}}],["annotation",{"2":{"30":1,"188":1,"189":1,"192":1}}],["avp",{"2":{"42":1,"115":1}}],["axisline",{"2":{"185":2}}],["axis",{"0":{"57":1,"58":1},"2":{"36":2,"57":2,"58":2,"152":2,"215":3}}],["axisoptions",{"2":{"21":1,"38":2,"39":2,"40":1,"41":1,"44":1,"152":3,"167":3}}],["apache",{"2":{"225":1}}],["appendchild",{"2":{"215":5,"217":2,"219":2,"220":5,"221":2,"222":2,"223":2,"224":8}}],["app",{"2":{"182":1}}],["applynewdata",{"0":{"145":1},"2":{"25":1,"42":1,"182":7,"215":1,"216":1,"217":1,"218":2,"219":1,"220":1,"221":1,"222":1,"223":1,"224":1}}],["applymoredata和updatedata新增成功回调入参callback",{"2":{"24":1}}],["applymoredata",{"0":{"146":1},"2":{"7":1,"42":1,"218":1}}],["api调整",{"0":{"190":1},"1":{"191":1,"192":1,"193":1}}],["api",{"2":{"30":3,"42":1}}],["attrs",{"2":{"1":1,"50":2,"53":2,"55":6,"90":1,"97":2,"99":1,"100":1,"101":1,"102":1,"103":1,"104":1,"107":2,"110":4,"117":1,"152":1,"153":1,"178":2,"179":1,"221":1}}],["outline",{"2":{"215":1,"217":1,"219":1,"220":1,"221":1,"222":1,"223":1,"224":1}}],["outside",{"2":{"215":1}}],["of",{"2":{"215":1,"217":1,"219":1,"220":1,"221":1,"222":1,"223":1,"224":1}}],["offset",{"2":{"185":2}}],["offsetbottom",{"2":{"7":1,"24":1,"185":3}}],["offsetright",{"2":{"7":1,"185":3}}],["offsettop",{"2":{"7":1,"185":3}}],["offsetleft",{"2":{"7":1,"185":3}}],["org",{"2":{"178":1}}],["obv",{"2":{"115":1}}],["objects",{"2":{"178":1}}],["object",{"2":{"44":1,"49":1,"50":2,"53":23,"55":20,"57":1,"58":1,"62":2,"127":1,"128":1,"152":19,"153":19,"154":1,"155":1,"156":30,"157":1,"158":15}}],["o",{"2":{"69":2}}],["open",{"2":{"42":1,"46":1,"112":1,"145":1,"146":1,"147":1,"148":1,"182":70,"185":4,"215":3,"216":3,"217":3,"218":3,"219":4,"220":3,"221":3,"222":3,"223":3,"224":3}}],["options新增属性gap",{"2":{"30":1}}],["options",{"0":{"44":1,"167":1},"2":{"14":1,"21":2,"30":1,"38":3,"39":2,"44":3,"113":1,"167":2,"183":1,"192":1,"194":1}}],["overridetechnicalindicator",{"2":{"192":1}}],["override",{"0":{"153":1,"158":1},"2":{"153":2,"158":2,"192":3}}],["overrideindicator",{"0":{"153":1},"2":{"153":1}}],["overrideoverlay",{"0":{"158":1},"2":{"30":1,"158":1}}],["overlayevent",{"2":{"178":14}}],["overlayperformeventparams",{"2":{"178":1}}],["overlaycreatefigurescallback",{"2":{"178":2}}],["overlayconstructor>",{"2":{"47":1}}],["overlaystyle",{"2":{"178":2}}],["overlayfigureignoreeventtype",{"2":{"55":6,"178":2}}],["overlayfigure中的attrs类型声明",{"2":{"19":1}}],["overlay",{"0":{"55":1},"2":{"55":2,"178":2,"185":1}}],["overlay新增属性paneid",{"2":{"20":1}}],["overlay新增事件ondoubleclick",{"2":{"19":1}}],["ohlc",{"2":{"11":1,"185":2,"217":2,"222":2}}],["only",{"2":{"215":1,"217":1,"219":1,"220":1,"221":1,"222":1,"223":1,"224":1}}],["onload",{"2":{"182":1}}],["onunmounted",{"2":{"182":2}}],["onmount",{"2":{"182":4}}],["onmounted",{"2":{"182":2}}],["onmouseleave",{"2":{"55":2,"156":3,"158":3,"178":1}}],["onmouseenter",{"2":{"55":2,"156":3,"158":3,"178":1}}],["onpanedrag",{"2":{"169":2,"170":2}}],["onpressedmoveend",{"2":{"55":2,"156":3,"158":3,"178":1}}],["onpressedmovestart",{"2":{"55":2,"156":3,"158":3,"178":1}}],["onpressedmoving",{"2":{"55":2,"156":3,"158":3,"178":1}}],["ontooltipiconclick",{"2":{"169":2,"170":2}}],["onvisiblerangechange和onpanedrag",{"2":{"192":1}}],["onvisiblerangechange",{"2":{"169":2,"170":2}}],["oncleanup",{"2":{"182":2}}],["onclick",{"2":{"55":2,"156":3,"158":3,"178":1}}],["oncandlebarclick",{"2":{"169":2,"170":2}}],["oncrosshairchange",{"2":{"168":2,"169":2,"170":2,"192":1}}],["onselected",{"2":{"55":2,"156":3,"158":3,"178":1}}],["onscroll",{"2":{"1":1,"169":2,"170":2,"192":1}}],["onremoved",{"2":{"55":2,"156":3,"158":3,"178":1}}],["onrightclick",{"2":{"55":2,"156":3,"158":3,"178":1}}],["ondestroy",{"2":{"182":4}}],["ondeselected",{"2":{"55":2,"156":3,"158":3,"178":1}}],["ondataready",{"2":{"145":1,"147":1,"169":2,"170":2}}],["ondoubleclick",{"2":{"55":2,"156":3,"158":3,"178":1}}],["ondrawend",{"2":{"55":2,"156":3,"158":3,"178":1}}],["ondrawing",{"2":{"55":2,"156":3,"158":3,"178":1}}],["ondrawstart",{"2":{"55":2,"156":3,"158":3,"178":1}}],["onzoom",{"2":{"1":1,"169":2,"170":2}}],["35",{"2":{"182":7,"185":2}}],["31",{"2":{"182":7}}],["33",{"2":{"182":7,"185":6}}],["34",{"2":{"115":1,"182":7}}],["30",{"2":{"115":3,"152":1,"182":7,"215":1,"216":1,"217":1,"218":1,"219":1,"220":1,"221":1,"222":1,"223":1,"224":1}}],["3",{"0":{"7":1,"16":1,"21":1,"25":1,"75":1},"2":{"115":3,"152":1,"167":2,"179":1,"185":4,"215":3,"216":3,"217":3,"218":3,"219":3,"220":3,"221":4,"222":3,"223":3,"224":3}}],["55",{"2":{"182":7}}],["56",{"2":{"182":7}}],["53",{"2":{"182":14}}],["5000",{"2":{"215":1,"216":1,"217":1,"218":1,"219":1,"220":1,"221":1,"222":1,"223":1,"224":1}}],["50",{"2":{"115":1}}],["5",{"0":{"6":1,"15":1,"16":1,"17":1,"18":1,"19":1,"34":1},"2":{"34":1,"55":2,"115":3,"119":1,"120":1,"153":2,"158":2,"185":4}}],["6px",{"2":{"215":1,"217":1,"219":1,"220":1,"221":1,"222":1,"223":1,"224":1}}],["686d76",{"2":{"185":4}}],["62",{"2":{"182":7}}],["66",{"2":{"182":14}}],["64",{"2":{"182":7}}],["61",{"2":{"182":14}}],["600px",{"2":{"182":10}}],["600",{"2":{"182":4,"218":1}}],["60",{"2":{"115":2,"215":5,"216":5,"217":5,"218":5,"219":5,"220":5,"221":5,"222":5,"223":5,"224":5}}],["6",{"0":{"5":1,"14":1,"33":1},"2":{"33":1,"44":1,"115":9,"152":1,"185":6}}],["76808f",{"2":{"185":2}}],["76",{"2":{"182":7}}],["72",{"2":{"182":7}}],["70",{"2":{"182":7}}],["74",{"2":{"182":7}}],["77",{"2":{"182":7}}],["7",{"0":{"4":1,"11":1,"12":1,"13":1,"32":1,"138":1,"139":1},"2":{"32":1,"153":1,"185":6,"186":1,"222":2}}],["px",{"2":{"220":1}}],["purpose",{"2":{"215":1,"217":1,"219":1,"220":1,"221":1,"222":1,"223":1,"224":1}}],["push",{"2":{"215":2,"216":2,"217":2,"218":2,"219":2,"220":2,"221":2,"222":2,"223":2,"224":2}}],["pnpm",{"2":{"181":1,"212":1}}],["png",{"2":{"173":1}}],["p",{"2":{"120":2}}],["pvt",{"2":{"115":1}}],["psy",{"2":{"115":1}}],["performpoint",{"2":{"178":1}}],["performpointindex",{"2":{"178":1}}],["performeventmovefordrawing",{"2":{"55":2,"178":1}}],["performeventpressedmove",{"2":{"55":2,"178":1}}],["percentage",{"2":{"2":1,"185":1,"215":2}}],["pointer",{"2":{"185":1}}],["point",{"2":{"185":2}}],["points对应的坐标信息",{"2":{"178":1}}],["points",{"2":{"55":2,"156":3,"158":3,"178":2,"192":1}}],["polygon",{"0":{"82":1,"88":1,"102":1},"2":{"82":1,"88":2,"98":1,"185":1,"210":1}}],["positions",{"2":{"215":2}}],["position",{"0":{"125":1,"126":1},"2":{"39":1,"44":1,"125":2,"126":2,"152":2,"185":4,"192":4,"215":2}}],["position和candle",{"2":{"24":1}}],["project",{"2":{"215":1,"217":1,"219":1,"220":1,"221":1,"222":1,"223":1,"224":1}}],["prod",{"2":{"213":1}}],["promise",{"2":{"53":1,"117":1,"152":1,"153":1}}],["preact",{"2":{"182":1}}],["prev",{"2":{"117":1}}],["precision",{"2":{"3":1,"53":2,"70":1,"117":1,"152":1,"153":3,"178":1}}],["prices",{"2":{"215":7,"216":7,"217":7,"218":7,"219":7,"220":7,"221":7,"222":7,"223":7,"224":7}}],["pricechannelline",{"2":{"176":1}}],["priceline",{"2":{"176":1,"221":1}}],["priceprecision",{"0":{"129":1},"2":{"129":2,"197":1}}],["price",{"2":{"53":2,"117":1,"129":1,"152":1,"153":3,"178":1,"221":1}}],["pricemark",{"2":{"30":1,"185":1,"222":2}}],["parallelstraightline",{"2":{"176":1}}],["param",{"2":{"120":4}}],["params",{"2":{"37":1,"53":2,"55":5,"57":1,"58":1,"117":2,"120":2,"151":2,"152":2,"153":2,"178":1,"194":2}}],["paneid",{"0":{"125":1,"126":1,"153":1,"154":1,"155":1,"156":1},"2":{"117":1,"125":2,"126":2,"153":2,"154":2,"155":2,"156":2,"159":1,"171":2,"172":2,"192":19,"201":1}}],["pane",{"2":{"41":1,"152":2,"153":2,"154":1,"155":1,"156":1,"167":2,"210":1,"220":1,"224":1}}],["paneoptions",{"0":{"152":1},"2":{"14":1,"38":3,"152":2,"192":2}}],["padding",{"2":{"215":2,"217":2,"219":2,"220":2,"221":2,"222":2,"223":2,"224":2}}],["paddingbottom",{"2":{"90":2,"104":1,"185":9}}],["paddingbottom变更为yaxis",{"2":{"30":1,"189":1}}],["paddingbottom变更为xaxis",{"2":{"30":1,"189":1}}],["paddingright",{"2":{"90":2,"104":1,"185":9}}],["paddingtop",{"2":{"90":2,"104":1,"185":9}}],["paddingtop变更为yaxis",{"2":{"30":1,"189":1}}],["paddingtop变更为xaxis",{"2":{"30":1,"189":1}}],["paddingleft",{"2":{"90":2,"104":1,"185":9,"220":1}}],["paddingleft显示不对问题",{"2":{"15":1}}],["css",{"2":{"215":1,"217":1,"219":1,"220":1,"221":1,"222":1,"223":1,"224":1}}],["cjs",{"2":{"213":2}}],["cdn",{"2":{"181":2,"182":1}}],["cb",{"0":{"150":1,"151":1},"2":{"150":2,"151":2}}],["click",{"2":{"215":4,"217":1,"219":1,"220":2,"221":1,"222":1,"223":1,"224":4}}],["clean",{"2":{"213":2}}],["cleardata",{"0":{"149":1}}],["classname",{"2":{"215":1,"217":1,"219":1,"220":1,"221":1,"222":1,"223":1,"224":2}}],["class",{"2":{"182":1}}],["clone",{"0":{"61":1}}],["clone和utils",{"2":{"14":1}}],["closesums",{"2":{"120":5}}],["closepath",{"2":{"110":2}}],["close",{"2":{"42":1,"46":1,"112":1,"120":4,"145":1,"146":1,"147":1,"148":1,"182":70,"185":5,"215":4,"216":4,"217":4,"218":7,"219":5,"220":5,"221":4,"222":4,"223":4,"224":4}}],["cci",{"2":{"115":1}}],["cn",{"2":{"178":1,"182":1,"219":1}}],["cn两种语言",{"2":{"111":1}}],["cn和en",{"2":{"44":1,"46":1}}],["currentstep",{"2":{"178":1}}],["current",{"2":{"117":1}}],["currentcolor",{"2":{"110":2}}],["customapi",{"2":{"44":2}}],["customxaxisname",{"2":{"39":2}}],["customyaxisname",{"2":{"39":2,"40":2,"41":2}}],["custom支持字符串模版",{"2":{"19":1}}],["custom新增内置涨跌幅支持",{"2":{"18":1}}],["custom新增turnover字符串模版",{"2":{"14":1}}],["custom",{"2":{"3":1,"185":1,"189":1,"220":3,"221":1}}],["center",{"2":{"84":1,"90":1,"215":1,"217":1,"219":1,"220":2,"221":1,"222":1,"223":1,"224":1}}],["c",{"2":{"69":2}}],["child",{"2":{"224":1}}],["chicago",{"2":{"223":2}}],["checkcoordinateontext",{"0":{"84":1}}],["checkcoordinateonrect",{"0":{"83":1}}],["checkcoordinateonpolygon",{"0":{"82":1}}],["checkcoordinateonline",{"0":{"81":1}}],["checkcoordinateoncircle",{"0":{"80":1}}],["checkcoordinateonarc",{"0":{"79":1}}],["checkeventon",{"2":{"50":2,"107":1,"110":1}}],["charset=",{"2":{"182":1}}],["chartstore",{"2":{"210":1}}],["chartcomponent",{"2":{"182":1}}],["chart",{"2":{"44":1,"45":1,"182":35,"210":1,"215":8,"216":4,"217":5,"218":9,"219":5,"220":6,"221":5,"222":8,"223":5,"224":10}}],["change",{"2":{"31":1,"32":1,"33":1,"112":1}}],["ctx",{"0":{"85":1,"86":1,"87":1,"88":1,"89":1,"90":1,"91":1},"2":{"50":1,"85":2,"86":2,"87":2,"88":2,"89":2,"90":2,"91":2,"97":2,"107":1,"110":21,"117":1,"194":2,"220":4}}],["code",{"2":{"215":1,"217":1,"219":1,"220":1,"221":1,"222":1,"223":1,"224":1}}],["commonjs",{"2":{"213":3}}],["com",{"2":{"203":2,"225":2}}],["component",{"2":{"182":2}}],["core",{"2":{"182":1,"213":2}}],["container",{"2":{"215":7,"217":7,"219":7,"220":7,"221":7,"222":7,"223":7,"224":10}}],["content=",{"2":{"182":4}}],["content中的内容和options参考实例方法",{"2":{"44":1}}],["content",{"2":{"44":1}}],["convertfrompixel",{"0":{"172":1}}],["converttopixel",{"0":{"171":1},"2":{"192":1,"220":2}}],["console",{"2":{"156":14,"158":14}}],["const",{"2":{"97":1,"110":5,"120":3,"179":3,"182":6,"215":19,"216":9,"217":13,"218":12,"219":13,"220":23,"221":16,"222":17,"223":13,"224":20}}],["color是颜色",{"2":{"109":1}}],["color",{"2":{"53":2,"84":2,"85":2,"86":2,"87":2,"88":2,"89":2,"90":2,"99":1,"100":1,"101":1,"102":1,"103":1,"104":1,"109":1,"110":2,"117":2,"152":4,"153":5,"156":1,"158":1,"182":1,"185":39,"194":2,"215":2,"217":2,"219":2,"220":2,"221":2,"222":2,"223":2,"224":2}}],["coordinates",{"2":{"81":1,"82":1,"87":1,"88":1,"101":1,"102":1,"178":1,"179":7,"221":7}}],["coordinate2",{"0":{"76":1,"77":1},"2":{"76":1,"77":1}}],["coordinate1",{"0":{"76":1,"77":1},"2":{"76":1,"77":1}}],["coordinate",{"0":{"79":1,"80":1,"81":1,"82":1,"83":1,"84":1,"164":1,"172":1},"2":{"50":2,"53":2,"79":2,"80":2,"81":1,"82":1,"83":2,"84":2,"107":1,"110":3,"117":1,"152":1,"153":1,"164":2,"172":2,"192":1}}],["coord",{"2":{"37":2,"57":1,"58":1}}],["circle",{"0":{"80":1,"86":1,"100":1},"2":{"80":2,"86":2,"97":1,"98":1,"179":2,"185":1,"210":1,"221":5}}],["circles",{"2":{"30":1,"153":1,"185":1,"189":1,"222":2}}],["circle变更为indicator",{"2":{"30":1,"189":1}}],["cross",{"2":{"185":2,"224":2}}],["crosshair",{"2":{"30":2,"117":1,"185":1,"194":2}}],["cr",{"2":{"115":1}}],["createelement",{"2":{"215":5,"217":2,"219":2,"220":5,"221":2,"222":2,"223":2,"224":8}}],["createyaxisfigures",{"2":{"55":2,"178":1}}],["createxaxisfigures",{"2":{"55":2,"178":1}}],["createpointfigures",{"2":{"55":2,"178":1,"179":1,"221":1}}],["createtechnicalindicator",{"2":{"192":1}}],["createtooltipdatasource",{"2":{"53":2,"117":1,"152":1,"153":2}}],["createticks",{"2":{"37":1,"57":2,"58":2}}],["createtag",{"2":{"30":1,"192":1}}],["createannotation",{"2":{"30":1,"192":1}}],["createindicator",{"0":{"40":1,"152":1},"2":{"21":1,"38":1,"44":1,"152":1,"220":2,"222":1,"224":2}}],["createoverlay",{"0":{"156":1},"2":{"20":1,"30":1,"156":1,"221":3}}],["cryptotooltop",{"2":{"7":1}}],["canvastextbaseline",{"2":{"104":1}}],["canvastextalign",{"2":{"104":1}}],["canvas",{"2":{"93":2}}],["canvasgradient",{"2":{"86":1,"88":1,"89":1,"104":1}}],["canvasrenderingcontext2d",{"2":{"50":1,"85":1,"86":1,"87":1,"88":1,"89":1,"90":1,"107":1,"117":1}}],["candle",{"2":{"3":1,"7":1,"11":1,"24":6,"30":1,"39":1,"41":1,"44":1,"152":1,"153":2,"154":1,"155":1,"156":1,"167":1,"185":6,"189":1,"198":1,"217":5,"220":1,"222":2,"224":3}}],["calcparms",{"2":{"53":1,"117":1,"152":1,"153":1}}],["calcparamstext",{"2":{"53":1,"117":1,"152":1,"153":1,"194":1}}],["calcparams",{"2":{"53":2,"117":1,"119":2,"120":3,"152":1,"153":3}}],["calc",{"2":{"53":2,"117":1,"120":1,"152":1,"153":3,"220":1}}],["calctextwidth",{"0":{"75":1},"2":{"21":1}}],["callback",{"0":{"145":1,"146":1,"147":1,"152":1,"153":1,"169":1,"170":1},"2":{"14":1,"38":1,"145":3,"146":2,"147":3,"151":2,"152":2,"153":2,"169":2,"170":2,"192":2}}],["ts",{"2":{"214":1}}],["t",{"2":{"204":1}}],["trc20",{"2":{"229":1}}],["transparent",{"2":{"185":2}}],["true",{"2":{"152":2,"153":2,"156":1,"158":1,"167":2,"185":29,"215":2,"218":2,"220":1,"221":3}}],["trix",{"2":{"115":1}}],["thjptqmfgavm12ke1jzc5mlxiapp6qxmci",{"2":{"229":1}}],["the",{"2":{"215":4,"217":4,"219":4,"220":4,"221":4,"222":4,"223":4,"224":4}}],["theme",{"2":{"182":1,"222":4}}],["threshold",{"0":{"74":1},"2":{"74":1}}],["thousandsseparator",{"2":{"44":2,"178":1}}],["targetcoordinate",{"0":{"77":1,"78":1},"2":{"77":1,"78":1}}],["target",{"0":{"61":1,"62":1},"2":{"61":1,"62":1}}],["tagid",{"2":{"192":1}}],["tag合并成overlay",{"2":{"188":1}}],["tag",{"2":{"30":1,"189":1,"192":1}}],["turnover",{"2":{"42":1,"112":1,"145":1,"146":1,"147":1,"148":1,"215":2,"216":2,"217":2,"218":2,"219":2,"220":2,"221":2,"222":2,"223":2,"224":2}}],["tip",{"2":{"224":2}}],["tickline",{"2":{"185":2}}],["ticktext",{"2":{"30":8,"185":2,"189":8}}],["title和value可以是字符串或者对象",{"2":{"185":1}}],["title>",{"2":{"182":1}}],["title>quick",{"2":{"182":1}}],["title",{"2":{"53":3,"117":2,"119":2,"120":3,"152":3,"153":3,"185":12,"194":2}}],["time",{"2":{"46":1,"112":1,"185":4,"219":1}}],["timezone",{"0":{"130":1},"2":{"44":2,"130":2,"223":2}}],["timestamp为第一条数据的时间戳",{"2":{"150":1}}],["timestamp",{"0":{"72":1,"163":1,"166":1},"2":{"42":1,"44":1,"55":1,"72":1,"145":1,"146":1,"147":1,"148":1,"150":1,"156":4,"158":3,"163":2,"166":2,"171":3,"172":2,"178":3,"182":70,"215":5,"216":5,"217":5,"218":7,"219":5,"220":5,"221":5,"222":5,"223":5,"224":5}}],["tofixed",{"2":{"215":4,"216":4,"217":4,"218":4,"219":4,"220":4,"221":4,"222":4,"223":4,"224":4}}],["totalstep",{"2":{"55":2,"178":1,"179":1,"221":1}}],["top",{"2":{"37":1,"44":2,"84":1,"90":1,"117":2,"126":1,"152":4,"167":3,"178":1,"215":1,"217":1,"219":1,"220":1,"221":1,"222":1,"223":1,"224":2}}],["to",{"2":{"37":1,"117":2,"144":1,"215":1,"217":1,"219":1,"220":3,"221":1,"222":1,"223":1,"224":1}}],["tooltip",{"2":{"3":1,"7":2,"14":1,"18":1,"19":1,"24":2,"30":2,"185":2,"189":3,"224":4}}],["telegram",{"0":{"204":1}}],["template",{"2":{"182":1,"191":4}}],["template>",{"2":{"182":2}}],["technicalindicator",{"2":{"30":4,"189":3,"194":1}}],["textalign",{"2":{"220":1}}],["textweight",{"2":{"185":2}}],["textfamily",{"2":{"185":2}}],["textsize",{"2":{"185":2}}],["textoffset",{"2":{"185":2}}],["text",{"0":{"75":1,"84":1,"90":1,"104":1},"2":{"15":1,"30":4,"37":2,"53":2,"57":1,"58":1,"75":1,"84":4,"90":3,"91":2,"98":1,"104":1,"117":2,"152":2,"153":2,"182":1,"185":10,"210":1,"215":17,"217":8,"219":5,"220":2,"221":4,"222":6,"223":5,"224":13}}],["text配置",{"2":{"14":1}}],["types",{"2":{"215":2,"224":3}}],["typescript开发",{"2":{"123":1}}],["typescriptklinecharts",{"2":{"112":1}}],["typescriptnew",{"2":{"99":1,"100":1,"101":1,"102":1,"103":1,"104":1}}],["typescriptsetpaneoptions",{"2":{"41":1}}],["typescriptcreateindicator",{"2":{"40":1}}],["typescriptinit",{"2":{"39":1}}],["typescript重构",{"2":{"30":1}}],["typescript",{"2":{"2":1,"37":1,"42":1,"44":1,"45":1,"46":1,"47":1,"48":1,"49":1,"50":1,"51":1,"52":1,"53":1,"54":1,"55":1,"56":1,"57":1,"58":1,"59":1,"61":1,"62":1,"63":1,"64":1,"65":1,"66":1,"67":1,"68":1,"69":1,"70":1,"71":1,"72":1,"73":1,"74":1,"75":1,"76":1,"77":1,"78":1,"79":1,"80":1,"81":1,"82":1,"83":1,"84":1,"85":1,"86":1,"87":1,"88":1,"89":1,"90":1,"107":1,"117":1,"125":1,"126":1,"127":1,"128":1,"129":1,"130":1,"131":1,"132":1,"133":1,"134":1,"135":1,"136":1,"137":1,"138":1,"139":1,"140":1,"141":1,"142":1,"143":1,"144":1,"145":1,"146":1,"147":1,"148":1,"149":1,"150":1,"151":1,"152":1,"153":1,"154":1,"155":1,"156":1,"157":1,"158":1,"159":1,"160":1,"161":1,"162":1,"163":1,"164":1,"165":1,"166":1,"167":1,"168":1,"169":1,"170":1,"171":1,"172":1,"173":1,"174":1,"178":1,"213":2}}],["type=",{"2":{"182":1}}],["type对应的图形的样式",{"2":{"178":1}}],["type对应的图形的属性",{"2":{"178":1}}],["type是area时",{"2":{"15":1}}],["type",{"0":{"168":1,"169":1,"170":1,"173":1},"2":{"1":1,"2":1,"11":1,"39":2,"44":2,"53":2,"55":6,"117":1,"119":2,"120":3,"151":2,"152":2,"153":2,"168":2,"169":2,"170":2,"173":2,"178":2,"179":1,"185":2,"192":2,"198":1,"215":2,"217":2,"221":1}}],["1b1b1f",{"2":{"222":1}}],["16px",{"2":{"220":1}}],["1677ff",{"2":{"185":11,"215":1,"217":1,"219":1,"220":1,"221":1,"222":1,"223":1,"224":1}}],["16098",{"2":{"156":1,"158":1}}],["1614171202000",{"2":{"156":1,"158":1}}],["1614171282000",{"2":{"156":1,"158":1}}],["16",{"2":{"30":1,"182":7}}],["17",{"2":{"29":1,"220":1}}],["150",{"2":{"185":6}}],["1587660540000",{"2":{"182":7}}],["1587660480000",{"2":{"182":7}}],["1587660420000",{"2":{"182":7}}],["1587660360000",{"2":{"182":7}}],["1587660300000",{"2":{"182":7}}],["1587660240000",{"2":{"182":7}}],["1587660180000",{"2":{"182":7}}],["1587660120000",{"2":{"182":7}}],["1587660060000",{"2":{"182":7}}],["1587660000000",{"2":{"182":7}}],["15",{"2":{"19":1,"25":1,"185":1}}],["192",{"2":{"185":3,"222":1}}],["191",{"2":{"182":7}}],["197",{"2":{"182":7}}],["194",{"2":{"182":7}}],["19",{"2":{"16":1,"182":7}}],["119",{"2":{"185":4}}],["11",{"2":{"14":1}}],["184",{"2":{"182":7}}],["18987",{"2":{"156":1,"158":1}}],["18",{"2":{"12":1,"17":1}}],["135",{"2":{"182":7}}],["13",{"2":{"9":1,"21":1,"115":1}}],["1",{"0":{"9":1,"12":1,"18":1,"23":1,"25":1,"26":1,"27":2,"28":1,"29":1},"2":{"69":1,"110":1,"120":3,"152":2,"153":4,"156":1,"158":1,"167":2,"179":2,"185":37,"216":1,"218":2,"221":2,"222":4}}],["12px",{"2":{"215":1,"217":1,"219":1,"220":1,"221":1,"222":1,"223":1,"224":1}}],["12345678910111213141516171819202122",{"2":{"224":1}}],["1234567891011121314151617181920212223242526html",{"2":{"182":1}}],["12345678910111213141516171819202122232425262728html",{"2":{"216":1}}],["12345678910111213141516171819202122232425262728svelte",{"2":{"182":1}}],["123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051html",{"2":{"223":1}}],["1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677html",{"2":{"221":1}}],["123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126html",{"2":{"224":1}}],["123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150html",{"2":{"222":1}}],["123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110html",{"2":{"215":1}}],["123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107html",{"2":{"220":1}}],["123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960html",{"2":{"219":1}}],["1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556html",{"2":{"217":1}}],["12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849html",{"2":{"218":1}}],["123456789101112131415161718192021222324252627282930313233",{"2":{"182":1}}],["1234567891011121314151617181920212223242526272829jsximport",{"2":{"182":1}}],["1234567891011121314151617181920212223242526272829tsimport",{"2":{"182":1}}],["123456789101112131415161718192021222324252627jsximport",{"2":{"182":1}}],["1234567891011121314151617181920212223242526vue",{"2":{"182":1}}],["123456789101112131415161718",{"2":{"215":1,"217":1,"219":1,"220":1,"221":1,"222":1,"223":1}}],["123css",{"2":{"215":1,"217":1,"219":1,"220":1,"221":1,"222":1,"223":1,"224":1}}],["12",{"2":{"7":1,"11":1,"12":1,"13":2,"115":9,"182":7,"185":12}}],["142",{"2":{"185":3,"222":1}}],["14",{"2":{"3":1,"6":1,"14":1,"18":1,"27":1,"115":3,"182":7}}],["10px",{"2":{"215":2,"217":2,"219":2,"220":2,"221":2,"222":2,"223":2,"224":2}}],["105",{"2":{"182":7}}],["1000",{"2":{"185":1,"215":4,"216":4,"217":4,"218":4,"219":4,"220":4,"221":4,"222":4,"223":4,"224":4}}],["1000000转换为1m等",{"2":{"44":1,"53":1,"71":1,"153":1}}],["100",{"2":{"152":1,"167":1,"215":1,"216":1,"217":1,"218":1,"219":1,"220":1,"221":1,"222":1,"223":1,"224":1}}],["10",{"0":{"1":1},"2":{"4":1,"26":1,"115":7,"119":1,"120":1,"185":2,"215":1,"216":1,"217":1,"218":3,"219":1,"220":1,"221":1,"222":1,"223":1,"224":1}}],["中获取数据",{"2":{"210":1}}],["中的overlay",{"2":{"178":2}}],["中的",{"2":{"152":1}}],["中的indicator",{"2":{"117":4}}],["中的入参value和options",{"2":{"44":1}}],["中的子项",{"2":{"1":1,"38":1}}],["中声明问题",{"2":{"2":1}}],["错误",{"2":{"2":1}}],["2px",{"2":{"215":1,"217":1,"219":1,"220":1,"221":1,"222":1,"223":1,"224":1}}],["2196f3",{"2":{"185":2}}],["2000",{"2":{"218":1}}],["204",{"2":{"182":7}}],["20",{"2":{"115":6,"153":1,"182":21,"218":1}}],["2023",{"2":{"12":1,"13":1,"14":1,"15":1,"16":1,"17":1,"18":1,"19":1,"20":1,"21":1,"22":1,"23":1,"24":1,"25":1,"26":1,"27":1,"28":1,"29":1,"30":1}}],["2024",{"2":{"1":1,"2":1,"3":1,"4":1,"5":1,"6":1,"7":1,"8":1,"9":1,"10":1,"11":1}}],["230",{"2":{"185":3}}],["23",{"2":{"28":1}}],["249",{"2":{"185":3,"222":1}}],["243",{"2":{"185":6}}],["2432435",{"2":{"153":1}}],["24",{"2":{"24":1,"115":4}}],["2dc08e",{"2":{"23":1,"185":4,"222":1}}],["27",{"2":{"23":1}}],["255",{"2":{"185":4}}],["25",{"2":{"20":1,"185":2}}],["22px",{"2":{"215":1,"217":1,"219":1,"220":1,"221":1,"222":1,"223":1,"224":1}}],["22",{"2":{"15":1,"185":4}}],["26a69a",{"2":{"153":2}}],["26a69a变更为",{"2":{"23":1}}],["26",{"2":{"8":1,"115":3}}],["2",{"0":{"8":1,"11":1,"17":1,"22":2,"23":1,"24":1,"26":1,"137":1,"168":1},"2":{"110":11,"115":4,"145":1,"146":1,"147":1,"152":1,"153":6,"156":3,"158":3,"167":1,"179":1,"185":52,"215":4,"216":4,"217":4,"218":4,"219":4,"220":4,"221":5,"222":12,"223":4,"224":4,"225":1}}],["28",{"2":{"2":1,"182":21}}],["0xd2c3911654db861e0a2e17415e11a209c1fc3594",{"2":{"229":2}}],["000000",{"2":{"182":1}}],["0开始",{"2":{"145":1,"146":1,"147":1,"150":1}}],["02",{"2":{"28":1,"29":1,"30":1,"182":7}}],["08",{"2":{"18":1}}],["09",{"2":{"15":1,"16":1,"17":1,"182":7}}],["01c5c4",{"2":{"185":1}}],["01",{"2":{"11":1,"185":1}}],["0",{"0":{"10":1,"13":1,"14":1,"19":1,"20":1,"21":1,"24":1,"28":1,"29":1,"30":2,"36":1,"57":1,"58":1,"74":1,"75":1,"137":1,"138":1,"139":1,"151":1,"168":1},"1":{"37":1,"38":1,"39":1,"40":1,"41":1},"2":{"44":2,"55":2,"120":1,"145":1,"146":1,"147":1,"152":5,"153":1,"156":1,"158":3,"167":4,"179":3,"185":23,"215":3,"216":3,"217":3,"218":3,"219":3,"220":3,"221":6,"222":3,"223":3,"224":4,"225":1}}],["03",{"2":{"8":1,"9":1,"10":1,"27":1}}],["04",{"2":{"6":1,"7":1,"10":1,"22":1,"23":1,"24":1,"25":1,"26":1}}],["07",{"2":{"5":1}}],["05",{"2":{"2":1,"3":1,"4":1,"5":1,"20":1,"21":1,"22":1}}],["06",{"2":{"1":2,"19":1,"182":7}}],["优化事件处理",{"2":{"28":1}}],["优化渲染更新",{"2":{"27":1}}],["优化覆盖物图形事件忽略",{"2":{"26":1}}],["优化覆盖物事件回调参数",{"2":{"25":1}}],["优化覆盖物回调方法中的参数",{"2":{"3":1}}],["优化开发环境下",{"2":{"24":1}}],["优化api",{"2":{"24":1}}],["优化typescript覆盖物样式类型",{"2":{"25":1}}],["优化typescript声明",{"2":{"23":1}}],["优化typescript下",{"2":{"19":1}}],["优化默认样式",{"2":{"23":1}}],["优化默认显示",{"2":{"7":1}}],["优化类型检查",{"2":{"22":1}}],["优化内部id生成",{"2":{"21":1}}],["优化内部获取屏幕像素比",{"2":{"21":1}}],["优化内置覆盖物simpleannotation和simpletag",{"2":{"17":1}}],["优化bar宽度比例",{"2":{"21":1}}],["优化蜡烛柱显示",{"2":{"20":1}}],["优化分割线事件响应灵敏度",{"2":{"19":1}}],["优化移动端阻尼滚动掉帧问题",{"2":{"19":1}}],["优化技术指标自由样式",{"2":{"17":1}}],["优化utils",{"2":{"14":1}}],["优化ohlc蜡烛柱渲染",{"2":{"13":1}}],["优化绘制清晰度",{"2":{"11":1}}],["优化滚轮事件触发",{"2":{"9":1}}],["优化y轴小数折叠显示时计算的宽度准确度",{"2":{"9":1}}],["优化y轴渲染",{"2":{"7":1}}],["优化平滑曲线绘制",{"2":{"8":1}}],["优化面积图显示",{"2":{"8":1,"25":1}}],["优化基础图形rect事件响应",{"2":{"18":1}}],["优化基础图形text",{"2":{"17":1}}],["优化基础图形",{"2":{"7":1}}],["优化样式overlay",{"2":{"14":1}}],["优化样式",{"2":{"7":1,"11":1}}],["优化图表默认右偏移距离",{"2":{"6":1}}],["优化指标属性",{"2":{"1":1}}],["优化实例方法",{"2":{"1":1}}],["时有效",{"2":{"55":1,"158":1,"178":1}}],["时区",{"0":{"223":1}}],["时区对应名字列表请参阅时区列表",{"2":{"44":1,"130":1}}],["时区名",{"2":{"44":1,"130":1}}],["时间戳",{"2":{"42":1,"163":1,"166":1,"171":1,"178":3}}],["时",{"2":{"1":1,"5":1}}],["是采用",{"2":{"225":1}}],["是怎么回事",{"0":{"196":1}}],["是往前加载还是往后加载",{"2":{"151":1}}],["是一个回调方法",{"2":{"150":1,"169":1}}],["是一个k线数据数组",{"2":{"145":1,"146":1}}],["是一个方法",{"2":{"117":2}}],["是一款可高度自定义的专业级轻量金融图表",{"2":{"122":1}}],["是创建的唯一标识",{"2":{"107":1}}],["是否忽略事件",{"2":{"178":1}}],["是否锁定",{"2":{"178":1}}],["是否锁定不让拖动",{"2":{"55":1,"158":1}}],["是否是绝对坐标",{"2":{"171":1,"172":1}}],["是否覆盖",{"2":{"152":1}}],["是否可以拖拽滚动",{"2":{"135":1}}],["是否可以缩放",{"2":{"133":1}}],["是否可见",{"2":{"53":1,"55":1,"117":1,"153":1,"158":1,"178":1}}],["是否需要包含浮层",{"2":{"173":1}}],["是否需要格式化大数据值",{"2":{"117":1}}],["是否需要格式化大的数字",{"2":{"53":1,"153":1}}],["是否需要ohlc",{"2":{"117":1}}],["是否需要ohlc辅助图形",{"2":{"53":1,"153":1}}],["是否需要默认的y轴上的图形",{"2":{"55":1,"158":1,"178":1}}],["是否需要默认的x轴上的图形",{"2":{"55":1,"158":1,"178":1}}],["是否需要默认的点对应的图形",{"2":{"55":1,"158":1,"178":1}}],["是数组时无法覆盖问题",{"2":{"3":1}}],["是",{"2":{"1":1,"55":1,"158":1,"178":1}}],["当是一个方法时",{"2":{"185":1}}],["当是对象时",{"2":{"127":1,"152":1,"156":1}}],["当前步骤",{"2":{"178":1}}],["当前图形的数据",{"2":{"117":1}}],["当计算参数改变时",{"2":{"120":1}}],["当添加完语言包后",{"2":{"113":1}}],["当注册完成之后",{"2":{"38":1}}],["当",{"2":{"1":1}}],["和convertfrompixel",{"2":{"192":1}}],["和unsubscribeaction",{"2":{"192":1}}],["和updatedata",{"2":{"42":1}}],["和getheight",{"2":{"192":1}}],["和配置项",{"2":{"119":1}}],["和基础类型deeppartial",{"2":{"25":1}}],["和setpaneoptions",{"2":{"21":1}}],["和",{"2":{"1":2,"5":1,"7":1,"11":1,"36":1,"38":1,"42":1,"53":1,"55":1,"153":1,"158":1,"169":1,"170":1}}],["修复内置基础图形arc不生效问题",{"2":{"27":1}}],["修复内置基础图形line触发事件不准确问题",{"2":{"26":1}}],["修复内置覆盖物simpleannotation和simpletag绘制完成后第一次触发事件问题",{"2":{"26":1}}],["修复内置指标vol修改calcparams时出错问题",{"2":{"9":1}}],["修复无数据时y轴上十字光标文字不显示问题",{"2":{"25":1}}],["修复窗口id命名拼写错误",{"2":{"19":1}}],["修复typescript引入问题",{"2":{"29":1}}],["修复typescript声明问题",{"2":{"17":1}}],["修复ts下引入问题",{"2":{"16":1}}],["修复样式crosshair",{"2":{"15":1}}],["修复样式candle",{"2":{"15":1}}],["修复样式配置",{"2":{"2":1,"3":1}}],["修复多个指标样式显示不对问题",{"2":{"14":1}}],["修复多个覆盖物样式显示不对问题",{"2":{"14":1}}],["修复蜡烛柱模糊问题",{"2":{"13":1}}],["修复包管理器下载node版本依赖问题",{"2":{"12":1}}],["修复覆盖物zlevel渲染规则",{"2":{"13":1}}],["修复覆盖物x轴上显示问题",{"2":{"11":1}}],["修复覆盖物绘制到未来时间",{"2":{"8":1}}],["修复指标和覆盖物方法不执行问题",{"2":{"12":1}}],["修复指标属性",{"2":{"11":1}}],["修复指标精度不同步价格数量精度问题",{"2":{"4":1}}],["修复不同浏览器格式化时间问题",{"2":{"10":1}}],["修复初始化layout只指定xaxis时",{"2":{"9":1}}],["修复图表偶发会空白问题",{"2":{"6":1}}],["修复图表api",{"2":{"5":1,"25":1}}],["修复面积图显示问题",{"2":{"6":1}}],["修复创建覆盖物后",{"2":{"5":1}}],["修复千分符指定",{"2":{"5":1}}],["修复小数折叠不准确问题",{"2":{"3":1}}],["修复",{"2":{"2":1,"7":1}}],["修复x轴缩放可能出错问题",{"2":{"1":1}}],["修复实例方法",{"2":{"1":1}}],["修复基础图形line事件检查可能导致错误问题",{"2":{"22":1}}],["修复基础图形",{"2":{"1":1}}],["💬",{"0":{"202":1},"1":{"203":1,"204":1,"205":1}}],["🙋",{"0":{"195":1},"1":{"196":1,"197":1,"198":1,"199":1,"200":1,"201":1}}],["🛡",{"2":{"123":1}}],["📱",{"2":{"123":1}}],["💪",{"2":{"123":1}}],["🚀",{"0":{"180":1},"1":{"181":1,"182":1},"2":{"123":1}}],["📦",{"2":{"123":1}}],["📃",{"0":{"121":1},"1":{"122":1,"123":1}}],["📚",{"0":{"42":1}}],["🗑",{"2":{"30":1}}],["👉",{"2":{"30":1}}],["🛠️",{"0":{"186":1},"1":{"187":1,"188":1,"189":1,"190":1,"191":1,"192":1,"193":1,"194":1}}],["🛠",{"2":{"30":1}}],["🖋️",{"2":{"14":1}}],["💄",{"2":{"1":2,"3":1,"6":1,"7":4,"8":2,"9":2,"11":2,"13":1,"14":2,"17":3,"18":1,"19":2,"20":1,"21":3,"22":1,"23":2,"24":2,"25":3,"26":1,"27":1,"28":1}}],["🐞",{"2":{"1":3,"2":2,"3":2,"4":1,"5":3,"6":2,"7":1,"8":1,"9":2,"10":1,"11":2,"12":2,"13":2,"14":2,"15":2,"16":1,"17":1,"19":2,"22":1,"25":2,"26":2,"27":1,"29":1}}],["📠",{"0":{"0":1},"1":{"1":1,"2":1,"3":1,"4":1,"5":1,"6":1,"7":1,"8":1,"9":1,"10":1,"11":1,"12":1,"13":1,"14":1,"15":1,"16":1,"17":1,"18":1,"19":1,"20":1,"21":1,"22":1,"23":1,"24":1,"25":1,"26":1,"27":1,"28":1,"29":1,"30":1,"31":1,"32":1,"33":1,"34":1,"35":1}}],["8px",{"2":{"215":1,"217":1,"219":1,"220":1,"221":1,"222":1,"223":1,"224":1}}],["800",{"2":{"215":1,"216":1,"217":1,"218":1,"219":1,"220":1,"221":1,"222":1,"223":1,"224":1}}],["85",{"2":{"185":3,"222":1}}],["88",{"2":{"182":7}}],["888888",{"2":{"153":2,"185":14,"222":4}}],["89",{"2":{"182":7}}],["8",{"0":{"1":1,"2":1,"3":2,"4":1,"5":1,"6":1,"7":1,"8":1,"9":1,"10":1,"31":1,"36":1,"57":1,"58":1,"74":1,"151":1},"1":{"37":1,"38":1,"39":1,"40":1,"41":1},"2":{"31":1,"44":1,"145":1,"146":1,"147":1,"150":1,"152":1,"156":1,"158":1,"167":1,"182":1,"185":7,"186":2}}],["96",{"2":{"182":7}}],["935ebd",{"2":{"185":1}}],["93",{"2":{"182":21}}],["94",{"2":{"182":7}}],["99",{"2":{"182":14}}],["9",{"0":{"1":1,"2":2,"3":1,"4":1,"5":1,"6":1,"7":1,"8":1,"9":1,"10":1,"11":1,"12":1,"13":1,"14":1,"15":1,"16":1,"17":1,"18":1,"19":1,"20":1,"21":1,"22":1,"23":1,"24":1,"25":1,"26":1,"27":1,"28":1,"29":1,"30":1},"2":{"115":3,"186":1}}]],"serializationVersion":2}';export{e as default}; diff --git a/assets/chunks/Chart.CUfUC5Xd.js b/assets/chunks/Chart.CUfUC5Xd.js new file mode 100644 index 0000000..f187a2d --- /dev/null +++ b/assets/chunks/Chart.CUfUC5Xd.js @@ -0,0 +1,835 @@ +import{_ as oR,o as nD,c as uR,j as Ft,r as xke,t as Dke,u as fke,p as aR,v as pke,q as gke,x as Fke,b as yke,e as mke,G as Qx,w as Zx,k as eD}from"./framework.DSL-p2JV.js";const hke=500,Eke=20,Cke=300,vke="https://stackblitz.com",rY=["angular-cli","create-react-app","html","javascript","node","polymer","typescript","vue"],bke=["project","search","ports","settings"],Ake=["light","dark"],Rke=["editor","preview"],tY={clickToLoad:ue=>ki("ctl",ue),devToolsHeight:ue=>aY("devtoolsheight",ue),forceEmbedLayout:ue=>ki("embed",ue),hideDevTools:ue=>ki("hidedevtools",ue),hideExplorer:ue=>ki("hideExplorer",ue),hideNavigation:ue=>ki("hideNavigation",ue),openFile:ue=>rD("file",ue),showSidebar:ue=>Bke("showSidebar",ue),sidebarView:ue=>nR("sidebarView",ue,bke),startScript:ue=>rD("startScript",ue),terminalHeight:ue=>aY("terminalHeight",ue),theme:ue=>nR("theme",ue,Ake),view:ue=>nR("view",ue,Rke),zenMode:ue=>ki("zenMode",ue),organization:ue=>`${rD("orgName",ue==null?void 0:ue.name)}&${rD("orgProvider",ue==null?void 0:ue.provider)}`,crossOriginIsolated:ue=>ki("corp",ue)};function sY(ue={}){const ge=Object.entries(ue).map(([pe,ke])=>ke!=null&&tY.hasOwnProperty(pe)?tY[pe](ke):"").filter(Boolean);return ge.length?`?${ge.join("&")}`:""}function ki(ue,ge){return ge===!0?`${ue}=1`:""}function Bke(ue,ge){return typeof ge=="boolean"?`${ue}=${ge?"1":"0"}`:""}function aY(ue,ge){if(typeof ge=="number"&&!Number.isNaN(ge)){const pe=Math.min(100,Math.max(0,ge));return`${ue}=${encodeURIComponent(Math.round(pe))}`}return""}function nR(ue,ge="",pe=[]){return pe.includes(ge)?`${ue}=${encodeURIComponent(ge)}`:""}function rD(ue,ge){return(Array.isArray(ge)?ge:[ge]).filter(ke=>typeof ke=="string"&&ke.trim()!=="").map(ke=>`${ue}=${encodeURIComponent(ke)}`).join("&")}function iY(){return Math.random().toString(36).slice(2,6)+Math.random().toString(36).slice(2,6)}function dR(ue,ge){return`${oY(ge)}${ue}${sY(ge)}`}function lR(ue,ge){const pe={forceEmbedLayout:!0};return ge&&typeof ge=="object"&&Object.assign(pe,ge),`${oY(pe)}${ue}${sY(pe)}`}function oY(ue={}){return(typeof ue.origin=="string"?ue.origin:vke).replace(/\/$/,"")}function cR(ue,ge,pe){if(!ge||!ue||!ue.parentNode)throw new Error("Invalid Element");ue.id&&(ge.id=ue.id),ue.className&&(ge.className=ue.className),wke(ge,pe),Ske(ue,ge,pe),ue.replaceWith(ge)}function xR(ue){if(typeof ue=="string"){const ge=document.getElementById(ue);if(!ge)throw new Error(`Could not find element with id '${ue}'`);return ge}else if(ue instanceof HTMLElement)return ue;throw new Error(`Invalid element: ${ue}`)}function DR(ue){return ue&&ue.newWindow===!1?"_self":"_blank"}function wke(ue,ge={}){const pe=Object.hasOwnProperty.call(ge,"height")?`${ge.height}`:`${Cke}`,ke=Object.hasOwnProperty.call(ge,"width")?`${ge.width}`:void 0;ue.setAttribute("height",pe),ke?ue.setAttribute("width",ke):ue.setAttribute("style","width:100%;")}function Ske(ue,ge,pe={}){var We,Cr;const ke=((Cr=(We=ue.allow)==null?void 0:We.split(";"))==null?void 0:Cr.map($r=>$r.trim()))??[];pe.crossOriginIsolated&&!ke.includes("cross-origin-isolated")&&ke.push("cross-origin-isolated"),ke.length>0&&(ge.allow=ke.join("; "))}class jke{constructor(ge){this.pending={},this.port=ge,this.port.onmessage=this.messageListener.bind(this)}request({type:ge,payload:pe}){return new Promise((ke,We)=>{const Cr=iY();this.pending[Cr]={resolve:ke,reject:We},this.port.postMessage({type:ge,payload:{...pe,__reqid:Cr}})})}messageListener(ge){var _r;if(typeof((_r=ge.data.payload)==null?void 0:_r.__reqid)!="string")return;const{type:pe,payload:ke}=ge.data,{__reqid:We,__success:Cr,__error:$r}=ke;this.pending[We]&&(Cr?this.pending[We].resolve(this.cleanResult(ke)):this.pending[We].reject($r?`${pe}: ${$r}`:pe),delete this.pending[We])}cleanResult(ge){const pe={...ge};return delete pe.__reqid,delete pe.__success,delete pe.__error,Object.keys(pe).length?pe:null}}class Tke{constructor(ge,pe){this.editor={openFile:ke=>this._rdc.request({type:"SDK_OPEN_FILE",payload:{path:ke}}),setCurrentFile:ke=>this._rdc.request({type:"SDK_SET_CURRENT_FILE",payload:{path:ke}}),setTheme:ke=>this._rdc.request({type:"SDK_SET_UI_THEME",payload:{theme:ke}}),setView:ke=>this._rdc.request({type:"SDK_SET_UI_VIEW",payload:{view:ke}}),showSidebar:(ke=!0)=>this._rdc.request({type:"SDK_TOGGLE_SIDEBAR",payload:{visible:ke}})},this.preview={origin:"",getUrl:()=>this._rdc.request({type:"SDK_GET_PREVIEW_URL",payload:{}}).then(ke=>(ke==null?void 0:ke.url)??null),setUrl:(ke="/")=>{if(typeof ke!="string"||!ke.startsWith("/"))throw new Error(`Invalid argument: expected a path starting with '/', got '${ke}'`);return this._rdc.request({type:"SDK_SET_PREVIEW_URL",payload:{path:ke}})}},this._rdc=new jke(ge),Object.defineProperty(this.preview,"origin",{value:typeof pe.previewOrigin=="string"?pe.previewOrigin:null,writable:!1})}applyFsDiff(ge){const pe=ke=>ke!==null&&typeof ke=="object";if(!pe(ge)||!pe(ge.create))throw new Error("Invalid diff object: expected diff.create to be an object.");if(!Array.isArray(ge.destroy))throw new Error("Invalid diff object: expected diff.destroy to be an array.");return this._rdc.request({type:"SDK_APPLY_FS_DIFF",payload:ge})}getDependencies(){return this._rdc.request({type:"SDK_GET_DEPS_SNAPSHOT",payload:{}})}getFsSnapshot(){return this._rdc.request({type:"SDK_GET_FS_SNAPSHOT",payload:{}})}}const aD=[];class Pke{constructor(ge){this.id=iY(),this.element=ge,this.pending=new Promise((pe,ke)=>{const We=({data:sr,ports:mr})=>{(sr==null?void 0:sr.action)==="SDK_INIT_SUCCESS"&&sr.id===this.id&&(this.vm=new Tke(mr[0],sr.payload),pe(this.vm),$r())},Cr=()=>{var sr;(sr=this.element.contentWindow)==null||sr.postMessage({action:"SDK_INIT",id:this.id},"*")};function $r(){window.clearInterval(nr),window.removeEventListener("message",We)}window.addEventListener("message",We),Cr();let _r=0;const nr=window.setInterval(()=>{if(this.vm){$r();return}if(_r>=Eke){$r(),ke("Timeout: Unable to establish a connection with the StackBlitz VM"),aD.forEach((sr,mr)=>{sr.id===this.id&&aD.splice(mr,1)});return}_r++,Cr()},hke)}),aD.push(this)}}const Ike=ue=>{const ge=ue instanceof Element?"element":"id";return aD.find(pe=>pe[ge]===ue)??null};function kke(ue,ge){const pe=document.createElement("input");return pe.type="hidden",pe.name=ue,pe.value=ge,pe}function _ke(ue){return ue.replace(/\[/g,"%5B").replace(/\]/g,"%5D")}function uY({template:ue,title:ge,description:pe,dependencies:ke,files:We,settings:Cr}){if(!rY.includes(ue)){const sr=rY.map(mr=>`'${mr}'`).join(", ");console.warn(`Unsupported project.template: must be one of ${sr}`)}const $r=[],_r=(sr,mr,or="")=>{$r.push(kke(sr,typeof mr=="string"?mr:or))};_r("project[title]",ge),typeof pe=="string"&&pe.length>0&&_r("project[description]",pe),_r("project[template]",ue,"javascript"),ke&&(ue==="node"?console.warn("Invalid project.dependencies: dependencies must be provided as a 'package.json' file when using the 'node' template."):_r("project[dependencies]",JSON.stringify(ke))),Cr&&_r("project[settings]",JSON.stringify(Cr)),Object.entries(We).forEach(([sr,mr])=>{_r(`project[files][${_ke(sr)}]`,mr)});const nr=document.createElement("form");return nr.method="POST",nr.setAttribute("style","display:none!important;"),nr.append(...$r),nr}function Oke(ue,ge){const pe=uY(ue);return pe.action=lR("/run",ge),pe.id="sb_run",` + + + + ${pe.outerHTML} + + + + + + + + + + + + + +
Skip to content

Customized Service

Free

Free professional K Line component

$ 0

  • Highly scalable core chart
  • Full features Pro version chart
  • Complete development documents
  • Development discussion WeChat group

Contact the developer to join the development discussion group.

Sponsor

Comprehensive answers to development issues

Sponsor$ 78

  • All services in the free version
  • More sample codes
  • Homepage sponsor advertising space
  • One-on-one Q&A

Sponsor to the project on the sponsorship page, and after completion, contact the developer to join the exclusive Q&A group.

Customized

Exclusive customization and extended development

$ Discussion

  • All services of the sponsored version
  • UI custom development
  • Extended custom development
  • Other chart custom development

Contact developers to discuss specific requirements.

+ + + + \ No newline at end of file diff --git a/en-US/guide/changelog.html b/en-US/guide/changelog.html new file mode 100644 index 0000000..b698aa7 --- /dev/null +++ b/en-US/guide/changelog.html @@ -0,0 +1,26 @@ + + + + + + 📠 Change Log | KLineChart + + + + + + + + + + + + + + + +
Skip to content

📠 Change Log

9.8.10

2024-06-06

  • 🐞 Fix the issue of blurry drawing of basic graphics rect, line.
  • 🐞 Fix the inaccurate zooming issue of instance methods zoomAtCoordinate, zoomAtDataIndex and zoomAtTimestamp.
  • 🐞 Fix the issue of possible error in x-axis zooming.
  • 💄 Optimize the instance method subscribeAction. When type is 'onScroll' and 'onZoom', the callback method adds a new parameter.
  • 💄 Optimize the sub-item attrs in the indicator attribute figures. Add callback parameter data.

9.8.9

2024-05-28

  • 🐞 Fix style configuration yAxis.type: 'percentage' error.
  • 🐞 Fix declaration issue in typescript.

9.8.8

2024-05-14

  • 🐞 Fix the issue that the style configuration candle.tooltip.custom cannot be overridden when it is an array.
  • 🐞 Fix the issue of decimal folding.
  • 💄 Optimize the parameter precision in the overlay callback method.

9.8.7

2024-05-10

  • 🐞 Fix the issue of unsynchronized price and volume precision in indicator precision.

9.8.6

2024-05-07

  • 🐞 Fix an issue that chart API registerIndicator and registerOverlay parameters extendData cannot take effect.
  • 🐞 Fix an issue of incorrect decimal folding when specifying . as the thousandth character.
  • 🐞 Fix an issue where overlays may not be moved after being created.

9.8.5

2024-04-14

  • 💄 Optimize the default right offset distance of the chart.
  • 🐞 Fix area chart display issue.
  • 🐞 Fix occasional blank spaces in chart.

9.8.3

2024-04-12

  • 💄 Optimize styles by adding offsetLeft, offsetTop, offsetRight and offsetBottom to candle.tooltip and indicator.tooltip.
  • 💄 Optimize figure and support array for attrs.
  • 💄 Optimize y-axis render.
  • 💄 Optimize default display, change the default candle width to 8.
  • 🐞 Fix applyMoreData add duplicate data issue. @cryptotooltop

9.8.2

2024-03-26

  • 💄 Optimize the display of the area chart.
  • 💄 Optimize smooth line drawing.
  • 🐞 Fix the overlay and drawing it to future time may not be an issue.

9.8.1

2024-03-13

  • 🐞 Fix an issue where initialize only xAxis in layout caused the chart to fail to initialize.
  • 🐞 Fix an issue when modify the built-in indicator VOL to calcParams.
  • 💄 Optimize the accuracy of width calculation when display decimal fold on the y-axis.
  • 💄 Optimize wheel event trigger.

9.8.0

2024-03-04

  • 🆕 Support custom coordinate axis.
  • 🆕 Support indicator mapping to future time.
  • 🆕 Support folding long decimals.
  • 🆕 Support adding data forward and backward.
  • 🐞 Fix formatting time issue for different browsers.

2024-01-12

  • 🐞 Fix the issue of ineffective indicator attributes minValue and maxValue.
  • 🐞 Fix the display issue on the x-axis of the overlay.
  • 💄 Optimize the display of style candle.type: 'ohlc'.
  • 💄 Optimize drawing clarity.

9.7.1

2023-12-18

  • 🐞 Fix indicators and overlays methods not effect error.
  • 🐞 Fix package manager download node version dependency error.

9.7.0

2023-12-12

  • 🆕 Add instance apissetMaxOffsetLeftDistance and setMaxOffsetRightDistance.
  • 🆕 Add indicator attribute zLevel.
  • 💄 Optimize the rendering of the ohlc candle bar.
  • 🐞 Fix the blurry issue with the candle bar.
  • 🐞 Fix the rendering rules for the zLevel overlay.

9.6.0

2023-11-14

  • 🖋️ Refactor the separator module.
  • 🆕 Chart api init(ds, options), parameter options add layout.
  • 🆕 Instance api createIndicator(value, isStack, paneOptions, callback), parameter PaneOptions add position.
  • 🆕 Style candle.tooltip.custom adds turnover string template.
  • 💄 Optimize the style overlay.text configuration.
  • 💄 Optimize the implementation of utils.clone and utils.merge.
  • 🐞 Fix the issue of multiple overlay styles display error.
  • 🐞 Fix the issue of multiple indicator styles display error.

9.5.4

2023-09-22

  • 🐞 Fix the issue of not display the latest price line when the style candle.type is area.
  • 🐞 Fix the issue of incorrect display of the style crosshair.vertical.text.paddingLeft.

9.5.3

2023-09-19

  • 🐞 Fix typescript import error.

9.5.2

2023-09-18

  • 💄 Optimize the figure text.
  • 💄 Optimize built-in overlays simpleAnnotation and simpleTag.
  • 💄 Optimize the free style of technical indicators and support increment.
  • 🐞 Fix typescript declaration issue.

9.5.1

2023-08-14

  • 🆕 Add chart api getOverlayClass.
  • 🆕 Style configuration candle.tooltip.custom add built-in support change.
  • 💄 Optimize figure rect event trigger.
  • ↩️ Separator event trigger optimization rollback.

9.5.0

2023-06-15

  • 🆕 Overlay add event onDoubleClick, add property modeSensitivity.
  • 🆕 Style configuration candle.tooltip.custom supports string templates.
  • 🐞 Optimize the scrolling frame drop issue on the mobile side.
  • 🐞 Fix pane id naming typo.
  • 💄 Optimize the response sensitivity of dividing line events.
  • 💄 Optimize the attrs type declaration in OverlayFigure under typescript.

9.4.0

2023-05-25

  • 🆕 Instance API 'createOverlay' supports arrays.
  • 🆕 overlay add attributes paneId, defaultZLevel and zLevel.
  • 🆕 xAxis add methods convertTimestampFromPixel and convertTimestampToPixel.
  • 💄 Optimize the display of candle.

9.3.0

2023-05-13

  • 🆕 Add chart API utils.calcTextWidth.
  • 🆕 The instance APIs createIndicator(value, isStack, options) and setPaneOptions(options) have added options. axisOptions.
  • 🆕 The indicator graphic configuration supports customization.
  • 💄 Optimize the bar width ratio.
  • 💄 Optimize internal acquisition of screen pixel ratio.
  • 💄 Optimize internal ID generation.

9.2.2

2023-05-04

  • 🐞 Fix figure line check event error.
  • 💄 Optimize type check.

9.2.1

2023-04-27

  • 💄 Optimize the default style by changing #EF5350 to #F92855 and #26A69A to #2DC08E.
  • 💄 Optimize typescript declarations.

9.2.0

2023-04-24

  • 🆕 Add instance API getOffsetRightDistance and executeAction.
  • 🆕 Add success callback for instance API applyNewData, applyMoreData and updateData.
  • 🆕 Support the display of thousands.
  • 🆕 Add style configuration candle.bar.upBorderColor, candle.bar.downBorderColor, candle.bar.noChangeBorderColor, candle.bar.upWickColor, candle.bar.downWickColor, candle.bar.noChangeWickColor, candle.tooltip.rect.position and candle.tooltip.rect.offsetBottom.
  • 🆕 Add realFrom and realTo to all visibleRange.
  • 💄 Optimize API, klinecharts.utils.isValid and klinecharts.utils.formatBigNumber.
  • 💄 Optimize the log output in the development environment.

9.1.3

2023-04-15

  • 🐞 Fix the issue of not refreshing when the input parameter of the chart API applyNewData is an empty array.
  • 🐞 Fix the issue of cross cursor text not displaying on the y-axis when there is no data.
  • 💄 Optimize the display of area chart.
  • 💄 Optimize coverage event callback parameters and add figureKey and figureIndex.
  • 💄 Optimize typescript overlay style types, as well as base types DeepPartial and DeepRequired.

9.1.2

2023-04-10

  • 🐞 Fix the issue of inaccurate triggering events for the built-in figure line.
  • 🐞 Fix the issue of triggering events for the first time after the simpleAnnotation and simpleTag built-in overlays are drawn.
  • 💄 Optimize overlay figure to ignore events and support event selection.

9.1.1

2023-03-14

  • 🐞 Fix the invalidity of the built-in figure arc.
  • 💄 Optimize rendering updates.

9.1.0

2023-02-23

  • 🆕 The chart instance method subscribeAction and unsubscribeAction types add onCandleBarClick.
  • 🆕 The overlay supports double-clicking to force the end of drawing.
  • 💄 Optimize event handling.

9.0.1

2023-02-17 🐞 Fix the introduction of typescript.

9.0.0

2023-02-16

  • 🛠 Typescript refactoring.
  • 🆕 New features
    • Add Y axis direction zoom and scroll.
    • API
      • New chart methods registerFigure, getSupportFigures, getFigureClass, rigiderOverlay, getSupportOverlays, registerLocale, getSupportLocales, registerStyles are added.
      • New instance methods, getSize, setLocale, getLocal, setCustomApi, getVisibleRange, createOverlay, getOverlayById, overrideOverlay, removeOverlay.
    • Style Configuration
      • Add candle.priceMark.last.text.borderStyle, candle.tooltip.icons, indicator.lastValueMark.text.borderStyle, indicator.tooltip.icons, crosshair.horizontal. text.borderStyle, crosshair.vertical.text.borderStyle.
  • 👉 Change
    • API
      • Chart method extension.addTechnicalIndicatorTemplate is changed to registerIndicator.
      • Chart method extension.addShapeTemplate is changed to registerOverlay.
      • Instance method setStyleOptions is changed to setStyles.
      • Instance method getStyleOptions is changed to getStyles.
      • Instance method setPaneOptions(options), options add new attribute gap.
      • Instance method setOffsetRightSpace is changed to setOffsetRightDistance.
      • Instance method createTechnicalIndicator is changed to createIndicator
      • Instance method overlayTechnicalIndicator is changed to overrideIndicator.
      • Instance method getTechnicalIndicatorByPaneId is changed to getIndicatorByPaneId.
      • Instance method removeTechnicalIndicator is changed to removeIndicator.
    • Style Configuration
      • All line.style options are changed to solid and dashed.
      • All dashValue is changed to dashedValue.
      • xAxis.height is changed to xAxis.size, xAxis.tickeText.paddingTop is changed to xAxis.tickeText.marinStart, and xAxis.tickeText.paddingBottom is changed to xAxis.tickeText.marinEnd.
      • yAxis.height is changed to yAxis.size, yAxis.tickeText.paddingTop is changed to yAxis.tickeText.marinStart, and yAxis.tickeText.paddingBottom is changed to yAxis.tickeText.marinEnd.
      • technicalIndicator.bar is changed to indicator.bars, technicalIndicator.line is changed to indicator.linestechnicalIndicator.circle is changed to indicator.circles
    • Custom Extension
      • The technical indicator attribute calcParams has been changed to support any type.
      • The technical indicator attribute plots is changed to figures.
      • The technical indicator attribute regeneratePlots is changed to' regeneratefigures'.
      • The technical indicator attribute calcTechnicalIndicator is changed to calc.
      • The technical indicator attribute render is changed to 'draw'.
  • 🗑 Abandonment
    • API
      • Delete instance methods getWidth, getHeight, and use getSize instead.
      • Delete instance methods createShape, createAnnotation, createTag, and use createOverlay instead.
      • Delete instance methods removeShape, removeAnnotation, removeTag. Use removeOverlay instead.
      • Delete the instance method setShapeOptions and use overrideOverlay instead.
      • Delete instance methods createHtml, removeHtml, addTechnicalIndicatorTemplate, getTechnicalIndicatorTemplate, addShapeTemplate.
    • Style Configuration
      • Delete shape, annotation, tag and use overlay instead.
      • Delete candle.margintechnicalIndicator.margin
    • Custom Extension
      • The related attributes are no longer saved in the technical indicator template.
      • Delete Shape and use Overlay instead.

8.x

Go to Github to check the change log for 8.x.

7.x

Go to Github to check the change log for 7.x.

6.x

Go to Github to check the change log for 6.x.

5.x

Go to Github to view the 5.x release notes.

4.x

Go to Github to view the 4.x release notes.

+ + + + \ No newline at end of file diff --git a/en-US/guide/chart-api.html b/en-US/guide/chart-api.html new file mode 100644 index 0000000..3c60ca1 --- /dev/null +++ b/en-US/guide/chart-api.html @@ -0,0 +1,440 @@ + + + + + + Chart API | KLineChart + + + + + + + + + + + + + + + +
Skip to content

Chart API

init(ds, options)

typescript
(
+   ds: string | HTMLElement,
+   options?: {
+      layout?: Array<{
+         type: 'candle' | 'indicator' | 'xAxis'
+         content: Array<Indicator | string>
+         options: {
+            id?: string
+            height?: number
+            minHeight?: number
+            dragEnabled?: boolean
+            position?: 'top' | 'bottom'
+            gap?: {
+               top?: number
+               bottom?: number
+            }
+            axisOptions?: {
+               name?: string
+               scrollZoomEnabled?: boolean
+            }
+         }
+      }>
+      locale?: string
+      timezone?: string
+      styles?: string | object
+      customApi?: {
+         formatDate?: (dateTimeFormat: Intl.DateTimeFormat, timestamp: number, format: string, type: number) => string
+         formatBigNumber?: (value: string | number) => string
+      }
+      thousandsSeparator?: string
+      decimalFoldThreshold?: number
+   }
+) => Chart

Initialize a chart and return the chart instance.

  • ds container, can be dom element or element id.
  • options optional configuration items.
    • layout custom layout, content and options refer to the input parameters value and options in the instance api createIndicator. ^9.6.0
    • locale language, built-in support for zh-CN and en-US.
    • timezone time zone name, such as 'Asia/Shanghai', if not set, it will automatically get the local time zone, please refer to timezone list.
    • styles It can be the style name registered through klinecharts.registerStyles, or it can be an object, a list of styles, see styles for details, and supports increments.
    • customApi customize some APIs.
      • formatDate formats a date.
      • formatBigNumber format big numbers, such as 1000 into 1k, 1000000 into 1M, etc.\
    • thousandsSeparator thousands separator
    • decimalFoldThreshold decimal fold threshold ^9.8.0

dispose(dcs)

typescript
(dcs: HTMLElement | Chart | string) => void

Destroys a chart, once destroyed the chart will no longer be available.

  • dcs can be a dom element, element id or chart instance.

registerLocale(locale, locales)

typescript
(
+   locale: string,
+   locales: {
+     time: string
+     open: string
+     high: string
+     low: string
+     close: string
+     volume: string
+   }
+) => void

Add a localization language. Charts have built-in zh-CN and en-US.

  • locale language name
  • locales language configuration

getOverlayClass()

typescript
(name: string) => Nullable<OverlayConstructor>

Get chart's overlay attributes by overlay name.

getSupportedLocales()

typescript
() => string[]

Get the localized language types supported by the chart.

registerStyles(name, styles)

typescript
(
+   name: string,
+   styles: object
+) => void

Add a style configuration.

  • name style name
  • styles style configuration, refer to style for the type, support increment.

registerFigure(figure)

typescript
(
+   figure: {
+      name: string
+      draw: (ctx: CanvasRenderingContext2D, attrs: any, styles: object) => void
+      checkEventOn: (coordinate: Coordinate, attrs: any, styles: object) => boolean
+   }
+) => void

Add a figure.

  • figure Basic figure information, see figure for details
    • name name, unique identifier
    • draw drawing method
    • checkEventOn checks if the event is on the graph

getSupportedFigures()

typescript
() => string[]

Get the basic graph type supported by the graph.

getFigureClass(name)

typescript
(name: string) => Figure

Get graph class.

  • name name

registerIndicator(indicator)

typescript
(
+   indicator: {
+      name: string
+      shortName?: string
+      precision?: number
+      calcParams?: any[]
+      shouldOhlc?: boolean
+      shouldFormatBigNumber?: boolean
+      visible?: boolean
+      extendData?: any
+      series?: 'normal' | 'price' | 'volume'
+      figures?: Array<{
+         key: string
+         title?: string
+         type?: string
+         baseValue?: number
+         attrs?: ({
+            data: object
+            coordinate: object
+            bounding: object
+            barSpace: object
+            xAxis: object
+            yAxis: object
+         }) => object
+         styles?: (
+            data: object,
+            indicator: object,
+            defaultStyles: object
+         ) => object
+      }>
+      minValue?: number
+      maxValue?: number
+      styles?: object
+      calc: (dataList: KLineData[], indicator: object) => Promise<object[]> | object[]
+      regenerateFigures?: (calcParms: any[]) => Array<{
+         key: string
+         title?: string
+         type?: string
+         baseValue?: number
+         styles?: (
+            data: object
+            indicator: object
+            defaultStyles: object
+         ) => object
+         attrs: (
+            coordinate: object
+            bounding: Bounding
+            barSpace: BarSpace
+            xAxis: XAxis
+            yAxis: YAxis
+         ) => object
+      }>
+      createTooltipDataSource?: (params: object) => {
+         name?: string
+         calcParamsText?: string
+         values?: Array<{
+            title: string | {
+               text: string
+               color: string
+            }
+            value: string | {
+               text: string
+               color: string
+            }
+         }>
+      }
+      draw?: (params: object) => boolean
+   }
+) => void

Add a technical indicator.

  • indicator technical indicator information
    • name indicator name, unique identifier for creation and operation
    • shortName short name for display
    • precision precision
    • calcParams calculation parameters
    • shouldOhlc needs ohlc auxiliary graphics
    • shouldFormatBigNumber should format large numbers. For example, 1000 is converted to 1k, 1000000 is converted to 1M, etc.
    • visible visible or not
    • extendData extended data
    • series indicator series, options are 'normal', 'price' and 'volume'
    • figures graphics configuration
    • minValue specifies the minimum value
    • maxValue specifies the maximum value
    • styles styles
    • calc calculation method
    • regenerateFigures method to regenerate figure information
    • createTooltipDataSource method to create custom tip information
    • draw custom drawing method

getSupportedIndicators()

typescript
() => string[]

Get technical indicators for chart support.

registerOverlay(overlay)

typescript
(
+   overlay: {
+      name: string
+      totalStep?: number
+      lock?: boolean
+      visible?: boolean
+      zLevel?: number
+      needDefaultPointFigure?: boolean
+      needDefaultXAxisFigure?: boolean
+      needDefaultYAxisFigure?: boolean
+      mode?: 'normal' | 'weak_magnet' | 'strong_magnet'
+      modeSensitivity?: number
+      points?: Array<{ timestamp: number, dataIndex?: number, value?: number }>
+      extendData?: any
+      styles?: object
+      createPointFigures?: (params: object) => {
+         key?: string
+         type: string
+         attrs: any | any[]
+         styles?: any
+         ignoreEvent?: boolean | OverlayFigureIgnoreEventType[]
+      } | Array<{
+         key?: string
+         type: string
+         attrs: any | any[]
+         styles?: any
+         ignoreEvent?: boolean | OverlayFigureIgnoreEventType[]
+      }>
+      createXAxisFigures?: (params: object) => {
+         key?: string
+         type: string
+         attrs: any | any[]
+         styles?: any
+         ignoreEvent?: boolean | OverlayFigureIgnoreEventType[]
+      } | Array<{
+         key?: string,
+         type: string,
+         attrs: any | any[]
+         styles?: any
+         ignoreEvent?: boolean | OverlayFigureIgnoreEventType[]
+      }>
+      createYAxisFigures?: (params: object) => {
+         key?: string
+         type: string
+         attrs: any | any[]
+         styles?: any
+         ignoreEvent?: boolean | OverlayFigureIgnoreEventType[]
+      } | Array<{
+         key?: string
+         type: string
+         attrs: any | any[]
+         styles?: any
+         ignoreEvent?: boolean | OverlayFigureIgnoreEventType[]
+      }>
+      performEventPressedMove?: (params: object) => void
+      performEventMoveForDrawing?: (params: object) => void
+      onDrawStart?: (event: object) => boolean
+      onDrawing?: (event: object) => boolean
+      onDrawEnd?: (event: object) => boolean
+      onClick?: (event: object) => boolean
+      onDoubleClick?: (event: object) => boolean
+      onRightClick?: (event: object) => boolean
+      onPressedMoveStart?: (event: object) => boolean
+      onPressedMoving?: (event: object) => boolean
+      onPressedMoveEnd?: (event: object) => boolean,
+      onMouseEnter?: (event: object) => boolean
+      onMouseLeave?: (event: object) => boolean
+      onRemoved?: (event: object) => boolean
+      onSelected?: (event: object) => boolean
+      onDeselected?: (event: object) => boolean
+   }
+) => void

Add a overlay.

  • overlay overlay information, see overlay for details
    • name overlay name, unique identifier for creation
    • totalStep total implementation steps
    • lock is locked to prevent dragging
    • visible visible or not
    • zLevel draw level
    • needDefaultPointFigure needs the default point figure
    • needDefaultXAxisFigure needs the default x-axis figure
    • needDefaultYAxisFigure needs the default y-axis figure
    • mode mode, options are 'normal', 'weak_magnet' and 'strong_magnet'
    • modeSensitivity mode sensitivity, only valid when mode is weak_magnet ^9.5.0
    • points point information
    • extendData extended data
    • styles styles
    • createPointFigures creates figures corresponding to points
    • createXAxisFigures creates figures on the x-axis
    • createYAxisFigures creates figures on the y-axis
    • performEventPressedMove special handling method for press and move event
    • performEventMoveForDrawing special processing method during moving event
    • onDrawStart start drawing event
    • onDrawing drawing event
    • onDrawEnd draw end event
    • onClick click event
    • onDoubleClick double click event ^9.5.0
    • onRightClick right click event
    • onPressedMoveStart press start move event
    • onPressedMoving Press and move event
    • onPressedMoveEnd Press and move end event
    • onMouseEnter mouse enter event
    • onMouseLeave mouse out event
    • onRemoved delete event
    • onSelected selected event
    • onDeselected deselected event

getSupportedOverlays()

typescript
() => string[]

Get overlays for chart support.

registerXAxis(axis) ^9.8.0

typescript
(
+  axis: {
+    name: string
+    createTicks: (params: object) => Array<{
+      coord: number
+      value: number | string
+      text: string
+    }>
+  }
+) => void

Add custom x-axis.

  • axis axis info
    • name axis name
    • createTicks create ticks

registerYAxis(axis) ^9.8.0

typescript
(
+  axis: {
+    name: string
+    createTicks: (params: object) => Array<{
+      coord: number
+      value: number | string
+      text: string
+    }>
+  }
+) => void

Add custom y-axis.

  • axis axis info
    • name axis name
    • createTicks create ticks

version()

typescript
() => string

Get the current version number of the chart.

utils

A collection of helper methods.

utils.clone(target)

typescript
(target: any) => any

deep copy.

utils.merge(target, source)

typescript
(target: object, source: object) => void

Merge one object into another.

utils.isString(value)

typescript
(value: any) => boolean

Checks if a value is a string.

utils.isNumber(value)

typescript
(value: any) => boolean

Checks if a value is a number.

utils.isValid(value)

typescript
(value: any) => boolean

Checks if a value is valid.

utils.isObject(value)

typescript
(value: any) => boolean

Checks if a value is an object.

utils.isFunction(value)

typescript
(value: any) => boolean

Checks if a value is a method.

utils.isBoolean(value)

typescript
(value: any) => boolean

Checks if a value is a bool value.

utils.formatValue(value, key, defaultValue)

typescript
(data: any, key: string, defaultValue?: any) => any

Get the corresponding value from a certain value, support nesting, such as const o = { a: { b: { c: 1 } } }, formatValue(o, 'a.b.c') takes the value of c .

utils.formatPrecision(value)

typescript
(value: string | number, precision?: number) => string

Formatting precision.

utils.formatBigNumber(value)

typescript
(value: string | number) => string

Format large numbers, such as 1000 into 1k, 1000000 into 1M, etc.

utils.formatDate(dateTimeFormat, timestamp, format)

typescript
(dateTimeFormat: Intl.DateTimeFormat, timestamp: number, format: string) => string

Format date. format, such as 'YYYY-MM-DD HH:mm:ss'.

utils.formatThousands(value, sign)

typescript
(value: string | number, sign: string) => string

Format thousands separator.

utils.formatFoldDecimal(value, threshold) ^9.8.0

typescript
(value: string | number, threshold: number) => string

Format fold decimal.

utils.calcTextWidth(text, size, weight, family) ^9.3.0

typescript
(text: string, size?: number, weight?: string | number, family?: string) => number

Calculate text width.

utils.getLinearSlopeIntercept(coordinate1, coordinate2)

typescript
(
+   coordinate1: {
+      x: number
+      y: number
+   },
+   coordinate2: {
+      x: number
+      y: number
+   }
+) => []

According to two coordinate points, get the slope and constant term of the line composed of points, namely k and b in y = kx + b.

utils.getLinearYFromCoordinates(coordinate1, coordinate2, targetCoordinate)

typescript
(
+  coordinate1: {
+      x: number
+      y: number
+   },
+   coordinate2: {
+      x: number
+      y: number
+   },
+   targetCoordinate: {
+      x: number
+      y: number
+   }
+) => number

Get the y-axis coordinate value of a point on the line formed by two other coordinate points.

utils.getLinearYFromSlopeIntercept(kb, targetCoordinate)

typescript
(
+   kb: Array<number>,
+   targetCoordinate: {
+      x: number
+      y: number
+   }
+) => number

Get the y-coordinate value of a point on the line formed by the slope and the constant term.

utils.checkCoordinateOnArc(coordinate, arc)

typescript
(
+   coordinate: {
+      x: number
+      y: number
+   },
+   arc: {
+      x: number
+      y: number
+      r: number
+      startAngle: number
+      endAngle: number
+   }
+) => boolean

Check whether a certain coordinate point is on the arc.

  • coordinate coordinate point information
  • arc arc parameter
    • x the x-axis value of the center of the circle
    • y the y-axis value of the center of the circle
    • r radius
    • startAngle start angle
    • endAngle end angle

utils.checkCoordinateOnCircle(coordinate, circle)

typescript
(
+   coordinate: {
+      x: number
+      y: number
+   },
+   circle: {
+      x: number
+      y: number
+      r: number
+   }
+) => boolean

Checks whether a certain coordinate point is on a circle.

  • coordinate coordinate point information
  • circle circle parameter
    • x the x-axis value of the center of the circle
    • y the y-axis value of the center of the circle
    • r radius

utils.checkCoordinateOnLine(coordinate, line)

typescript
(
+   coordinate: {
+      x: number
+      y: number
+   },
+   line: {
+      coordinates: Array<{
+         x: number
+         y: number
+      }>
+   }
+) => boolean

Check if a certain coordinate point is on the line.

utils.checkCoordinateOnPolygon(coordinate, polygon)

typescript
(
+   coordinate: {
+      x: number
+      y: number
+   },
+   polygon: {
+      coordinates: Array<{
+         x: number
+         y: number
+      }>
+   }
+) => boolean

Checks whether a certain coordinate point is on a polygon.

utils.checkCoordinateOnRect(coordinate, rect)

typescript
(
+   coordinate: {
+      x: number
+      y: number
+   },
+   rect: {
+      x: number
+      y: number
+      width: number
+      height: number
+   }
+) => boolean

Checks whether a certain coordinate point is on a rectangle.

  • coordinate coordinate point information
  • rect rectangle parameter
    • x starting point x-axis value
    • y starting point y-axis value
    • width width
    • height height

utils.checkCoordinateOnText(coordinate, text, styles)

typescript
(
+   coordinate: {
+      x: number
+      y: number
+   },
+   text: {
+      x: number
+      y: number
+      text: any
+      align?: 'center' | 'end' | 'left' | 'right' | 'start'
+      baseline?: 'alphabetic' | 'bottom' | 'hanging' | 'ideographic' | 'middle' | 'top'
+   },
+   styles: {
+      color?: string
+      size?: number
+      family?: string
+      weight?: number | string
+   }
+) => boolean

Check if a certain coordinate point is on the text.

  • coordinate coordinate point information
  • text text parameter
    • x starting point x-axis value
    • y starting point y-axis value
    • text text content
    • align horizontal alignment
    • baseline vertical alignment
  • styles styles
    • color color
    • size size
    • family font
    • weight weight

utils.drawArc(ctx, arc, styles)

typescript
(
+   ctx: CanvasRenderingContext2D,
+   arc: {
+      x: number
+      y: number
+      r: number
+      startAngle: number
+      endAngle: number
+   },
+   styles: {
+      style?: 'solid' | 'dashed'
+      size?: number
+      color?: string
+      dashedValue?: number[]
+   }
+) => void

Draw an arc.

  • ctx canvas context
  • arc arc parameter
    • x the x-axis value of the center of the circle
    • y the y-axis value of the center of the circle
    • r radius
    • startAngle starting angle
    • endAngle end angle
  • styles styles
    • style arc style
    • size thickness
    • color color
    • dashedValue Dashed parameter value

utils.drawCircle(ctx, circle, styles)

typescript
(
+   ctx: CanvasRenderingContext2D,
+   circle: {
+      x: number
+      y: number
+      r: number
+   },
+   styles: {
+      style?: 'stroke' | 'fill' | 'stroke_fill'
+      color?: string | CanvasGradient
+      borderColor?: string
+      borderSize?: number
+      borderStyle?: 'solid' | 'dashed'
+      borderDashedValue?: Array<number>
+   }
+) => void

Draw the circle.

  • ctx canvas context
  • circle circle parameter
    • x the x-axis value of the center of the circle
    • y the y-axis value of the center of the circle
    • r radius
  • styles styles
    • style style
    • color color
    • borderColor border color
    • borderSize border thickness
    • borderStyle border style
    • borderDashedValue border dashed line parameter value

utils.drawLine(ctx, line, styles)

typescript
(
+   ctx: CanvasRenderingContext2D,
+   line: {
+      coordinates: Array<{
+         x: number
+         y: number
+      }>
+   },
+   styles: {
+      style?: 'solid' | 'dashed'
+      size?: number
+      color?: string
+      dashedValue?: number[]
+   }
+) => void

Draw the line.

  • ctx canvas context
  • line line parameter
  • styles styles
    • style line style
    • size thickness
    • color color
    • dashedValue Dashed parameter value

utils.drawPolygon(ctx, polygon, styles)

typescript
(
+   ctx: CanvasRenderingContext2D,
+   polygon: {
+      coordinates: Array<{
+         x: number
+         y: number
+      }>
+   },
+   styles: {
+      style?: 'stroke' | 'fill' | 'stroke_fill'
+      color?: string | CanvasGradient
+      borderColor?: string
+      borderSize?: number
+      borderStyle?: 'solid' | 'dashed'
+      borderDashedValue?: Array<number>
+   }
+) => void

Draw the polygon.

  • ctx canvas context
  • polygon polygon parameter
  • styles styles
    • style style
    • color color
    • borderColor border color
    • borderSize border thickness
    • borderStyle border style
    • borderDashedValue border dashed line parameter value

utils.drawRect(ctx, rect, styles)

typescript
(
+   ctx: CanvasRenderingContext2D,
+   rect: {
+      x: number
+      y: number
+      width: number
+      height: number
+   },
+   styles: {
+      style?: 'stroke' | 'fill' | 'stroke_fill'
+      color?: string | CanvasGradient
+      borderColor?: string
+      borderSize?: number
+      borderStyle?: 'solid' | 'dashed'
+      borderDashedValue?: Array<number>
+      borderRadius?: number
+   }
+) => void

Draw a rectangle.

  • ctx canvas context
  • rect rectangle parameter
    • x starting point x-axis value
    • y starting point y-axis value
    • width width
    • height height
  • styles styles
    • style style
    • color color
    • borderColor border color
    • borderSize border thickness
    • borderStyle border style
    • borderDashedValue border dashed line parameter value
    • borderRadius border radius

utils.drawRectText(ctx, rectText, styles)

typescript
(
+   ctx: CanvasRenderingContext2D,
+   rectText: {
+      x: number
+      y: number
+      text: any
+      width?: number
+      height?: number
+      align?: 'center' | 'end' | 'left' | 'right' | 'start'
+      baseline?: 'alphabetic' | 'bottom' | 'hanging' | 'ideographic' | 'middle' | 'top'
+   },
+   styles: {
+      style?: 'stroke' | 'fill' | 'stroke_fill'
+      color?: string
+      size?: number
+      family?: string
+      weight?: number | string
+      paddingLeft?: number
+      paddingTop?: number
+      paddingRight?: number
+      paddingBottom?: number
+      borderStyle?: 'solid' | 'dashed'
+      borderDashedValue?: number[]
+      borderSize?: number
+      borderColor?: string
+      borderRadius?: number
+      backgroundColor?: string
+   }
+) => void

Draw text.

  • ctx canvas context
  • rectText text parameter
    • x starting point x-axis value
    • y starting point y-axis value
    • text text content
    • width width
    • height height
    • align horizontal alignment
    • baseline vertical alignment
  • styles styles
    • style style
    • color color
    • size size
    • family font
    • weight weight
    • paddingLeft left padding,
    • paddingTop top padding,
    • paddingRight right padding,
    • paddingBottom bottom padding,
    • borderColor border color
    • borderSize border thickness
    • borderStyle border style
    • borderRadius border radius size
    • borderDashedValue border dashed line parameter value
    • backgroundColor background color

utils.drawRectText(ctx, rectText, styles)

Same as utils.drawRectText(ctx, text, styles), it is deprecated and will be deleted after v10. Please use utils.drawRectText(ctx, text, styles) instead.

+ + + + \ No newline at end of file diff --git a/en-US/guide/custom-axis.html b/en-US/guide/custom-axis.html new file mode 100644 index 0000000..417ae43 --- /dev/null +++ b/en-US/guide/custom-axis.html @@ -0,0 +1,101 @@ + + + + + + Custom Axis ^9.8.0 | KLineChart + + + + + + + + + + + + + + + +
Skip to content

Custom Axis ^9.8.0

Chart support custom axis, which can be achieved through the chart api registerXAxis(axis) and registerYAxis(axis).

Input params introduction

typescript
{
+  // axis name
+  name: string
+  // implementation of create ticks
+  createTicks: (params: {
+    // range info
+    range: {
+      from: number
+      to: number
+      range: number
+      realFrom: number
+      realTo: number
+      realRange: number
+    }
+    // viewport
+    bounding: {
+      width: number
+      height: number
+      left: number
+      right: number
+      top: number
+      bottom: number
+    }
+    // default ticks info
+    defaultTicks: Array<{
+      coord: number
+      value: number | string
+      text: string
+    }>
+  }) => Array<{
+    coord: number
+    value: number | string
+    text: string
+  }>
+}

Usage

After register completed, you can use the sub item options.axisOptions.name in the options.layout parameter of the chart api init(ds, options) to specify the coordinate axis, or use the instance api createIndicator(value, isStack, paneOptions, callback) and setPaneOptions(paneOptions) parameter paneOptions.axisOptions.name to specify it.

Using init of chart api

typescript
init(
+  // The domId here uses its own defined container ID instead
+  `${domId}`,
+  {
+    layout: [
+      {
+        type: 'candle',
+        options: {
+          axisOptions: {
+            // The customYAxisName here uses the name used when customizing the y-axis instead
+            name: `${customYAxisName}`
+          }
+        }
+      },
+      {
+        type: 'xAxis',
+        options: {
+          position: 'bottom',
+          axisOptions: {
+            // The customXAxisName here uses the name used when customizing the x-axis instead
+            name: `${customXAxisName}`
+          }
+        }
+      }
+    ]
+  }
+)

Using createIndicator of instance api

typescript
createIndicator(
+  'MA',
+  false,
+  {
+    axisOptions: {
+      // The customYAxisName here uses the name used when customizing the y-axis instead
+      name: `${customYAxisName}`
+    }
+  }
+)

Using setPaneOptions of instance api

typescript
setPaneOptions({
+  id: 'candle_pane',
+  axisOptions: {
+    // The customYAxisName here uses the name used when customizing the y-axis instead
+    name: `${customYAxisName}`
+  }
+})
+ + + + \ No newline at end of file diff --git a/en-US/guide/data-source.html b/en-US/guide/data-source.html new file mode 100644 index 0000000..40bf60a --- /dev/null +++ b/en-US/guide/data-source.html @@ -0,0 +1,41 @@ + + + + + + 📚 Data | KLineChart + + + + + + + + + + + + + + + +
Skip to content

📚 Data

The data required for the chart must be in a fixed format. Through the chart API applyNewData(dataList, more), applyMoreData(dataList, more) and updateData(data) to interact data with the chart.

typescript
{
+  // Timestamp, millisecond, required fields
+  timestamp: number
+  // Open price, required fields
+  open: number
+  // Close price, required field
+  close: number
+  // Highest price, required field
+  high: number
+  // Lowest price, required field
+  low: number
+  // volume, optional field
+  volume: number
+  // Turnover, a non-required field, if you need to display the technical indicators 'EMV' and 'AVP', you need to fill this field with data.
+  turnover: number
+}
+ + + + \ No newline at end of file diff --git a/en-US/guide/environment.html b/en-US/guide/environment.html new file mode 100644 index 0000000..fabd4df --- /dev/null +++ b/en-US/guide/environment.html @@ -0,0 +1,29 @@ + + + + + + 🏝️ Environment | KLineChart + + + + + + + + + + + + + + + +
Skip to content

🏝️ Environment

Browser support

The chart is built based on html5 canvas and needs to run on a browser that supports canvas. If it needs to run on the mobile terminal, please use webview to load it.

Polyfill

core.js

The internal collection of the chart uses Map for compatibility with unsupported older browsers.

javascript
import 'core.js';
+import { init } from 'klincharts';

Intl.js

Charts rely on Intl, some browsers do not have this API.

javascript
import 'intl';
+import 'intl/local-data/jsonp/en';
+import { init } from 'klincharts';
+ + + + \ No newline at end of file diff --git a/en-US/guide/figure.html b/en-US/guide/figure.html new file mode 100644 index 0000000..5bbf64f --- /dev/null +++ b/en-US/guide/figure.html @@ -0,0 +1,269 @@ + + + + + + Figure | KLineChart + + + + + + + + + + + + + + + +
Skip to content

Figure

Figure are an important part of the chart. All elements on the chart are composed of figures. If you need to make complex custom technical indicators and overlays, it is recommended to read carefully. This document describes the built-in figures and how to customize a figure. The basic figure can be obtained through the chart method klinecharts.getFigureClass(name).

Example of use

Note

It needs to be used when there is a canvas context.

javascript
// Get the figure class
+// name is the name of the figure, such as 'arc', 'circle', etc.
+const Figure = klinecharts.getFigureClass(name)
+// instantiate and draw
+// attrs attribute
+// styles styles
+// ctx canvas context
+new Figure(attrs, styles).draw(ctx)

Built-in figures

These figures are built into the chart, arc, circle, line, polygon, rect, text, rectText.

arc

typescript
new ({
+   attrs: {
+     // The x-axis coordinate value of the center of the circle
+     x: number
+     // The y-axis coordinate value of the center of the circle
+     y: number
+     // radius
+     r: number
+     // start angle
+     startAngle: number
+     // end angle
+     endAngle: number
+   },
+   styles: {
+     // style, optional `solid`, `dashed`
+     style?: 'solid' | 'dashed'
+     // size
+     size?: number
+     // color
+     color?: string
+     // dotted line parameter
+     dashedValue?: number[]
+   }
+}) => Figure

circle

typescript
new ({
+   attrs: {
+     // The x-axis coordinate value of the center of the circle
+     x: number
+     // The y-axis coordinate value of the center of the circle
+     y: number
+     // radius
+     r: number
+   },
+   styles: {
+     // style, optional `fill`, `stroke`, `stroke_fill`
+     style?: 'fill' | 'stroke' | 'stroke_fill'
+     // color
+     color?: string
+     // border style
+     borderStyle?: 'solid' | 'dashed'
+     // border color
+     borderColor?: string
+     // frame size
+     borderSize?: number
+     // border dotted line parameters
+     borderDashedValue?: number[]
+   }
+}) => Figure

line

typescript
new ({
+  attrs: {
+    // set of coordinates
+    coordinates: Array<{
+      x: number
+      y: number
+    }>
+  },
+  styles: {
+    // style, optional `solid`, `dashed`
+    style?: 'solid' | 'dashed'
+    // size
+    size?: number
+    // color
+    color?: string
+    // dotted line parameter
+    dashedValue?: number[]
+  }
+}) => Figure

###polygon

typescript
new ({
+  attrs: {
+    // set of coordinates
+    coordinates: Array<{
+      x: number
+      y: number
+    }>
+  },
+  styles: {
+    // style, optional `fill`, `stroke`, `stroke_fill`
+    style?: 'fill' | 'stroke' | 'stroke_fill'
+    // color
+    color?: string
+    // border style
+    borderStyle?: 'solid' | 'dashed'
+    // border color
+    borderColor?: string
+    // frame size
+    borderSize?: number
+    // border dotted line parameter
+    borderDashedValue?: number[]
+  }
+}) => Figure

rect

typescript
new ({
+  attrs: {
+    // The x-axis coordinate value of the starting point
+    x: number
+    // The y-axis coordinate value of the starting point
+    y: number
+    // width
+    width: number
+    // high
+    height: number
+  },
+  styles: {
+    // style, optional `fill`, `stroke`, `stroke_fill`
+    style?: 'fill' | 'stroke' | 'stroke_fill'
+    // color
+    color?: string
+    // border style
+    borderStyle?: 'solid' | 'dashed'
+    // border color
+    borderColor?: string
+    // frame size
+    borderSize?: number
+    // border dotted line parameters
+    borderDashedValue?: number[]
+    // Border fillet value
+    borderRadius?: number
+  }
+}) => Figure

text

typescript
new ({
+  attrs: {
+    // The x-axis coordinate value of the starting point
+    x: number
+    // The y-axis coordinate value of the starting point
+    y: number
+    // Fixed width
+    width: number
+    // Fixed height
+    height: number
+    // text content
+    text: any
+    // alignment
+    align: CanvasTextAlign
+     // benchmark
+    baseline: CanvasTextBaseline
+  },
+  styles: {
+    // style, optional `fill`, `stroke`, `stroke_fill`
+    style?: 'fill' | 'stroke' | 'stroke_fill'
+    // color
+    color?: string
+    // size
+    size?: number
+    // font
+    family?: string
+    // thickness
+    weight?: string | number
+    // left padding
+    paddingLeft?: number
+    // right padding
+    paddingRight?: number
+    // top padding
+    paddingTop?: number
+    // Bottom padding
+    paddingBottom?: number
+    // border style
+    borderStyle?: 'solid' | 'dashed'
+    // border color
+    borderColor?: string
+    // frame size
+    borderSize?: number
+    // border dotted line parameter
+    borderDashedValue?: number[]
+    // Border fillet value
+    borderRadius?: number
+    // background color
+    backgroundColor?: string | CanvasGradient
+  }
+}) => Figure

rectText

Same as text, it is deprecated and will be deleted after v10. Please use text instead.

Customize figure

To create a custom figure, you only need to generate the figure information, and then add it globally through klinecharts.registerFigure, and add it to the chart to use it like the built-in figures.

Attribute description

typescript
{
+  // Figure name, a required field, is the unique identifier for creation
+  name: string
+
+  // Check whether the event is on the graph, return a boolean value
+  checkEventOn: (
+    // coordinates of the event
+    coordinate: {
+      x: number
+      y: number
+    },
+    // graphics properties
+    attrs: any,
+     // style of the graph
+    styles: any
+  ) => boolean
+
+  // draw
+  draw: (
+    // canvas context
+    ctx: CanvasRenderingContext2D,
+    // figure properties
+    attrs: any,
+    // style of the figure
+    styles: any
+  ) => void
+}

Example

The customization is specified with a diamond that can have a border and a background.

Step.1

First determine the attributes and styles. Attribute { x, y, width, height }, x is the x-axis coordinate value of the center point, y is the y-axis coordinate value of the center point, width is the width, and height is the height. Style { style, color, borderStyle, borderSize, borderColor, dashedValue }, style is the style type, we can define three options stroke, fill, stroke_fill, stroke has only a border, fill Only the background, stroke_fill has a border and a background, color is the color, borderStyle is the border style, you can define two options solid and dashed, solid is a solid line, dashed is a dashed line, borderSize is the border size, borderColor is the border color, and dashedValue is the dashed line value.

Step.2

Implement checkEventOn and draw two methods.

javascript
{
+   name: 'diamond',
+   checkEventOn: (coordinate, attrs) => {
+     const { x, y, width, height } = attrs
+     const xDis = Math.abs(coordinate.x - x)
+     const yDis = Math.abs(coordinate.y - y)
+     return xDis * height + yDis * width < width * height / 2
+   },
+   draw: (ctx, attrs, styles) => {
+     const { x, y, width, height } = attrs
+     const {
+       style = 'fill',
+       color = 'currentColor',
+       borderSize = 1,
+       borderColor = 'currentColor',
+       borderStyle = 'solid,
+       borderDashedValue = [2, 2]
+     } = styles
+     // Draw a filled diamond
+     if (style === 'fill' || styles.style === 'stroke_fill') {
+       ctx.fillStyle = color
+       ctx.beginPath()
+       ctx.moveTo(x - width / 2, y)
+       ctx.lineTo(x, y - height / 2)
+       ctx.lineTo(x + width / 2, y)
+       ctx.lineTo(x, y + height / 2)
+       ctx. closePath()
+       ctx.fill()
+     }
+     // Draw a border diamond
+     if (style === 'stroke' || styles.style === 'stroke_fill') {
+       ctx.strokeStyle = borderColor
+       ctx.lineWidth = borderSize
+       if (borderStyle === 'dashed') {
+         ctx.setLineDash(borderDashedValue)
+       } else {
+         ctx. setLineDash([])
+       }
+       ctx.beginPath()
+       ctx.beginPath()
+       ctx.moveTo(x - width / 2, y)
+       ctx.lineTo(x, y - height / 2)
+       ctx.lineTo(x + width / 2, y)
+       ctx.lineTo(x, y + height / 2)
+       ctx. closePath()
+       ctx.stroke()
+     }
+   }
+}

So a custom figure is completed.

+ + + + \ No newline at end of file diff --git a/en-US/guide/hot-key.html b/en-US/guide/hot-key.html new file mode 100644 index 0000000..45aecfb --- /dev/null +++ b/en-US/guide/hot-key.html @@ -0,0 +1,26 @@ + + + + + + ⌨️ Hot Key | KLineChart + + + + + + + + + + + + + + + +
Skip to content

⌨️ Hot Key

Currently only supports moving and zooming.

  • shift + move right
  • shift + move left
  • shift + + zoom in
  • shift + - zoom out
+ + + + \ No newline at end of file diff --git a/en-US/guide/i18n.html b/en-US/guide/i18n.html new file mode 100644 index 0000000..911f31a --- /dev/null +++ b/en-US/guide/i18n.html @@ -0,0 +1,35 @@ + + + + + + 🌏 Internationalization | KLineChart + + + + + + + + + + + + + + + +
Skip to content

🌏 Internationalization

Currently, the chart has two built-in en-US and zh-CN. The default language is en-US. If you need to use other languages, you can refer to the following scheme.

Adding new language

Adding new language is accomplished through klinecharts.registerLocale(key, locales).

For example, to add traditional Chinese language, you can do this,

typescript
klinecharts.registerLocale('zh-HK', {
+  time: '時間:',
+  open: '開:',
+  high: '高:',
+  low: '低:',
+  close: '收:',
+  volume: '成交量:',
+  turnover: '成交額:',
+  change: '漲幅:'
+})

Use new language

After adding new language, you can complete language switching through the chart API init(options) or setLocale(key).

+ + + + \ No newline at end of file diff --git a/en-US/guide/indicator.html b/en-US/guide/indicator.html new file mode 100644 index 0000000..5f85bef --- /dev/null +++ b/en-US/guide/indicator.html @@ -0,0 +1,268 @@ + + + + + + Technical indicator | KLineChart + + + + + + + + + + + + + + + +
Skip to content

Technical indicator

This document introduces the built-in technical indicators in the chart and how to customize a technical indicator.

Built-in technical indicators

NameDefault calc paramsNameDefault calc paramsNameDefault calc params
MA[5, 10, 30, 60]BIAS[6, 12, 24]VR[24, 30]
EMA[6, 12, 20]BRAR[26]WR[6, 10, 14]
SMA[12, 2]CCI[13]MTM[6, 10]
BBI[3, 6, 12, 24]DMI[14, 6]EMV[14, 9]
VOL[5, 10, 20]CR[26, 10, 20, 40, 60]SAR[2, 2, 20]
MACD[12, 26, 9]PSY[12, 6]AO[5, 34]
BOLL[20, 2]DMA[10, 50, 10]ROC[12, 6]
KDJ[9, 3, 3]TRIX[12, 20]PVTNone
RSI[6, 12, 24]OBV[30]AVPNone

Custom Technical Indicators

To create a custom technical indicator, you only need to generate a technical indicator information, and then add it globally through klinecharts.registerIndicator, add it to the chart and use it like the built-in technical indicator.

Attribute description

typescript
{
+  // indicator name
+  name: string
+  // The short name of the indicator, used for display, the name will be displayed by default
+  shortName?: string
+  // precision, default is 4
+  precision?: number
+  // calculation parameter
+  calcParams?: any[]
+  // Do you need ohlc
+  shouldOhlc?: boolean
+  // Do you need to format large data values, starting from 1000, for example, do you need to format 100K for 100000
+  shouldFormatBigNumber?: boolean
+  // Do you need visible
+  visible?: boolean
+  // z level
+  zLevel?: number
+  // extended data
+  extendData?: any
+  // series, default is 'normal'
+  series?: 'normal' | 'price' | 'volume'
+  // Data information
+  figures?: Array<{
+    // Used to get the median value of the calculation result
+    key: string
+    // for tooltip display
+    title?: string
+    // graphic type
+    type?: string
+    // Base value, if given, it will be drawn up and down with this value, generally used when the type is 'rect'
+    baseValue?: number
+    // is a method
+    attrs?: ({
+      data: IndicatorFigureAttrsCallbackData
+      coordinate: IndicatorFigureAttrsCallbackCoordinate
+      bounding: Bounding
+      barSpace: BarSpace
+      xAxis: XAxis
+      yAxis: YAxis
+    }) => IndicatorFigureAttrs
+    // is a method
+    styles?: (
+      data: {
+        // The data of the previous graph
+        prev: {
+          // k-line data, type refer to [data source]
+          kLineData?: KLineData,
+          // technical indicator data
+          indicatorData?: any
+        },
+        // data of the current graph
+        current: {
+          kLineData?: KLineData
+          indicatorData?: any
+        },
+        // Data for the next graph
+        next: {
+          kLineData?: KLineData,
+          indicatorData?: any
+        }
+      },
+      // technical chart example
+      indicator: Indicator
+      // The default technical indicator style, that is, the technical indicator style set globally, refer to the indicator in [Style]
+      defaultStyles: IndicatorStyle
+    ) => IndicatorFigureStyle
+  }>,
+  // The specified minimum value, default null
+  minValue?: number
+  // The specified maximum value, default null
+  maxValue?: number
+  // style, support increment, default is null, type refer to indicator in [style]
+  styles?: IndicatorStyle
+  // calculation method, can be a promise
+  calc: (
+    // data source, see [data source] for type
+    dataList: KLineData[],
+    // technical indicator example
+    indicator: indicator
+  ) => Promise<Array<any>> | Array<any>
+  // Regenerate figure graphic configuration method, which will be triggered after the calculation parameters change, refer to figures for the return type, the default is null
+  regenerateFigures?: (
+    // calculation parameter
+    calcParms: any[]
+  ) => Array<IndicatorFigure<D>>
+  // Create a custom hint text
+  createTooltipDataSource?: (params: {
+    // data source, see [data source] for type
+    kLineDataList: KLineData[]
+    // technical indicator example
+    indicator: Indicator
+    // Visible area information
+    visibleRange: {
+      // start data index
+      from: number
+      // end data index
+      to: number
+      // real start data index
+      realFrom: number
+      // real end data index
+      realTo: number
+    },
+    // window size information
+    bounding: {
+      // width
+      width: number
+      // high
+      height: number
+      // distance to the left
+      left: number
+      // distance to the right
+      right: number
+      // distance from top
+      top: number
+      // distance from bottom
+      bottom: number
+    },
+    // Information about the cross cursor
+    crosshair: {
+      // The window id where the cross point of the cross cursor is located
+      paneId?: string
+      // real x coordinate
+      realX?: number
+      // k-line data, type refer to [data source]
+      kLineData?: KLineData
+      // data index
+      dataIndex?: number
+      // real data index
+      realDataIndex?: number
+    },
+    // The default technical indicator style, that is, the technical indicator style set globally, refer to the indicator in [Style]
+    defaultStyles: IndicatorStyle
+    // x-axis component, some built-in conversion methods
+    xAxis: XAxis
+    // y-axis component, with some built-in conversion methods
+    yAxis: YAxis
+  }) => ({
+    // name
+    name?: string
+    // Calculate the parameter text, if name has no value, it will not be displayed
+    calcParamsText?: string
+    // value information
+    values?: Array<{
+      title: string | {
+        text: string
+        color: string
+      }
+      value: string | {
+        text: string
+        color: string
+      }
+    }>
+  }),
+  // Custom drawing, if true is returned, the graphics configured by figures will not be drawn
+  draw?: (params: {
+    // canvas context
+    ctx: CanvasRenderingContext2D
+    // data source, see [data source] for type
+    kLineDataList: KLineData[]
+    // technical indicator example
+    indicator: Indicator
+    // Visible area information
+    visibleRange: {
+      // start data index
+      from: number
+      // endpoint data index
+      to: number
+    },
+    // window size information
+    bounding: {
+      // width
+      width: number
+      // high
+      height: number
+      // distance to the left
+      left: number
+      // distance to the right
+      right: number
+      // distance from top
+      top: number
+      // distance from bottom
+      bottom: number
+    },
+    // information about the size of the candlestick
+    barSpace: {
+      // candlestick size
+      bar: number
+      halfBar: number
+      // candlesticks do not include dimensions of gaps between candlesticks
+      gapBar: number
+      halfGapBar: number
+    },
+    // The default technical indicator style, that is, the technical indicator style set globally, refer to the indicator in [Style]
+    defaultStyles: IndicatorStyle
+    // x-axis component, some built-in conversion methods
+    xAxis: XAxis
+    // y-axis component, with some built-in conversion methods
+    yAxis: YAxis
+  }) => boolean
+}

Step.1

First determine the calculation parameters (calcParams) and configuration items (figures). The 'MA' technical indicator needs to display the line connecting the average closing price of the two periods, one is 'ma1' and the other is 'ma2'. So figures are configured as:

javascript
{
+   // The calculation parameters are 2, one calculates the mean value of 5 cycle times, namely 'ma1', and the other calculates the mean value of 10 cycle times, namely 'ma10'
+   calcParams: [5, 10],
+   figures: [
+     // first line 'ma5'
+     { key: 'ma1', title: 'MA5: ', type: 'line' },
+     // second line 'ma10'
+     { key: 'ma2', title: 'MA10: ', type: 'line' }
+   ]
+}

Step.2

Determine other attributes

javascript
{
+   name: 'MA',
+   shortName: 'MA',
+   calcParams: [5, 10],
+   figures: [
+     { key: 'ma1', title: 'MA5: ', type: 'line' },
+     { key: 'ma2', title: 'MA10: ', type: 'line' }
+   ],
+   // When the calculation parameters are changed, it is hoped that the prompt is the same as the parameters, that is, the value of title needs to be changed
+   regenerateFigures: (params) => {
+     return params. map((p, i) => {
+       return { key: `ma${i + 1}`, title: `MA${p}: `, type: 'line' }
+     })
+   },
+   // Calculation results
+   calc: (kLineDataList, { calcParams, figures }) => {
+     // Note: The number of returned data needs to be consistent with the number of data in kLineDataList. If there is no value, replace it with {}.
+     // It is best to take the callback parameter calcParams as the calculation parameter. If not, when the subsequent calculation parameters change, the calculation here cannot respond in time
+     const closeSums = []
+     return kLineDataList. map((kLineData, i) => {
+       const ma = {}
+       const close = kLineData. close
+       calcParams.forEach((param, j) => {
+         closeSums[j] = (closeSums[j] || 0) + close
+         if (i >= param - 1) {
+           ma[figures[j].key] = closeSums[j] / param
+           closeSums[j] -= kLineDataList[i - (param - 1)].close
+         }
+       })
+       // If there is a value, the data format of each item here should be { ma1: xxx, ma2: xxx }
+       // Each key needs to be consistent with the value corresponding to the subkey in figures
+       return ma
+     })
+   }
+}

So a custom indicator is completed.

+ + + + \ No newline at end of file diff --git a/en-US/guide/instance-api.html b/en-US/guide/instance-api.html new file mode 100644 index 0000000..9339ff1 --- /dev/null +++ b/en-US/guide/instance-api.html @@ -0,0 +1,552 @@ + + + + + + Instance API | KLineChart + + + + + + + + + + + + + + + +
Skip to content

Instance API

getDom(paneId, position)

typescript
(paneId?: string, position?: 'root' | 'main' | 'yAxis') => HTMLElement

Get the dom container.

  • paneId window id, the default is the entire chart container
  • position supports root, main, yAxis, the default is root

getSize(paneId, position)

typescript
(paneId?: string, position?: 'root' | 'main' | 'yAxis') => {
+   width: number
+   height: number
+   left: number
+   top: number
+   right: number
+   bottom: number
+}

Get the dimensions.

  • paneId window id, the default is the entire chart container
  • position position, supports root, main, yAxis, the default is root

setStyles(styles)

typescript
(styles: string | object) => HTMLElement

Set style configuration.

  • styles style configuration, which can be the style name registered through registerStyles. When it is an object, please refer to styles for details, and it supports merging.

getStyles()

typescript
() => object

Get the style configuration, return the complete type refer to styles.

setPriceVolumePrecision(pricePrecision, volumePrecision)

typescript
(pricePrecision: number, volumePrecision: number) => void

Setting the price and volume precision, while the technical indicator series is 'price' or 'volume' will also be affected.

  • pricePrecision price precision
  • volumePrecision volume precision

setTimezone(timezone)

typescript
(timezone: string) => void

Set the time zone.

  • timezone time zone name, such as 'Asia/Shanghai', if not set, it will automatically get the local time zone, please refer to Time Zone List.

getTimezone()

typescript
() => string

Get the chart time zone name.

setZoomEnabled(enabled)

typescript
(enabled: boolean) => void

Set whether to scale.

isZoomEnabled()

typescript
() => boolean

Whether it can be scaled.

setScrollEnabled(enabled)

typescript
(enabled: boolean) => void

Set whether dragging and scrolling is possible.

isScrollEnabled()

typescript
() => boolean

Whether dragging and scrolling is possible.

setOffsetRightDistance(distance)

typescript
(distance: number) => void

Set the gap that can be left to the right of the chart.

getOffsetRightDistance() ^9.2.0

typescript
() => number

Get the gap that can be left to the right of the chart.

setMaxOffsetLeftDistance() ^9.7.0

typescript
(distance: number) => void

Set the maximum available gap on the left side of the chart.

setMaxOffsetRightDistance() ^9.7.0

typescript
(distance: number) => void

Set the maximum available gap on the right side of the chart.

setLeftMinVisibleBarCount(barCount)

typescript
(barCount: number) => void

Set the minimum number of visible candles to the left.

setRightMinVisibleBarCount(barCount)

typescript
(barCount: number) => void

Set the minimum number of visible candles to the right.

setBarSpace(space)

typescript
(space: number) => void

Set the width of a single candlestick of the chart.

getBarSpace()

typescript
() => number

Gets the width of a single candlestick on the chart.

getVisibleRange()

typescript
() => {
+  from: number
+  to: number
+  realFrom: number
+  realTo: number
+}

Get visible range.

applyNewData(dataList, more, callback)

typescript
(
+  dataList: Array<{
+    timestamp: number
+    open: number
+    close: number
+    high: number
+    low: number
+    volume?: number
+    turnover?: number
+  }>,
+  more?: boolean,
+  callback?: () => void
+) => void

Add new data, this method will clear the chart data, no need to call the clearData method additionally.

  • dataList is an array of K-line data. For details of the data type, please refer to data
  • more tells the chart whether there is more historical data, can be defaulted, the default is true
  • callback success callback ^9.2.0

Note

callback has been deprecated since version 9.8.0, use subscribeAction('onDataReady', () => {}) instead.

applyMoreData(dataList, more, callback)

typescript
(
+  dataList: Array<{
+    timestamp: number
+    open: number
+    close: number
+    high: number
+    low: number
+    volume?: number
+    turnover?: number
+  }>,
+  more?: boolean,
+  callback?: () => void
+) => void

Add more historical data.

  • dataList is an array of K-line data. For details of the data type, please refer to data
  • more tells the chart whether there is more historical data, can be defaulted, the default is true
  • callback success callback ^9.2.0

Note

This api has been deprecated since version 9.8.0.

updateData(data, callback)

typescript
(
+  data: {
+    timestamp: number
+    open: number
+    close: number
+    high: number
+    low: number
+    volume?: number
+    turnover?: number
+  },
+  callback?: () => void
+) => void

Update data. Currently, only the timestamp of the last piece of data will be matched. If it is the same, it will be overwritten, and if it is different, it will be appended.

  • data single k-line data, please refer to data for details of data type
  • callback success callback ^9.2.0

Note

callback has been deprecated since version 9.8.0, use subscribeAction('onDataReady', () => {}) instead.

getDataList()

typescript
() => Array<{
+  timestamp: number
+  open: number
+  close: number
+  high: number
+  low: number
+  volume?: number
+  turnover?: number
+}>

Get the current data source of the chart. For the returned data type, please refer to data.

clearData()

typescript
() => void

Clear the data of the chart. Generally, it is not necessary to call it manually. In order to avoid repeated drawing, the data is only cleared here, and the chart will not be redrawn.

loadMore(cb)

typescript
(cb: (timestamp: number | null) => void) => void

Set load more callback function.

  • cb is a callback method, timestamp is the timestamp of the first piece of data

Note

This api has been deprecated since version 9.8.0, use setLoadDataCallback instead.

setLoadDataCallback(cb) ^9.8.0

typescript
(
+  cb: (params: { 
+    type: 'forward' | 'backward'
+    data: Nullable<KLineData>
+    callback: (dataList: KLineData[], more?: boolean) => void
+  }) => void
+) => void

Set auto load data callback

  • cb callback
    • params params
      • type forward or backward
      • data boundary data
      • callback used for returning data to chart

createIndicator(value, isStack, paneOptions, callback)

typescript
(
+  value: string | {
+    name: string
+    shortName?: string
+    precision?: number
+    calcParams?: any[]
+    shouldOhlc?: boolean
+    shouldFormatBigNumber?: boolean
+    visible?: boolean
+    zLevel?: number
+    extendData?: any
+    series?: 'normal' | 'price' | 'volume'
+    figures?: Array<{
+      key: string
+      title?: string
+      type?: string
+      baseValue?: number
+      attrs?: ({
+        data: object
+        coordinate: object
+        bounding: object
+        barSpace: object
+        xAxis: object
+        yAxis: object
+      }) => object
+      styles?: (
+        data: object,
+        indicator: object,
+        defaultStyles: object
+      ) => ({
+        style?: 'solid' | 'dashed' | 'stroke' | 'fill' | 'stroke_fill'
+        color?: string
+      })
+    }>
+    minValue?: number
+    maxValue?: number
+    styles?: object
+    calc?: (dataList: KLineData[], indicator: object) => Promise<object[]> | object[]
+    regenerateFigures?: (calcParms: any[]) => Array<{
+      key: string
+      title?: string
+      type?: string
+      baseValue?: number
+      styles?: (
+        data: object,
+        indicator: object,
+        defaultStyles: object
+      ) => ({
+        style?: 'solid' | 'dashed' | 'stroke' | 'fill' | 'stroke_fill'
+        color?: string
+      })
+    }>
+    createTooltipDataSource?: (params: object) => ({
+      name?: string
+      calcParamsText?: string
+      values?: Array<{
+        title: string | {
+          text: string
+          color: string
+        }
+        value: string | {
+          text: string
+          color: string
+        }
+      }>
+    })
+    draw?: (params: object) => boolean
+  },
+  isStack?: boolean,
+  paneOptions?: {
+    id?: string
+    height?: number
+    minHeight?: number
+    dragEnabled?: boolean
+    position?: 'top' | 'bottom'
+    gap?: {
+      top?: number
+      bottom?: number
+    }
+    axisOptions?: {
+      name?: string
+      scrollZoomEnabled?: boolean
+    }
+  } | null,
+  callback?: () => void
+) => string | null

Create a technical indicator, the return value is a string that identifies the window, which is very important, and this identification is required for some subsequent operations on the window.

  • value technical indicator name or technical indicator object, when it is an object, the type is consistent with the input parameter of the chart method overrideIndicator
  • isStack is overrides
  • paneOptions window configuration information, can be default
    • id window id, can be default
    • height window height, can be default
    • minHeight minimum height of the window, can be defaulted
    • dragEnabled Whether the window can be dragged to adjust the height, it can be defaulted
    • position Only valid when creating a new pane ^9.6.0
    • gap margins
      • top top margin, value less than 1 is a percentage
      • bottom bottom margin, value less than 1 is a percentage
    • axisOptions
      • name is same axis.name in registerYAxis(axis) of chart api, default is 'default' ^9.8.0
      • scrollZoomEnabled Scroll zoom flag ^9.3.0
  • callback success callback

Special id

'candle_pane', the window id of the main picture.

Example:

javascript
chart.createIndicator('MA', false, {
+  id: 'pane_1',
+  height: 100,
+  minHeight: 30,
+  dragEnabled: true,
+  gap: { top: 0.2, bottom: 0.1 },
+  axisOptions: { scrollZoomEnabled: true }
+}, () => {})

overrideIndicator(override, paneId, callback)

typescript
(
+  override: {
+    name: string
+    shortName?: string
+    precision?: number
+    calcParams?: any[]
+    shouldOhlc?: boolean
+    shouldFormatBigNumber?: boolean
+    visible?: boolean
+    zLevel?: number 
+    extendData?: any
+    series?: 'normal' | 'price' | 'volume'
+    figures?: Array<{
+      key: string
+      title?: string
+      type?: string
+      baseValue?: number
+      attrs?: ({
+        data: object
+        coordinate: object
+        bounding: object
+        barSpace: object
+        xAxis: object
+        yAxis: object
+      }) => object
+      styles?: (
+        data: object,
+        indicator: object,
+        defaultStyles: object
+      ) => ({
+        style?: 'solid' | 'dashed' | 'stroke' | 'fill' | 'stroke_fill'
+        color?: string
+      })
+    }>
+    minValue?: number
+    maxValue?: number
+    styles?: object
+    calc?: (dataList: KLineData[], indicator: object) => Promise<object[]> | object[]
+    regenerateFigures?: (calcParms: any[]) => Array<{
+      key: string
+      title?: string
+      type?: string
+      baseValue?: number
+      styles?: (
+        data: object,
+        indicator: object,
+        defaultStyles: object
+      ) => ({
+        style?: 'solid' | 'dashed' | 'stroke' | 'fill' | 'stroke_fill'
+        color?: string
+      })
+    }>
+    createTooltipDataSource?: (params: object) => {
+      name?: string
+      calcParamsText?: string
+      values?: Array<{
+        title: string | { text: string, color: string }
+        value: string | { text: string, color: string }
+      }>
+    }
+    draw?: (params: object) => boolean
+  },
+  paneId?: string | null,
+  callback?: () => void
+) => void

Overlay technical indicator information.

  • override some parameters that need to be overridden
    • name metric name, unique identifier for creation and operation
    • shortName short name for display
    • precision precision
    • calcParams calculation parameters
    • shouldOhlc needs ohlc auxiliary graphics
    • shouldFormatBigNumber should format large numbers. For example, 1000 is converted to 1k, 1000000 is converted to 1M, etc.
    • visible visible or not
    • zLevel z level ^9.7.0
    • extendData extended data
    • series indicator series, optional options are 'normal', 'price' and 'volume'
    • figures graphics configuration
    • minValue specifies the minimum value
    • maxValue specifies the maximum value
    • styles styles
    • calc calculation method
    • regenerateFigures method to regenerate figure information
    • createTooltipDataSource method to create custom tip information
    • draw custom drawing method
  • paneId window id, default is set to all
  • callback success callback

Special id

'candle_pane', the window id of the main picture.

Example:

javascript
chart.overrideIndicator({
+   name: 'BOLL',
+   showName: 'BOLL'
+   calcParams: [20, 5.5],
+   precision: 4,
+   shouldOhlc: true,
+   shouldFormatBigNumber: false,
+   visible: true,
+   zLevel: 1,
+   extendData: 2432435,
+   series: 'price',
+   figures: [],
+   minValue: null,
+   maxValue: null,
+   calc: () => [],
+   regenerateFigures: () => [],
+   draw: () => {},
+   styles: {
+   bars: [{
+       style: 'fill,
+       borderStyle: 'solid,
+       borderSize: 1,
+       borderDashedValue: [2, 2],
+       upColor: '#26A69A',
+       downColor: '#EF5350',
+       noChangeColor: '#888888'
+     }],
+     lines: [{
+       size: 1,
+       style: 'solid',
+       dashedValue: [2, 2],
+       color: '#FF9600'
+     }],
+     circles: [{
+       style: 'fill,
+       borderStyle: 'solid,
+       borderSize: 1,
+       borderDashedValue: [2, 2],
+       upColor: '#26A69A',
+       downColor: '#EF5350',
+       noChangeColor: '#888888'
+     }]
+   }
+}, 'candle_pane', () => {})

getIndicatorByPaneId(paneId, name)

typescript
(paneId?: string, name?: string) => object

Obtain technical indicator information according to the window id.

  • paneId window id, that is, the window ID returned when calling the createIndicator method, can be defaulted, and all will be returned by default.
  • name technical indicator name

Special id

'candle_pane', the window id of the main picture.

removeIndicator(paneId, name)

typescript
(paneId: string, name?: string) => object

Remove technical indicators.

  • paneId window id, that is, the window ID returned when calling the createIndicator method
  • name technical indicator name, if default, will remove all

Special id

'candle_pane', the window id of the main picture.

createOverlay(value, paneId)

typescript
(
+  value: string | {
+    name: string
+    id?: string
+    groupId?: string
+    lock?: boolean
+    visible?: boolean
+    zLevel?: number
+    needDefaultPointFigure?: boolean
+    needDefaultXAxisFigure?: boolean
+    needDefaultYAxisFigure?: boolean
+    mode?: 'normal' | 'weak_magnet' | 'strong_magnet'
+    modeSensitivity?: number
+    points?: Array<{
+      timestamp?: number
+      dataIndex?: number
+      value?: number
+    }>
+    extendData?: any
+    styles?: object
+    onDrawStart?: (event: object) => boolean
+    onDrawing?: (event: object) => boolean
+    onDrawEnd?: (event: object) => boolean
+    onClick?: (event: object) => boolean
+    onDoubleClick?: (event: object) => boolean
+    onRightClick?: (event: object) => boolean
+    onPressedMoveStart?: (event: object) => boolean
+    onPressedMoving?: (event: object) => boolean
+    onPressedMoveEnd?: (event: object) => boolean
+    onMouseEnter?: (event: object) => boolean
+    onMouseLeave?: (event: object) => boolean
+    onRemoved?: (event: object) => boolean
+    onSelected?: (event: object) => boolean
+    onDeselected?: (event: object) => boolean
+  } | Array<string | {
+    name: string
+    id?: string
+    groupId?: string
+    lock?: boolean
+    visible?: boolean
+    zLevel?: number
+    needDefaultPointFigure?: boolean
+    needDefaultXAxisFigure?: boolean
+    needDefaultYAxisFigure?: boolean
+    mode?: 'normal' | 'weak_magnet' | 'strong_magnet'
+    modeSensitivity?: number
+    points?: Array<{
+      timestamp?: number
+      dataIndex?: number
+      value?: number
+    }>
+    extendData?: any
+    styles?: object
+    onDrawStart?: (event: object) => boolean
+    onDrawing?: (event: object) => boolean
+    onDrawEnd?: (event: object) => boolean
+    onClick?: (event: object) => boolean
+    onDoubleClick?: (event: object) => boolean
+    onRightClick?: (event: object) => boolean
+    onPressedMoveStart?: (event: object) => boolean
+    onPressedMoving?: (event: object) => boolean
+    onPressedMoveEnd?: (event: object) => boolean
+    onMouseEnter?: (event: object) => boolean
+    onMouseLeave?: (event: object) => boolean
+    onRemoved?: (event: object) => boolean
+    onSelected?: (event: object) => boolean
+    onDeselected?: (event: object) => boolean
+  }>,
+  paneId?: string
+) => string | null

Creates an overlay, returning an identifier of type String.

  • value Overlay name or object, when it is an object, the parameters are consistent with overrideOverlay
  • paneId window id, can be default

Special id

'candle_pane', the window id of the main picture.

Example:

javascript
chart.createOverlay({
+   name: 'segment',
+   id: 'segment_1',
+   groupId: 'segment',
+   points: [
+     { timestamp: 1614171282000, value: 18987 },
+     { timestamp: 1614171202000, value: 16098 },
+   ],
+   styles: {
+     line: {
+       style: 'solid',
+       dashedValue: [2, 2],
+       color: '#f00',
+       size: 2
+     }
+   },
+   lock: false,
+   visible: true,
+   zLevel: 0,
+   mode: 'weak_magnet',
+   modeSensitivity: 8,
+   extendData: 'xxxxxxxx',
+   needDefaultPointFigure: false,
+   needDefaultXAxisFigure: false,
+   needDefaultYAxisFigure: false,
+   onDrawStart: function (event) { console. log(event) },
+   onDrawing: function (event) { console. log(event) },
+   onDrawEnd: function (event) { console. log(event) },
+   onClick: function (event) { console. log(event) },
+   onDoubleClick: function (event) { console. log(event) },
+   onRightClick: function (event) {
+     console. log(event)
+     return false
+   },
+   onMouseEnter: function (event) { console. log(event) },
+   onMouseLeave: function (event) { console. log(event) },
+   onPressedMoveStart: function (event) { console. log(event) },
+   onPressedMoving: function (event) { console. log(event) },
+   onPressedMoveEnd: function (event) { console. log(event) },
+   onRemoved: function (event) { console. log(event) },
+   onSelected: function (event) { console. log(event) },
+   onDeselected: function (event) { console. log(event) }
+})

getOverlayById(id)

typescript
(id: string) => object

Get overlay information by id.

  • id calls the createOverlay method to return the ID

overrideOverlay(override)

typescript
(
+  override: {
+    name: string
+    id?: string
+    groupId?: string
+    lock?: boolean
+    visible?: boolean
+    zLevel?: number
+    needDefaultPointFigure?: boolean
+    needDefaultXAxisFigure?: boolean
+    needDefaultYAxisFigure?: boolean
+    mode?: 'normal' | 'weak_magnet' | 'strong_magnet'
+    modeSensitivity?: number
+    points?: Array<{
+      timestamp?: number
+      dataIndex?: number
+      value?: number
+    }>
+    extendData?: any
+    styles?: object
+    onDrawStart?: (event: object) => boolean
+    onDrawing?: (event: object) => boolean
+    onDrawEnd?: (event: object) => boolean
+    onClick?: (event: object) => boolean
+    onDoubleClick?: (event: object) => boolean
+    onRightClick?: (event: object) => boolean
+    onPressedMoveStart?: (event: object) => boolean
+    onPressedMoving?: (event: object) => boolean
+    onPressedMoveEnd?: (event: object) => boolean
+    onMouseEnter?: (event: object) => boolean
+    onMouseLeave?: (event: object) => boolean
+    onRemoved?: (event: object) => boolean
+    onSelected?: (event: object) => boolean
+    onDeselected?: (event: object) => boolean
+  }
+) => string | null

Overlays that have been drawn.

  • override parameters that need to be overridden
    • name overlay name, unique identifier for creation
    • id Overlay identification, if the id exists, it will be based on the id to overwrite
    • groupId Group id
    • lock is locked to prevent dragging
    • visible visible or not
    • zLevel Draw level
    • needDefaultPointFigure needs a default point figure
    • needDefaultXAxisFigure needs the default x-axis figure
    • needDefaultYAxisFigure needs the default y-axis figure
    • mode mode, options are 'normal', 'weak_magnet' and 'strong_magnet'
    • modeSensitivity mode sensitivity, only valid when mode is weak_magnet ^9.5.0
    • points point information
    • extendData extended data
    • styles styles
    • onDrawStart start drawing event
    • onDrawing drawing event
    • onDrawEnd draw end event
    • onClick click event
    • onDoubleClick double click event ^9.5.0
    • onRightClick right click event
    • onPressedMoveStart press start move event
    • onPressedMoving Press and move event
    • onPressedMoveEnd Press and move end event
    • onMouseEnter mouse enter event
    • onMouseLeave mouse out event
    • onRemoved delete event
    • onSelected selected event
    • onDeselected deselected event

Example:

javascript
chart.overrideOverlay({
+   name: 'segment',
+   id: 'segment_1',
+   groupId: 'segment',
+   points: [
+     { timestamp: 1614171282000, value: 18987 },
+     { timestamp: 1614171202000, value: 16098 },
+   ],
+   styles: {
+     line: {
+       style: 'solid',
+       dashedValue: [2, 2],
+       color: '#f00',
+       size: 2
+     }
+   },
+   lock: false,
+   visible: true,
+   zLevel: 0,
+   mode: 'weak_magnet',
+   modeSensitivity: 8
+   extendData: 'xxxxxxxx',
+   needDefaultPointFigure: false,
+   needDefaultXAxisFigure: false,
+   needDefaultYAxisFigure: false,
+   onDrawStart: function (event) { console. log(event) },
+   onDrawing: function (event) { console. log(event) },
+   onDrawEnd: function (event) { console. log(event) },
+   onClick: function (event) { console. log(event) },
+   onDoubleClick: function (event) { console. log(event) },
+   onRightClick: function (event) {
+     console. log(event)
+     return false
+   },
+   onMouseEnter: function (event) { console. log(event) },
+   onMouseLeave: function (event) { console. log(event) },
+   onPressedMoveStart: function (event) { console. log(event) },
+   onPressedMoving: function (event) { console. log(event) },
+   onPressedMoveEnd: function (event) { console. log(event) },
+   onRemoved: function (event) { console. log(event) },
+   onSelected: function (event) { console. log(event) },
+   onDeselected: function (event) { console. log(event) }
+})

removeOverlay(remove)

typescript
(
+  remove: string | {
+    id?: string
+    groupId?: string
+    name?: string
+  }
+) => void

Remove graphics.

  • id The ID returned by calling the createOverlay method.
  • groupId Group id
  • name Overlay name

scrollByDistance(distance, animationDuration)

typescript
(distance: number, animationDuration?: number) => void

Scroll a certain distance.

  • distance distance
  • animationDuration animation time, can be default, default is no animation

scrollToRealTime(animationDuration)

typescript
(distance: number, animationDuration?: number) => void

Scroll to original position.

  • animationDuration animation time, can be default, default is no animation

scrollToDataIndex(dataIndex, animationDuration)

typescript
(dataIndex: number, animationDuration?: number) => void

Scroll to the specified location.

  • dataIndex the index of the data
  • animationDuration animation time, can be default, default is no animation

scrollToTimestamp(timestamp, animationDuration)

typescript
(timestamp: number, animationDuration?: number) => void

Scroll to the specified timestamp.

  • timestamp timestamp
  • animationDuration animation time, can be default, default is no animation

zoomAtCoordinate(scale, coordinate, animationDuration)

typescript
(
+  scale: number,
+  coordinate?: {
+    x: number
+    y: number
+  },
+  animationDuration?: number
+) => void

Scale at a certain coordinate point.

  • scale scaling factor
  • coordinate coordinate point, can be defaulted, the default is to zoom in the middle of the chart
  • animationDuration animation time, can be default, default is no animation

zoomAtDataIndex(scale, dataIndex, animationDuration)

typescript
(scale: number, dataIndex: number, animationDuration?: number) => void

Scale at a certain position.

  • scale scaling factor
  • dataIndex the index of the data
  • animationDuration animation time, can be default, default is no animation

zoomAtTimestamp(scale, timestamp, animationDuration)

typescript
(scale: number, timestamp: number, animationDuration?: number) => void

Scale on the specified timestamp.

  • scale scaling factor
  • timestamp timestamp
  • animationDuration animation time, can be default, default is no animation

setPaneOptions(options)

typescript
(
+  options: {
+    id: string
+    height?: number
+    minHeight?: number
+    dragEnabled?: boolean
+    gap?: {
+      top?: number
+      bottom?: number
+    }
+    axisOptions?: {
+      name?: string
+      scrollZoomEnabled?: boolean
+    }
+  }
+) => void

Set window configuration.

  • options window configuration information, can be default
    • id window id
    • height window height, can be default
    • minHeight minimum height of the window, can be defaulted
    • dragEnabled Whether the window can be dragged to adjust the height, it can be defaulted
    • gap margins
      • top top margin, value less than 1 is a percentage
      • bottom bottom margin, value less than 1 is a percentage
    • axisOptions
      • name axis name ^9.8.0
      • scrollZoomEnabled Scroll zoom flag ^9.3.0

Special id

'candle_pane', the window id of the main picture.

Example:

javascript
chart.setPaneOptions({
+  id: 'pane_1',
+  height: 100,
+  minHeight: 3,
+  dragEnabled: true,
+  gap: { top: 0.2, bottom: 0.1 },
+  axisOptions: { name: 'default', scrollZoomEnabled: true }
+})

executeAction(type, data) ^9.2.0

typescript
(
+   type: 'onCrosshairChange',
+   data: any => void
+) => void

Execute chart action.

  • type only supported 'onCrosshairChange'
  • data data required for execution

subscribeAction(type, callback)

typescript
(
+   type: 'onDataReady' | 'onZoom' | 'onScroll' | 'onVisibleRangeChange' | 'onCrosshairChange' | 'onCandleBarClick' | 'onTooltipIconClick' | 'onPaneDrag',
+   callback: (data?: any) => void
+) => void

Subscribe to chart actions.

  • type options are 'onDataReady', 'onZoom', 'onScroll', 'onVisibleRangeChange', 'onCandleBarClick', 'onTooltipIconClick', 'onCrosshairChange' and 'onPaneDrag'
  • callback is a callback method

unsubscribeAction(type, callback)

typescript
(
+   type: 'onDataReady' | 'onZoom' | 'onScroll' | 'onVisibleRangeChange' | 'onCrosshairChange' | 'onCandleBarClick' | 'onTooltipIconClick' | 'onPaneDrag',
+   callback?: (data?: any) => void
+) => void

Unsubscribe from chart actions.

  • type options are 'onDataReady', 'onZoom', 'onScroll', 'onVisibleRangeChange', 'onCandleBarClick', 'onTooltipIconClick', 'onCrosshairChange' and 'onPaneDrag'
  • callback is the callback method when subscribing, the default is to cancel all the current types

convertToPixel(value, finder)

typescript
(
+   value: {
+     dataIndex?: number
+     timestamp?: number
+     value?: number
+   } | Array<{
+     dataIndex?: number
+     timestamp?: number
+     value?: number
+   }>,
+   finder: {
+     paneId?: string,
+     absolute?: boolean
+   }
+) => { x: number?, y?: number } | Array<{ x?: number, y?: number }>

Convert values to coordinates.

  • value The value to be converted, it can be an object or an array
    • dataIndex data index, if dataIndex and timestamp exist at the same time, it will be converted according to the index
    • timestamp timestamp
    • value corresponds to the value of the y-axis
  • finder filter
    • paneId window id
    • absolute is an absolute coordinate, only works on the y axis

convertFromPixel(coordinate, finder)

typescript
(
+  coordinate: {
+    x?: number
+    y?: number
+  } | Array<{
+    x?: number
+    y?: number
+  },
+  finder: {
+    paneId?: string
+    absolute?: boolean
+  }
+) => {
+    dataIndex?: number
+    timestamp?: number
+    value?: number
+  } | Array<{
+    dataIndex?: number
+    timestamp?: number
+    value?: number
+  }>

Convert coordinates to values.

  • coordinate needs to be converted, it can be an object or an array
  • finder filter
    • paneId window id
    • absolute is an absolute coordinate, only works on the y axis

getConvertPictureUrl(includeOverlay, type, backgroundColor)

typescript
(includeOverlay?: boolean, type?: string, backgroundColor?: string) => string

Get the image url after the chart is converted into an image.

  • includeOverlay needs to include the overlay layer, it can be defaulted
  • type The converted image type, one of the three types of 'png', 'jpeg', 'bmp', can be defaulted, the default is 'jpeg'
  • backgroundColor background color, can be defaulted, the default is '#FFFFFF'

resize()

typescript
() => void

Resizing the chart will always fill the container size.

Note

This method will recalculate the size of each module in the entire chart, frequent calls may affect performance, please call with caution.

+ + + + \ No newline at end of file diff --git a/en-US/guide/introduction.html b/en-US/guide/introduction.html new file mode 100644 index 0000000..45853f4 --- /dev/null +++ b/en-US/guide/introduction.html @@ -0,0 +1,26 @@ + + + + + + 📃 Introduction | KLineChart + + + + + + + + + + + + + + + +
Skip to content

📃 Introduction

What's KLineChart?

KLineChart,it is a highly customizable professional lightweight financial chart.

Features

  • 📦 Out of the box: Simple and fast integration, basically zero cost to get started.
  • 🚀 Lightweight and smooth: Zero dependencies, only 40k under gzip compression.
  • 💪 Powerful functions: Built-in multiple indicators and line drawing models.
  • 🎨 Highly scalable: With rich style configuration and API, the function can be extended as you like.
  • 📱 Mobile: Support mobile, one chart, handle multiple terminals.
  • 🛡 Typescript development: Provide complete type definition files.
+ + + + \ No newline at end of file diff --git a/en-US/guide/overlay.html b/en-US/guide/overlay.html new file mode 100644 index 0000000..392e75b --- /dev/null +++ b/en-US/guide/overlay.html @@ -0,0 +1,253 @@ + + + + + + Overlay | KLineChart + + + + + + + + + + + + + + + +
Skip to content

Overlay

This document introduces the built-in overlays in the chart and how to customize a overlay.

Built-in overlay types

horizontalRayLine, horizontalSegment, horizontalStraightLine, verticalRayLine, verticalSegment, verticalStraightLine, rayLine, segment, straightLine, priceLine, priceChannelLine, parallelLfilineLine, ci , simpleAnnotation, simpleTag

Custom overlays

Customize an overlay, then add it globally through klinecharts.registerOverlay, add it to the chart and use it like the built-in overlay.

Attribute description

typescript
{
+  // Name, a required field, used as the unique identifier for overlay creation
+  name: string
+
+  // How many steps are needed in total to complete the drawing, not necessary
+  totalStep?: number
+
+  // Whether to lock, do not trigger events, not necessary
+  lock?: boolean
+
+  // Do you need visible
+  visible?: boolean
+
+  // Draw level
+  zLevel?: number
+
+  // Do you need the graphics corresponding to the default points, not necessary
+  needDefaultPointFigure?: boolean
+
+  // Do you need the graphics on the default X-axis, not necessary
+  needDefaultXAxisFigure?: boolean
+
+  // Do you need the graphics on the default Y axis, not necessary
+  needDefaultYAxisFigure?: boolean
+
+  // mode, options are `normal`, `weak_magnet`, `strong_magnet`, not required
+  mode?: 'normal' | 'weak_magnet' | 'strong_magnet'
+
+  // mode sensitivity, only valid when mode is weak_magnet
+  modeSensitivity?: number
+
+  // point information, not required
+  points?: Array<{
+    // timestamp
+    timestamp: number
+    // data index
+    dataIndex?: number
+    // corresponding to the value of the y-axis
+    value?: number
+  }>,
+
+  // Extended data, not required
+  extendData?: any
+
+  // style, not required, the type participates in the overlay in [style]
+  styles?: OverlayStyle
+
+  // Create graphics corresponding to points, not required
+  createPointFigures: ({
+    // overlay instance
+    overlay: Overlay
+    // coordinate information corresponding to points
+    coordinates: Array<{
+      x: number
+      y: number
+    }>
+    // window size information
+    bounding: {
+      // width
+      width: number
+      // high
+      height: number
+      // distance to the left
+      left: number
+      // distance to the right
+      right: number
+      // distance from top
+      top: number
+      // distance from bottom
+      bottom: number
+    }
+    // information about the size of the candlestick
+    barSpace: {
+      // candlestick size
+      bar: number
+      halfBar: number
+      // candlesticks do not include dimensions of gaps between candlesticks
+      gapBar: number
+      halfGapBar: number
+    }
+    // precision
+    precision: {
+      // price precision
+      price: number
+      // Quantity precision
+      volume: number
+    }
+    // thousands separator
+    thousandsSeparator: string
+    // decimal fold threshold
+    decimalFoldThreshold: number
+    // Constructor for objects that format date and time, see https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/DateTimeFormat for details
+    dateTimeFormat: Intl. DateTimeFormat
+    // The default style, that is, the overlay in the global style configuration, the type participates in the overlay in [style]
+    defaultStyles: OverlayStyle
+    // x-axis component, some built-in conversion methods
+    xAxis: XAxis
+    // y-axis component, with some built-in conversion methods
+    yAxis: YAxis
+  }) => ({
+    // No special meaning, can be used for extension fields
+    key?: string
+    // Graphic type, one of the return values of klinecharts.getSupportFigures
+    type: string
+    // The properties of the graphic corresponding to the type
+    attrs: any | any[]
+    // The style of the graphic corresponding to type
+    styles?: any
+    // Whether to ignore the event
+    ignoreEvent?: boolean | OverlayFigureIgnoreEventType[]
+  }) | Array<{
+    key?: string
+    type: string
+    attrs: any | any[]
+    styles?: any
+    ignoreEvent?: boolean | OverlayFigureIgnoreEventType[]
+  }>
+
+  // Create graphics on the X axis, not required, parameters and return values are consistent with `createPointFigures`
+  createXAxisFigures?: OverlayCreateFiguresCallback
+
+  // Create graphics on the Y axis, not required, parameters and return values are consistent with `createPointFigures`
+  createYAxisFigures?: OverlayCreateFiguresCallback
+
+  // Handle the movement operation during the drawing process, which can be defaulted and triggered during the movement drawing process
+  performEventMoveForDrawing?: ({
+    // current step
+    currentStep: number
+    // model
+    mode: 'normal' | 'weak_magnet' | 'strong_magnet'
+    // point information
+    points: Array<{
+      // timestamp
+      timestamp: number
+      // data index
+      dataIndex?: number
+      // corresponding to the value of the y-axis
+      value?: number
+    }>
+    // index of the event point
+    performPointIndex: number
+    // Information about the point where the event is located
+    performPoint: {
+      // timestamp
+      timestamp: number
+      // data index
+      dataIndex?: number
+      // corresponding to the value of the y-axis
+      value?: number
+    }
+  }) => void
+
+  // Handle the press and move operation, which can be defaulted, and is triggered during the movement of a certain operation point
+  // The callback parameters are consistent with `performEventMoveForDrawing`
+  performEventPressedMove?: (params: OverlayPerformEventParams) => void
+
+  // draw start callback event, can be default
+  onDrawStart?: (event: OverlayEvent) => boolean
+
+  // callback event during drawing, can be defaulted
+  onDrawing?: (event: OverlayEvent) => boolean
+
+  // Draw end callback event, can be default
+  onDrawEnd?: (event: OverlayEvent) => boolean
+
+  // click callback event, default
+  onClick?: (event: OverlayEvent) => boolean
+
+  // double click callback event, default
+  onDoubleClick?: (event: OverlayEvent) => boolean
+
+  // The right-click callback event, which can be defaulted, needs to return a value of type boolean. If it returns true, the built-in right-click delete will be invalid
+  onRightClick?: (event: OverlayEvent) => boolean
+
+  // Hold down and drag to start the callback event, which can be defaulted
+  onPressedMoveStart?: (event: OverlayEvent) => boolean
+
+  // Press and hold the drag callback event, which can be defaulted
+  onPressedMoving?: (event: OverlayEvent) => boolean
+
+  // Hold down and drag to end the callback event, which can be defaulted
+  onPressedMoveEnd?: (event: OverlayEvent) => boolean
+
+  // Mouse move event, can be default
+  onMouseEnter?: (event: OverlayEvent) => boolean
+
+  // Mouse out event, default
+  onMouseLeave?: (event: OverlayEvent) => boolean
+
+  // delete callback event, default
+  onRemoved?: (event: OverlayEvent) => boolean
+
+  // Select the callback event, which can be defaulted
+  onSelected?: (event: OverlayEvent) => boolean
+
+  // cancel callback event, default
+  onDeselected?: (event: OverlayEvent) => boolean
+}

Example

A filled, bordered circle is used to illustrate how to configure.

javascript
{
+   // name
+   name: 'sampleCircle',
+
+   // Three steps are required to complete the drawing of a circle
+   totalStep: 3,
+
+   // Create the graphic information corresponding to the point
+   createPointFigures: ({ scoordinates }) => {
+     if (coordinates. length === 2) {
+       const xDis = Math.abs(coordinates[0].x - coordinates[1].x)
+       const yDis = Math.abs(coordinates[0].y - coordinates[1].y)
+       // Determine the coordinates of the circle generated by the corresponding point
+       const radius = Math. sqrt(xDis * xDis + yDis * yDis)
+       // The chart has built-in basic graphics 'circle', which can be used directly
+       return {
+         key: 'sampleCircle',
+         type: 'circle',
+         attrs: {
+           ...coordinates[0],
+           r: radius
+         },
+         styles: {
+           // Select the border and fill it, other selections use the default style
+           style: 'stroke_fill'
+         }
+       }
+     }
+     return []
+   }
+}

So a custom overlay is complete.

+ + + + \ No newline at end of file diff --git a/en-US/guide/quick-start.html b/en-US/guide/quick-start.html new file mode 100644 index 0000000..1ad6c00 --- /dev/null +++ b/en-US/guide/quick-start.html @@ -0,0 +1,217 @@ + + + + + + 🚀 Quick Start | KLineChart + + + + + + + + + + + + + + + +
Skip to content

🚀 Quick Start

Get KLineChart

KLineChart supports multiple download methods. You can download it through npm, yarn, pnpm or bun package management tools. In addition, a umd version is also provided, so you can also download it from the cdn website or etc., just use the global variable klinecharts.

It is recommended to use package management tools for development. it not only makes development easier, but also allow you to take advantage of the rich ecosystem of Javascript packages and tooling.

bash
npm install klinecharts
bash
yarn add klinecharts
bash
pnpm install klinecharts
bash
bun add klinecharts
html
<script src="https://cdn.jsdelivr.net/npm/klinecharts/dist/umd/klinecharts.min.js"></script>

Create the first chart

jsx
import { useEffect } from 'react'
+import { init, dispose } from 'klinecharts'
+export default () => {
+  useEffect(() => {
+    const chart = init('chart')
+          
+    chart.applyNewData([
+      { close: 4976.16, high: 4977.99, low: 4970.12, open: 4972.89, timestamp: 1587660000000, volume: 204 },
+      { close: 4977.33, high: 4979.94, low: 4971.34, open: 4973.20, timestamp: 1587660060000, volume: 194 },
+      { close: 4977.93, high: 4977.93, low: 4974.20, open: 4976.53, timestamp: 1587660120000, volume: 197 },
+      { close: 4966.77, high: 4968.53, low: 4962.20, open: 4963.88, timestamp: 1587660180000, volume: 28 },
+      { close: 4961.56, high: 4972.61, low: 4961.28, open: 4961.28, timestamp: 1587660240000, volume: 184 },
+      { close: 4964.19, high: 4964.74, low: 4961.42, open: 4961.64, timestamp: 1587660300000, volume: 191 },
+      { close: 4968.93, high: 4972.70, low: 4964.55, open: 4966.96, timestamp: 1587660360000, volume: 105 },
+      { close: 4979.31, high: 4979.61, low: 4973.99, open: 4977.06, timestamp: 1587660420000, volume: 35 },
+      { close: 4977.02, high: 4981.66, low: 4975.14, open: 4981.66, timestamp: 1587660480000, volume: 135 },
+      { close: 4985.09, high: 4988.62, low: 4980.30, open: 4986.72, timestamp: 1587660540000, volume: 76 }
+    ])
+          
+    return () => {
+      dispose('chart')
+    }
+  }, [])
+
+  return <div id="chart" style={{ width: 600, height: 600 }}/>
+}
vue
<script setup>
+import { onMounted, onUnmounted } from 'vue'
+import { init, dispose } from 'klinecharts'
+
+onMounted(() => {
+  const chart = init('chart')
+
+  chart.applyNewData([
+    { close: 4976.16, high: 4977.99, low: 4970.12, open: 4972.89, timestamp: 1587660000000, volume: 204 },
+    { close: 4977.33, high: 4979.94, low: 4971.34, open: 4973.20, timestamp: 1587660060000, volume: 194 },
+    { close: 4977.93, high: 4977.93, low: 4974.20, open: 4976.53, timestamp: 1587660120000, volume: 197 },
+    { close: 4966.77, high: 4968.53, low: 4962.20, open: 4963.88, timestamp: 1587660180000, volume: 28 },
+    { close: 4961.56, high: 4972.61, low: 4961.28, open: 4961.28, timestamp: 1587660240000, volume: 184 },
+    { close: 4964.19, high: 4964.74, low: 4961.42, open: 4961.64, timestamp: 1587660300000, volume: 191 },
+    { close: 4968.93, high: 4972.70, low: 4964.55, open: 4966.96, timestamp: 1587660360000, volume: 105 },
+    { close: 4979.31, high: 4979.61, low: 4973.99, open: 4977.06, timestamp: 1587660420000, volume: 35 },
+    { close: 4977.02, high: 4981.66, low: 4975.14, open: 4981.66, timestamp: 1587660480000, volume: 135 },
+    { close: 4985.09, high: 4988.62, low: 4980.30, open: 4986.72, timestamp: 1587660540000, volume: 76 }
+  ])
+})
+
+onUnmounted(() => {
+  dispose('chart')
+})
+</script>
+
+<template>
+  <div id="chart" style="width:600px;height:600px"/>
+</template>
ts
import { Component, AfterViewInit, OnDestroy } from '@angular/core';
+import { init, dispose } from 'klinecharts';
+
+@Component({
+  selector: 'app-chart',
+  template: `<div id="chart" style="width:600px;height:600px"/>`,
+})
+export class ChartComponent implements AfterViewInit, OnDestroy {
+  ngAfterViewInit(): void {
+    const chart = init('chart');
+
+    chart?.applyNewData([
+      { close: 4976.16, high: 4977.99, low: 4970.12, open: 4972.89, timestamp: 1587660000000, volume: 204 },
+      { close: 4977.33, high: 4979.94, low: 4971.34, open: 4973.20, timestamp: 1587660060000, volume: 194 },
+      { close: 4977.93, high: 4977.93, low: 4974.20, open: 4976.53, timestamp: 1587660120000, volume: 197 },
+      { close: 4966.77, high: 4968.53, low: 4962.20, open: 4963.88, timestamp: 1587660180000, volume: 28 },
+      { close: 4961.56, high: 4972.61, low: 4961.28, open: 4961.28, timestamp: 1587660240000, volume: 184 },
+      { close: 4964.19, high: 4964.74, low: 4961.42, open: 4961.64, timestamp: 1587660300000, volume: 191 },
+      { close: 4968.93, high: 4972.70, low: 4964.55, open: 4966.96, timestamp: 1587660360000, volume: 105 },
+      { close: 4979.31, high: 4979.61, low: 4973.99, open: 4977.06, timestamp: 1587660420000, volume: 35 },
+      { close: 4977.02, high: 4981.66, low: 4975.14, open: 4981.66, timestamp: 1587660480000, volume: 135 },
+      { close: 4985.09, high: 4988.62, low: 4980.30, open: 4986.72, timestamp: 1587660540000, volume: 76 }
+    ]);
+  }
+
+  ngOnDestroy(): void {
+    dispose('chart');
+  }
+}
jsx
import { useEffect } from 'preact/hooks'
+import { init, dispose } from 'klinecharts'
+
+export default () => {
+  useEffect(() => {
+    const chart = init('chart')
+
+    chart.applyNewData([
+      { close: 4976.16, high: 4977.99, low: 4970.12, open: 4972.89, timestamp: 1587660000000, volume: 204 },
+      { close: 4977.33, high: 4979.94, low: 4971.34, open: 4973.20, timestamp: 1587660060000, volume: 194 },
+      { close: 4977.93, high: 4977.93, low: 4974.20, open: 4976.53, timestamp: 1587660120000, volume: 197 },
+      { close: 4966.77, high: 4968.53, low: 4962.20, open: 4963.88, timestamp: 1587660180000, volume: 28 },
+      { close: 4961.56, high: 4972.61, low: 4961.28, open: 4961.28, timestamp: 1587660240000, volume: 184 },
+      { close: 4964.19, high: 4964.74, low: 4961.42, open: 4961.64, timestamp: 1587660300000, volume: 191 },
+      { close: 4968.93, high: 4972.70, low: 4964.55, open: 4966.96, timestamp: 1587660360000, volume: 105 },
+      { close: 4979.31, high: 4979.61, low: 4973.99, open: 4977.06, timestamp: 1587660420000, volume: 35 },
+      { close: 4977.02, high: 4981.66, low: 4975.14, open: 4981.66, timestamp: 1587660480000, volume: 135 },
+      { close: 4985.09, high: 4988.62, low: 4980.30, open: 4986.72, timestamp: 1587660540000, volume: 76 }
+    ])
+
+    return () => {
+      dispose('chart')
+    }
+  }, [])
+
+  return <div id="chart" style={{ width: 600, height: 600 }}/>
+}
jsx
import { onMount, onCleanup } from 'solid-js'
+import { init, dispose } from 'klinecharts'
+
+export default () => {
+  onMount(() => {
+    const chart = init('chart')
+
+    chart.applyNewData([
+      { close: 4976.16, high: 4977.99, low: 4970.12, open: 4972.89, timestamp: 1587660000000, volume: 204 },
+      { close: 4977.33, high: 4979.94, low: 4971.34, open: 4973.20, timestamp: 1587660060000, volume: 194 },
+      { close: 4977.93, high: 4977.93, low: 4974.20, open: 4976.53, timestamp: 1587660120000, volume: 197 },
+      { close: 4966.77, high: 4968.53, low: 4962.20, open: 4963.88, timestamp: 1587660180000, volume: 28 },
+      { close: 4961.56, high: 4972.61, low: 4961.28, open: 4961.28, timestamp: 1587660240000, volume: 184 },
+      { close: 4964.19, high: 4964.74, low: 4961.42, open: 4961.64, timestamp: 1587660300000, volume: 191 },
+      { close: 4968.93, high: 4972.70, low: 4964.55, open: 4966.96, timestamp: 1587660360000, volume: 105 },
+      { close: 4979.31, high: 4979.61, low: 4973.99, open: 4977.06, timestamp: 1587660420000, volume: 35 },
+      { close: 4977.02, high: 4981.66, low: 4975.14, open: 4981.66, timestamp: 1587660480000, volume: 135 },
+      { close: 4985.09, high: 4988.62, low: 4980.30, open: 4986.72, timestamp: 1587660540000, volume: 76 }
+    ])
+  })
+
+  onCleanup(() => {
+    // 销毁图表
+    dispose('chart')
+  })
+
+  return <div id="chart" style={{ width: '600px', height: '600px' }}/>
+}
svelte
<div id="chart" style="width:600px;height:600px"/>
+
+<script>
+import { onMount, onDestroy } from 'svelte'
+
+onMount(() => {
+  const chart = init('chart')
+
+  chart.applyNewData([
+    { close: 4976.16, high: 4977.99, low: 4970.12, open: 4972.89, timestamp: 1587660000000, volume: 204 },
+    { close: 4977.33, high: 4979.94, low: 4971.34, open: 4973.20, timestamp: 1587660060000, volume: 194 },
+    { close: 4977.93, high: 4977.93, low: 4974.20, open: 4976.53, timestamp: 1587660120000, volume: 197 },
+    { close: 4966.77, high: 4968.53, low: 4962.20, open: 4963.88, timestamp: 1587660180000, volume: 28 },
+    { close: 4961.56, high: 4972.61, low: 4961.28, open: 4961.28, timestamp: 1587660240000, volume: 184 },
+    { close: 4964.19, high: 4964.74, low: 4961.42, open: 4961.64, timestamp: 1587660300000, volume: 191 },
+    { close: 4968.93, high: 4972.70, low: 4964.55, open: 4966.96, timestamp: 1587660360000, volume: 105 },
+    { close: 4979.31, high: 4979.61, low: 4973.99, open: 4977.06, timestamp: 1587660420000, volume: 35 },
+    { close: 4977.02, high: 4981.66, low: 4975.14, open: 4981.66, timestamp: 1587660480000, volume: 135 },
+    { close: 4985.09, high: 4988.62, low: 4980.30, open: 4986.72, timestamp: 1587660540000, volume: 76 }
+  ])
+})
+
+onDestroy(() => {
+  dispose('chart')
+})
+</script>
html
<!DOCTYPE html>
+<html lang="cn" >
+  <head>
+    <meta charset="utf-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1" />
+    <meta name="theme-color" content="#000000" />
+    <meta name="keywords" content="Quick Start"/>
+    <meta name="description" content="Quick Start"/>
+    <title>Quick Start</title>
+    <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/klinecharts/dist/umd/klinecharts.min.js"></script>
+  </head>
+  <body>
+    <div id="chart" style="width:600px;height:600px"></div>
+    <script>
+      window.onload = function () {
+        var chart = klinecharts.init('chart')
+
+        chart.applyNewData([
+          { close: 4976.16, high: 4977.99, low: 4970.12, open: 4972.89, timestamp: 1587660000000, volume: 204 },
+          { close: 4977.33, high: 4979.94, low: 4971.34, open: 4973.20, timestamp: 1587660060000, volume: 194 },
+          { close: 4977.93, high: 4977.93, low: 4974.20, open: 4976.53, timestamp: 1587660120000, volume: 197 },
+          { close: 4966.77, high: 4968.53, low: 4962.20, open: 4963.88, timestamp: 1587660180000, volume: 28 },
+          { close: 4961.56, high: 4972.61, low: 4961.28, open: 4961.28, timestamp: 1587660240000, volume: 184 },
+          { close: 4964.19, high: 4964.74, low: 4961.42, open: 4961.64, timestamp: 1587660300000, volume: 191 },
+          { close: 4968.93, high: 4972.70, low: 4964.55, open: 4966.96, timestamp: 1587660360000, volume: 105 },
+          { close: 4979.31, high: 4979.61, low: 4973.99, open: 4977.06, timestamp: 1587660420000, volume: 35 },
+          { close: 4977.02, high: 4981.66, low: 4975.14, open: 4981.66, timestamp: 1587660480000, volume: 135 },
+          { close: 4985.09, high: 4988.62, low: 4980.30, open: 4986.72, timestamp: 1587660540000, volume: 76 }
+        ])
+      }
+    </script>
+  </body>
+</html>

This completes your first chart creation.

+ + + + \ No newline at end of file diff --git a/en-US/guide/styles.html b/en-US/guide/styles.html new file mode 100644 index 0000000..f67533a --- /dev/null +++ b/en-US/guide/styles.html @@ -0,0 +1,552 @@ + + + + + + 🎨 Style | KLineChart + + + + + + + + + + + + + + + + +
Skip to content

🎨 Style

Whether you see a point or a line on the chart, you can basically customize the style. Changes can be made via the chart method init(ds, options) or the chart instance method setStyles(styles).

Picture explanation

1 grid.horizontal2 grid.vertical3 candle.bar4 candle.candle.priceMark.last.line5 candle.candle.priceMark.last.text6 candle.candle.priceMark.high7 candle.candle.priceMark.low8 candle.candle.tooltip9 indicator.ohlc10 indicator.lastValueMark11 indicator.tooltip12 xAxis.axisLine13 xAxis.tickLine14 xAxis.tickText15 yAxis.axisLine16 yAxis.tickLine17 yAxis.tickText18 separator19 crosshair.horizontal.line20 crosshair.horizontal.text21 crosshair.vertical.line22 crosshair.vertical.text23 overlay

Default full configuration

javascript
{
+  grid: {
+    show: true,
+    horizontal: {
+      show: true,
+      size: 1,
+      color: '#EDEDED',
+      style: 'dashed',
+      dashedValue: [2, 2]
+    },
+    vertical: {
+      show: true,
+      size: 1,
+      color: '#EDEDED',
+      style: 'dashed',
+      dashedValue: [2, 2]
+    }
+  },
+  candle: {
+    // 'candle_solid'|'candle_stroke'|'candle_up_stroke'|'candle_down_stroke'|'ohlc'|'area'
+    type: 'candle_solid',
+    bar: {
+      upColor: '#2DC08E',
+      downColor: '#F92855',
+      noChangeColor: '#888888',
+      upBorderColor: '#2DC08E',
+      downBorderColor: '#F92855',
+      noChangeBorderColor: '#888888',
+      upWickColor: '#2DC08E',
+      downWickColor: '#F92855',
+      noChangeWickColor: '#888888'
+    },
+    area: {
+      lineSize: 2,
+      lineColor: '#2196F3',
+      smooth: false,
+      value: 'close',
+      backgroundColor: [{
+        offset: 0,
+        color: 'rgba(33, 150, 243, 0.01)'
+      }, {
+        offset: 1,
+        color: 'rgba(33, 150, 243, 0.2)'
+      }],
+      point: {
+        show: true,
+        color: blue,
+        radius: 4,
+        rippleColor: getAlphaBlue(0.3),
+        rippleRadius: 8,
+        animation: true,
+        animationDuration: 1000
+      }
+    },
+    priceMark: {
+      show: true,
+      high: {
+        show: true,
+        color: '#D9D9D9',
+        textMargin: 5,
+        textSize: 10,
+        textFamily: 'Helvetica Neue',
+        textWeight: 'normal'
+      },
+      low: {
+        show: true,
+        color: '#D9D9D9',
+        textMargin: 5,
+        textSize: 10,
+        textFamily: 'Helvetica Neue',
+        textWeight: 'normal',
+      },
+      last: {
+        show: true,
+        upColor: '#2DC08E',
+        downColor: '#F92855',
+        noChangeColor: '#888888',
+        line: {
+          show: true,
+          // 'solid' | 'dashed'
+          style: 'dashed',
+          dashedValue: [4, 4],
+          size: 1
+        },
+        text: {
+          show: true,
+          // 'fill' | 'stroke' | 'stroke_fill'
+          style: 'fill',
+          size: 12,
+          paddingLeft: 4,
+          paddingTop: 4,
+          paddingRight: 4,
+          paddingBottom: 4,
+          // 'solid' | 'dashed'
+          borderStyle: 'solid',
+          borderSize: 0,
+          borderColor: 'transparent',
+          borderDashedValue: [2, 2],
+          color: '#FFFFFF',
+          family: 'Helvetica Neue',
+          weight: 'normal',
+          borderRadius: 2
+        }
+      }
+    },
+    tooltip: {
+      offsetLeft: 4,
+      offsetTop: 6,
+      offsetRight: 4,
+      offsetBottom: 6,
+      // 'always' | 'follow_cross' | 'none'
+      showRule: 'always',
+      // 'standard' | 'rect'
+      showType: 'standard',
+      // Custom display, it can be a callback method or an array, when it is a method, it needs to return an array
+      // The child item type of the array is { title, value }
+      // title and value can be strings or objects, and the object type is { text, color }
+      // title or title.text can be an internationalized key,
+      // value or value.text supports string templates
+      // For example: want to display time, opening and closing, configure [{ title: 'time', value: '{time}' }, { title: 'open', value: '{open}' }, { title: ' close', value: '{close}' }]
+      custom: [
+        { title: 'time', value: '{time}' },
+        { title: 'open', value: '{open}' },
+        { title: 'high', value: '{high}' },
+        { title: 'low', value: '{low}' },
+        { title: 'close', value: '{close}' },
+        { title: 'volume', value: '{volume}' }
+      ],
+      defaultValue: 'n/a',
+      rect: {
+       // 'fixed' | 'pointer'
+        position: 'fixed',
+        paddingLeft: 4,
+        paddingRight: 4,
+        paddingTop: 4,
+        paddingBottom: 4,
+        offsetLeft: 4,
+        offsetTop: 4,
+        offsetRight: 4,
+        offsetBottom: 4,
+        borderRadius: 4,
+        borderSize: 1,
+        borderColor: '#f2f3f5',
+        color: '#FEFEFE'
+      },
+      text: {
+        size: 12,
+        family: 'Helvetica Neue',
+        weight: 'normal',
+        color: '#D9D9D9',
+        marginLeft: 8,
+        marginTop: 4,
+        marginRight: 8,
+        marginBottom: 4
+      },
+      // sample:
+      // [{
+      //   id: 'icon_id',
+      //   position: 'left', // types include 'left', 'middle', 'right'
+      //   marginLeft: 8,
+      //   marginTop: 6,
+      //   marginRight: 0,
+      //   marginBottom: 0,
+      //   paddingLeft: 1,
+      //   paddingTop: 1,
+      //   paddingRight: 1,
+      //   paddingBottom: 1,
+      //   icon: '\ue900',
+      //   fontFamily: 'iconfont',
+      //   size: 12,
+      //   color: '#76808F',
+      //   backgroundColor: 'rgba(33, 150, 243, 0.2)',
+      //   activeBackgroundColor: 'rgba(33, 150, 243, 0.4)'
+      // }]
+      icons: []
+    }
+  },
+  indicator: {
+    ohlc: {
+      upColor: 'rgba(45, 192, 142, .7)',
+      downColor: 'rgba(249, 40, 85, .7)',
+      noChangeColor: '#888888'
+    },
+    bars: [{
+      // 'fill' | 'stroke' | 'stroke_fill'
+      style: 'fill',
+      // 'solid' | 'dashed'
+      borderStyle: 'solid',
+      borderSize: 1,
+      borderDashedValue: [2, 2],
+      upColor: 'rgba(45, 192, 142, .7)',
+      downColor: 'rgba(249, 40, 85, .7)',
+      noChangeColor: '#888888'
+    }],
+    lines: [
+      {
+        // 'solid' | 'dashed'
+        style: 'solid',
+        smooth: false,
+        size: 1,
+        dashedValue: [2, 2],
+        color: '#FF9600'
+      }, {
+        style: 'solid',
+        smooth: false,
+        size: 1,
+        dashedValue: [2, 2],
+        color: '#935EBD'
+      }, {
+        style: 'solid',
+        smooth: false,
+        size: 1,
+        dashedValue: [2, 2],
+        color: '#2196F3'
+      }, {
+        style: 'solid',
+        smooth: false,
+        size: 1,
+        dashedValue: [2, 2],
+        color: '#E11D74'
+      }, {
+        style: 'solid',
+        smooth: false,
+        size: 1,
+        dashedValue: [2, 2],
+        color: '#01C5C4'
+      }
+    ],
+    circles: [{
+      // 'fill' | 'stroke' | 'stroke_fill'
+      style: 'fill',
+      // 'solid' | 'dashed'
+      borderStyle: 'solid',
+      borderSize: 1,
+      borderDashedValue: [2, 2],
+      upColor: 'rgba(45, 192, 142, .7)',
+      downColor: 'rgba(249, 40, 85, .7)',
+      noChangeColor: '#888888'
+    }],
+    lastValueMark: {
+      show: false,
+      text: {
+        show: false,
+        // 'fill' | 'stroke' | 'stroke_fill'
+        style: 'fill',
+        color: '#FFFFFF',
+        size: 12,
+        family: 'Helvetica Neue',
+        weight: 'normal',
+        // 'solid' | 'dashed'
+        borderStyle: 'solid',
+        borderSize: 1,
+        borderDashedValue: [2, 2],
+        paddingLeft: 4,
+        paddingTop: 4,
+        paddingRight: 4,
+        paddingBottom: 4,
+        borderRadius: 2
+      }
+    },
+    tooltip: {
+      offsetLeft: 4,
+      offsetTop: 6,
+      offsetRight: 4,
+      offsetBottom: 6,
+      // 'always' | 'follow_cross' | 'none'
+      showRule: 'always',
+      // 'standard' | 'rect'
+      showType: 'standard',
+      showName: true,
+      showParams: true,
+      defaultValue: 'n/a',
+      text: {
+        size: 12,
+        family: 'Helvetica Neue',
+        weight: 'normal',
+        color: '#D9D9D9',
+        marginTop: 4,
+        marginRight: 8,
+        marginBottom: 4,
+        marginLeft: 8
+      },
+      // sample:
+      // [{
+      //   id: 'icon_id',
+      //   position: 'left', // types include 'left', 'middle', 'right'
+      //   marginLeft: 8,
+      //   marginTop: 6,
+      //   marginRight: 0,
+      //   marginBottom: 0,
+      //   paddingLeft: 1,
+      //   paddingTop: 1,
+      //   paddingRight: 1,
+      //   paddingBottom: 1,
+      //   icon: '\ue900',
+      //   fontFamily: 'iconfont',
+      //   size: 12,
+      //   color: '#76808F',
+      //   backgroundColor: 'rgba(33, 150, 243, 0.2)',
+      //   activeBackgroundColor: 'rgba(33, 150, 243, 0.4)'
+      // }]
+      icons: []
+    }
+  },
+  xAxis: {
+    show: true,
+    size: 'auto',
+    axisLine: {
+      show: true,
+      color: '#888888',
+      size: 1
+    },
+    tickText: {
+      show: true,
+      color: '#D9D9D9',
+      family: 'Helvetica Neue',
+      weight: 'normal',
+      size: 12,
+      marginStart: 4,
+      marginEnd: 4
+    },
+    tickLine: {
+      show: true,
+      size: 1,
+      length: 3,
+      color: '#888888'
+    }
+  },
+  yAxis: {
+    show: true,
+    size: 'auto',
+    // 'left' | 'right'
+    position: 'right',
+    // 'normal' | 'percentage' | 'log'
+    type: 'normal',
+    inside: false,
+    reverse: false,
+    axisLine: {
+      show: true,
+      color: '#888888',
+      size: 1
+    },
+    tickText: {
+      show: true,
+      color: '#D9D9D9',
+      family: 'Helvetica Neue',
+      weight: 'normal',
+      size: 12,
+      marginStart: 4,
+      marginEnd: 4
+    },
+    tickLine: {
+      show: true,
+      size: 1,
+      length: 3,
+      color: '#888888'
+    }
+  },
+  separator: {
+    size: 1,
+    color: '#888888',
+    fill: true,
+    activeBackgroundColor: 'rgba(230, 230, 230, .15)'
+  },
+  crosshair: {
+    show: true,
+    horizontal: {
+      show: true,
+      line: {
+        show: true,
+        // 'solid'|'dashed'
+        style: 'dashed',
+        dashedValue: [4, 2],
+        size: 1,
+        color: '#888888'
+      },
+      text: {
+        show: true,
+        // 'fill' | 'stroke' | 'stroke_fill'
+        style: 'fill',
+        color: '#FFFFFF',
+        size: 12,
+        family: 'Helvetica Neue',
+        weight: 'normal',
+        // 'solid' | 'dashed'
+        borderStyle: 'solid',
+        borderDashedValue: [2, 2],
+        borderSize: 1,
+        borderColor: '#686D76',
+        borderRadius: 2,
+        paddingLeft: 4,
+        paddingRight: 4,
+        paddingTop: 4,
+        paddingBottom: 4,
+        backgroundColor: '#686D76'
+      }
+    },
+    vertical: {
+      show: true,
+      line: {
+        show: true,
+        // 'solid'|'dashed'
+        style: 'dashed',
+        dashedValue: [4, 2],
+        size: 1,
+        color: '#888888'
+      },
+      text: {
+        show: true,
+        // 'fill' | 'stroke' | 'stroke_fill'
+        style: 'fill',
+        color: '#FFFFFF',
+        size: 12,
+        family: 'Helvetica Neue',
+        weight: 'normal',
+        // 'solid' | 'dashed'
+        borderStyle: 'solid',
+        borderDashedValue: [2, 2],
+        borderSize: 1,
+        borderColor: '#686D76',
+        borderRadius: 2,
+        paddingLeft: 4,
+        paddingRight: 4,
+        paddingTop: 4,
+        paddingBottom: 4,
+        backgroundColor: '#686D76'
+      }
+    }
+  },
+  overlay: {
+    point: {
+      color: '#1677FF',
+      borderColor: 'rgba(22, 119, 255, 0.35)',
+      borderSize: 1,
+      radius: 5,
+      activeColor: '#1677FF',
+      activeBorderColor: 'rgba(22, 119, 255, 0.35)',
+      activeBorderSize: 3,
+      activeRadius: 5
+    },
+    line: {
+      // 'solid' | 'dashed'
+      style: 'solid',
+      smooth: false,
+      color: '#1677FF',
+      size: 1,
+      dashedValue: [2, 2]
+    },
+    rect: {
+      // 'fill' | 'stroke' | 'stroke_fill'
+      style: 'fill',
+      color: 'rgba(22, 119, 255, 0.25)',
+      borderColor: '#1677FF',
+      borderSize: 1,
+      borderRadius: 0,
+      // 'solid' | 'dashed'
+      borderStyle: 'solid',
+      borderDashedValue: [2, 2]
+    },
+    polygon: {
+      // 'fill' | 'stroke' | 'stroke_fill'
+      style: 'fill',
+      color: '#1677FF',
+      borderColor: '#1677FF',
+      borderSize: 1,
+      // 'solid' | 'dashed'
+      borderStyle: 'solid',
+      borderDashedValue: [2, 2]
+    },
+    circle: {
+      // 'fill' | 'stroke' | 'stroke_fill'
+      style: 'fill',
+      color: 'rgba(22, 119, 255, 0.25)',
+      borderColor: '#1677FF',
+      borderSize: 1,
+      // 'solid' | 'dashed'
+      borderStyle: 'solid',
+      borderDashedValue: [2, 2]
+    },
+    arc: {
+      // 'solid' | 'dashed'
+      style: 'solid',
+      color: '#1677FF',
+      size: 1,
+      dashedValue: [2, 2]
+    },
+    text: {
+      // 'fill' | 'stroke' | 'stroke_fill'
+      style: 'fill',
+      color: '#FFFFFF',
+      size: 12,
+      family: 'Helvetica Neue',
+      weight: 'normal',
+      // 'solid' | 'dashed'
+      borderStyle: 'solid',
+      borderDashedValue: [2, 2],
+      borderSize: 0,
+      borderRadius: 2,
+      borderColor: '#1677FF',
+      paddingLeft: 0,
+      paddingRight: 0,
+      paddingTop: 0,
+      paddingBottom: 0,
+      backgroundColor: 'transparent'
+    },
+    rectText: {
+      // 'fill' | 'stroke' | 'stroke_fill'
+      style: 'fill',
+      color: '#FFFFFF',
+      size: 12,
+      family: 'Helvetica Neue',
+      weight: 'normal',
+      // 'solid' | 'dashed'
+      borderStyle: 'solid',
+      borderDashedValue: [2, 2],
+      borderSize: 1,
+      borderRadius: 2,
+      borderColor: '#1677FF',
+      paddingLeft: 4,
+      paddingRight: 4,
+      paddingTop: 4,
+      paddingBottom: 4,
+      backgroundColor: '#1677FF'
+    }
+  }
+}
+ + + + \ No newline at end of file diff --git a/en-US/guide/v8-to-v9.html b/en-US/guide/v8-to-v9.html new file mode 100644 index 0000000..5edef49 --- /dev/null +++ b/en-US/guide/v8-to-v9.html @@ -0,0 +1,26 @@ + + + + + + 🛠️ From V8 to V9 | KLineChart + + + + + + + + + + + + + + + +
Skip to content

🛠️ From V8 to V9

This document will help you upgrade from kinecharts 8.x to klinecharts 9.x. If you are 7.x or older, please refer to the previous upgrade document to upgrade to 8.x.

Import adjustment

klinecharts/index.blank' and klinecharts/index.simple are no longer distinguished. Please use import {...} from klinecharts uniformly.

Design adjustment

shape, annotation, tag are merged into overlay. Please refer to overlay for details.

Style configuration adjustment

  • The style options of all lines are changed to dashed and dashValue to dashedValue.
  • candle.tooltip.labels and candle.tooltip.values are merged into candle.tooltip.custom.
  • xAxis.height is changed to xAxis.size, xAxis.tickeText.paddingTop is changed to xAxis.tickeText.marinStart, and xAxis.tickeText.paddingBottom is changed to xAxis.tickeText.marginEnd.
  • yAxis.height is changed to yAxis.size, yAxis.tickeText.paddingTop is changed to yAxis.tickeText.marinStart, and yAxis.tickeText.paddingBottom is changed to yAxis.tickeText.marginEnd.
  • technicalIndicator.bar is changed to indicator.bars, technicalIndicator.line is changed to indicator.linestechnicalIndicator.circle is changed to indicator.circles.
  • Delete shape, annotation, tag, please use overlay instead.

API adjustment

Chart API

  • extension.addTechnicalIndicatorTemplate(template) is changed to registerIndicator(template).
  • Delete extension.addShapeTemplate(template), please use registerOverlay(template) instead.

Instance API

  • getDom({paneId, position}) is changed to getDom(paneId, position), and the parameter position option is changed to root, main and yAxis.
  • getWidth() and getHeight() are combined into a method 'getSize(paneId, position).
  • setStyleOptions(styles) is changed to setStyles(styles).
  • getStyleOptions() is changed to getStyles().
  • setOffsetRightSpace(space) is changed to setOffsetRightDistance(distance).
  • createTechnicalIndicator(value, isStack, paneOptions) is changed to createIndicator(value, isStack, paneOptions).
  • overrideTechnicalIndicator(override, paneId) is changed to overrideIndicator(override, paneId).
  • getTechnicalIndicatorByPaneId(paneId, name) is changed to getIndicatorByPaneId(paneId, name).
  • removeTechnicalIndicator(paneId, name) is changed to removeIndicator(paneId, name).
  • subscribeAction(type, callback) and unsubscribeAction(type, callback). The parameter type option is changed to onZoom, onScroll, onCrosshairChange, onVisibleRangeChange and onPaneDrag.
  • convertToPixel(value, finder) and convertFromPixel(coordinate, finder), the parameter finder.absoluteYAxis is changed to finder.absolute.
  • To delete createShape(value, paneId), createAnnotation(annotation, paneId), createTag(tag, paneId), please use createOverlay(value, paneId) instead.
  • To delete removeShape(id), removeAnnotation(paneId, points), removeTag(paneId, tagId), please use removeOverlay(id) instead.
  • To delete setShapeOptions(options), use overrideOverlay(override) instead.
  • To delete createHtml(html, paneId), removeHtml(paneId, htmlId), please obtain the corresponding dom through getDom(paneId, position).
  • To delete getTechnicalIndicatorByPaneId(paneId, name).

Shape help API

  • All APIs are migrated to 'klinecharts.utils'.

Customized technical indicator adjustment

  • Attribute plots is changed to figures, sub item methods color, isStroke, isDashed are merged into styles.
  • Change the method 'regeneratePlots(params) to regenerateFigures(params).
  • The method calcTechnicalIndicator(kLineDataList, options) is changed to calc(kLineDataList, indicator).
  • The method createTooltipDataSource({ dataSource, viewport, crosshair, technicalIndicator, xAxis, yAxis, defaultStyles }) is changed to createTooltipDataSource({ kLineDataList, indicator, visibleRange, bounding, crosshair, defaultStyles, xAxis, yAxis }). The return value is determined by [{ title: 'xxx', value: 'xxx', color: 'xxx' } ] Change to { name: 'xxx', calcParamsText: 'xxx', values: [{ title: 'xxx', value: 'xxx', color: 'xxx' }, ...] }.
  • The method render({ctx, dataSource, viewport, styles, xAxis, yAxis}) is changed to draw({ ctx, kLineDataList, indicator, visibleRange, bounding, barSpace, defaultStyles, xAxis, yAxis }).
  • Delete the attribute shouldCheckParamCount.
+ + + + \ No newline at end of file diff --git a/en-US/index.html b/en-US/index.html new file mode 100644 index 0000000..117492a --- /dev/null +++ b/en-US/index.html @@ -0,0 +1,26 @@ + + + + + + Highly customizable professional lightweight financial chart | KLineChart + + + + + + + + + + + + + + + +
Skip to content

KLineChart

Highly customizable professional lightweight financial chart

Easy to use, lightweight and smooth, suitable for web front-end financial chart with rich scenarios.

KLineChart
+ + + + \ No newline at end of file diff --git a/en-US/more/faq.html b/en-US/more/faq.html new file mode 100644 index 0000000..c5d337e --- /dev/null +++ b/en-US/more/faq.html @@ -0,0 +1,30 @@ + + + + + + 🙋 FAQ | KLineChart + + + + + + + + + + + + + + + +
Skip to content

🙋 FAQ

After the chart is initialized, only one line can be seen?

The chart always fills the container, checking to see if the container has height.

The candle shows a line, no fluctuation, what to do?

Chart default price precision is two decimal, call setPriceVolumePrecision(pricePrecision, volumePrecision) to set the precision.

How to create a real-time chart?

Through style settings.

javascript
chart.setStyles({
+  candle: {
+    type: 'area',
+  },
+});

Built-in technical indicators, calculated data is not what you want, how to do?

You can override calc by the chart method createIndicator or overrideIndicator.

What if I want to create an indicator other than the built-in technical indicator?

Charts support custom technical indicators, see indicators for details.

Want to mark the point of sale, how should do?

Overlays can be used. The built-in overlay has a simpleAnnotation, which can be created with the chart api createOverlay({ name: 'simpleAnnotation', ... }, paneId).

+ + + + \ No newline at end of file diff --git a/en-US/more/feedback.html b/en-US/more/feedback.html new file mode 100644 index 0000000..e5c9fe7 --- /dev/null +++ b/en-US/more/feedback.html @@ -0,0 +1,27 @@ + + + + + + 💬 Feedback | KLineChart + + + + + + + + + + + + + + + + +
Skip to content

💬 Feedback

Github

Telegram

https://t.me/+098syuQtzI0yNzll

Wechat discussion group

Scan to add developers, note KLineChart, and join the group chat.

+ + + + \ No newline at end of file diff --git a/en-US/more/local-development.html b/en-US/more/local-development.html new file mode 100644 index 0000000..2e3a271 --- /dev/null +++ b/en-US/more/local-development.html @@ -0,0 +1,28 @@ + + + + + + Local Development | KLineChart + + + + + + + + + + + + + + + + +
Skip to content

Local Development

Introduction

If you see this, you may be interested in improving the KLineChart core. Thank you @fish2016 This document was written.

Notice

File directory description

  • dist
    //  Store compiled files
  • docs
    //  Docs directory
  • scripts
    //  Built script directory
  • src
    //  Source code directory
    • common
      //  Store some public basic files
      • utils
        //  Util directory
    • component
      //  Component directory
    • extension
      //  Some module directory that can be extended
      • figure
        //  Basic drawing directory
      • i18n
        //  International directory
      • indicator
        //  Indicator directory
      • overlay
        //  Overlay directory
      • styles
        //  Style directory
      • x-axis
        //  X-axis directory
      • y-axis
        //  Y-axis directory
    • pane
      //  Panel directory
    • store
      //  Data store directory
    • view
      //  Draw module directory
    • widget
      //  Draw module collection directory
  • tests
    //  Test module directory

Module dependencies

The above diagram shows the hierarchy of chart modules from top to bottom, with the lower layer serving as the upper layer container.

  • Figure Basic shapes, such as circle, polygon, rect, text, etc.
  • View Retrieve data from ChartStore and perform single business plotting, such as candlesticks, area, grid line, crosshair, indicator, etc
  • Widget Create canvas and assemble the relevant View together.
  • Pane Create dom container and assemble the Widget together.
  • Chart Manage the Panes, such as deleting and adding operations, to form the final chart. In addition, event distribution is also carried out to manipulate the data in ChartStore and notify subordinate components to update as needed.

Development

Installation dependencies

The project adopts a dependency Node.js The package manager for management requires Node.js environment. You can use npm, pnpm, or yarn to install dependencies.

bash
# Root dir run
+npm install

NPM Execute command description

  • lint: Run npm run lint verify code rules.
  • clean: Run npm run clean clean up the built files.
  • build-esm: Run npm run build-esm built esm module.
  • build-cjs: Run npm run build-cjs built commonjs module.
  • build-umd:dev: Run npm run build-umd:dev built umd development module.
  • build-umd:prod: Run npm run build-umd:dev built umd production module.
  • build-umd: Run npm run build-umd built umd development and production module。
  • build-core: Run npm run build-core built esm, commonjs umd development and umd production module.
  • build-dts: Run npm run build-dts generate typescript dependency files.
  • build: Run npm run build built esm, commonjs umd development and umd production module and generate typescript dependency files.

Debug

This project does not have a debugging project and requires the creation of a new project, use npm link import,or import index.ts debug. You can use vite create a project.

+ + + + \ No newline at end of file diff --git a/en-US/sample/axis.html b/en-US/sample/axis.html new file mode 100644 index 0000000..2f22615 --- /dev/null +++ b/en-US/sample/axis.html @@ -0,0 +1,155 @@ + + + + + + Axis | KLineChart + + + + + + + + + + + + + + + + +
Skip to content

Axis

Open in a new window
js
import { init } from 'klinecharts'
+import './index.css'
+
+function genData (timestamp = new Date().getTime(), length = 800) {
+  let basePrice = 5000
+  timestamp = Math.floor(timestamp / 1000 / 60) * 60 * 1000 - length * 60 * 1000
+  const dataList = []
+  for (let i = 0; i < length; i++) {
+    const prices = []
+    for (let j = 0; j < 4; j++) {
+      prices.push(basePrice + Math.random() * 60 - 30)
+    }
+    prices.sort()
+    const open = +(prices[Math.round(Math.random() * 3)].toFixed(2))
+    const high = +(prices[3].toFixed(2))
+    const low = +(prices[0].toFixed(2))
+    const close = +(prices[Math.round(Math.random() * 3)].toFixed(2))
+    const volume = Math.round(Math.random() * 100) + 10
+    const turnover = (open + high + low + close) / 4 * volume
+    dataList.push({ timestamp, open, high,low, close, volume, turnover })
+
+    basePrice = close
+    timestamp += 60 * 1000
+  }
+  return dataList
+}
+
+const chart = init('k-line-chart')
+chart.applyNewData(genData())
+
+function setPosition (position) {
+  chart.setStyles({
+    yAxis: {
+      position
+    }
+  })
+}
+
+function setInside (inside) {
+  chart.setStyles({
+    yAxis: {
+      inside
+    }
+  })
+}
+
+function setType (type) {
+  chart.setStyles({
+    yAxis: {
+      type
+    }
+  })
+}
+
+function setReverse (reverse) {
+  chart.setStyles({
+    yAxis: {
+      reverse
+    }
+  })
+}
+
+// 以下仅仅是为了协助代码演示,在实际项目中根据情况进行调整。
+// The following is only for the purpose of assisting in code demonstration, and adjustments will be made according to the actual situation in the project.
+const container = document.getElementById('container')
+const buttonContainer = document.createElement('div')
+buttonContainer.className = 'button-container'
+
+const positions = [
+  { key: 'right', text: '右侧-Right' },
+  { key: 'left', text: '左侧-Left' }
+]
+const insideOutside = [
+  { key: false, text: '外部-Outside' },
+  { key: true, text: '内部-Inside' }
+]
+const types = [
+  { key: 'normal', text: '线性轴-Liner Axis' },
+  { key: 'percentage', text: '百分比轴-Percentage axis' },
+  { key: 'log', text: '对数轴-Logarithm axis' },
+]
+const reverse = [
+  { key: false, text: '正向-Regularity' },
+  { key: true, text: '反向-Reverse' }
+]
+positions.forEach(({ key, text }) => {
+  const button = document.createElement('button')
+  button.innerText = text
+  button.addEventListener('click', () => { setPosition(key) })
+  buttonContainer.appendChild(button)
+})
+insideOutside.forEach(({ key, text }) => {
+  const button = document.createElement('button')
+  button.innerText = text
+  button.addEventListener('click', () => { setInside(key) })
+  buttonContainer.appendChild(button)
+})
+types.forEach(({ key, text }) => {
+  const button = document.createElement('button')
+  button.innerText = text
+  button.addEventListener('click', () => { setType(key) })
+  buttonContainer.appendChild(button)
+})
+reverse.forEach(({ key, text }) => {
+  const button = document.createElement('button')
+  button.innerText = text
+  button.addEventListener('click', () => { setReverse(key) })
+  buttonContainer.appendChild(button)
+})
+container.appendChild(buttonContainer)
html
<div id="container">
+  <div id="k-line-chart" style="height:430px">
+</div>
css
.button-container {
+  display: flex;
+  flex-wrap: wrap;
+  align-items: center;
+  gap: 8px;
+  margin-top: 10px;
+  padding: 10px 22px;
+}
+
+.button-container button {
+  padding: 2px 6px;
+  background-color: #1677FF;
+  border-radius: 4px;
+  font-size: 12px;
+  color: #fff;
+  outline: none;
+  border: none;
+}
+ + + + \ No newline at end of file diff --git a/en-US/sample/basic.html b/en-US/sample/basic.html new file mode 100644 index 0000000..410875f --- /dev/null +++ b/en-US/sample/basic.html @@ -0,0 +1,54 @@ + + + + + + Basic | KLineChart + + + + + + + + + + + + + + + + +
Skip to content

Basic

Open in a new window
js
import { init } from 'klinecharts'
+
+function genData (timestamp = new Date().getTime(), length = 800) {
+  let basePrice = 5000
+  timestamp = Math.floor(timestamp / 1000 / 60) * 60 * 1000 - length * 60 * 1000
+  const dataList = []
+  for (let i = 0; i < length; i++) {
+    const prices = []
+    for (let j = 0; j < 4; j++) {
+      prices.push(basePrice + Math.random() * 60 - 30)
+    }
+    prices.sort()
+    const open = +(prices[Math.round(Math.random() * 3)].toFixed(2))
+    const high = +(prices[3].toFixed(2))
+    const low = +(prices[0].toFixed(2))
+    const close = +(prices[Math.round(Math.random() * 3)].toFixed(2))
+    const volume = Math.round(Math.random() * 100) + 10
+    const turnover = (open + high + low + close) / 4 * volume
+    dataList.push({ timestamp, open, high,low, close, volume, turnover })
+
+    basePrice = close
+    timestamp += 60 * 1000
+  }
+  return dataList
+}
+
+const chart = init('k-line-chart')
+chart.applyNewData(genData())
html
<div id="k-line-chart" style="height:430px"/>
+ + + + \ No newline at end of file diff --git a/en-US/sample/candle-type.html b/en-US/sample/candle-type.html new file mode 100644 index 0000000..6faf881 --- /dev/null +++ b/en-US/sample/candle-type.html @@ -0,0 +1,101 @@ + + + + + + Candle Type | KLineChart + + + + + + + + + + + + + + + + +
Skip to content

Candle Type

Open in a new window
js
import { init } from 'klinecharts'
+import './index.css'
+
+function genData (timestamp = new Date().getTime(), length = 800) {
+  let basePrice = 5000
+  timestamp = Math.floor(timestamp / 1000 / 60) * 60 * 1000 - length * 60 * 1000
+  const dataList = []
+  for (let i = 0; i < length; i++) {
+    const prices = []
+    for (let j = 0; j < 4; j++) {
+      prices.push(basePrice + Math.random() * 60 - 30)
+    }
+    prices.sort()
+    const open = +(prices[Math.round(Math.random() * 3)].toFixed(2))
+    const high = +(prices[3].toFixed(2))
+    const low = +(prices[0].toFixed(2))
+    const close = +(prices[Math.round(Math.random() * 3)].toFixed(2))
+    const volume = Math.round(Math.random() * 100) + 10
+    const turnover = (open + high + low + close) / 4 * volume
+    dataList.push({ timestamp, open, high,low, close, volume, turnover })
+
+    basePrice = close
+    timestamp += 60 * 1000
+  }
+  return dataList
+}
+
+const chart = init('k-line-chart')
+chart.applyNewData(genData())
+
+function setType (type) {
+  chart.setStyles({
+    candle: { type }
+  })
+}
+
+// 以下仅仅是为了协助代码演示,在实际项目中根据情况进行调整。
+// The following is only for the purpose of assisting in code demonstration, and adjustments will be made according to the actual situation in the project.
+const container = document.getElementById('container')
+const buttonContainer = document.createElement('div')
+buttonContainer.className = 'button-container'
+const items = [
+  { key: 'candle_solid', text: '全实心-All solid' },
+  { key: 'candle_stroke', text: '全空心-All stroke' },
+  { key: 'candle_up_stroke', text: '涨空心-Up stroke' },
+  { key: 'candle_down_stroke', text: '跌空心-Down stroke' },
+  { key: 'ohlc', text: 'OHLC' },
+  { key: 'area', text: '面积图-Area' }
+]
+items.forEach(({ key, text }) => {
+  const button = document.createElement('button')
+  button.innerText = text
+  button.addEventListener('click', () => { setType(key) })
+  buttonContainer.appendChild(button)
+})
+container.appendChild(buttonContainer)
html
<div id="container">
+  <div id="k-line-chart" style="height:430px">
+</div>
css
.button-container {
+  display: flex;
+  flex-wrap: wrap;
+  align-items: center;
+  gap: 8px;
+  margin-top: 10px;
+  padding: 10px 22px;
+}
+
+.button-container button {
+  padding: 2px 6px;
+  background-color: #1677FF;
+  border-radius: 4px;
+  font-size: 12px;
+  color: #fff;
+  outline: none;
+  border: none;
+}
+ + + + \ No newline at end of file diff --git a/en-US/sample/data.html b/en-US/sample/data.html new file mode 100644 index 0000000..d1f4b8d --- /dev/null +++ b/en-US/sample/data.html @@ -0,0 +1,75 @@ + + + + + + Data | KLineChart + + + + + + + + + + + + + + + + +
Skip to content

Data

Open in a new window
js
import { init } from 'klinecharts'
+
+function genData (timestamp = new Date().getTime(), length = 800) {
+  let basePrice = 5000
+  timestamp = Math.floor(timestamp / 1000 / 60) * 60 * 1000 - length * 60 * 1000
+  const dataList = []
+  for (let i = 0; i < length; i++) {
+    const prices = []
+    for (let j = 0; j < 4; j++) {
+      prices.push(basePrice + Math.random() * 60 - 30)
+    }
+    prices.sort()
+    const open = +(prices[Math.round(Math.random() * 3)].toFixed(2))
+    const high = +(prices[3].toFixed(2))
+    const low = +(prices[0].toFixed(2))
+    const close = +(prices[Math.round(Math.random() * 3)].toFixed(2))
+    const volume = Math.round(Math.random() * 100) + 10
+    const turnover = (open + high + low + close) / 4 * volume
+    dataList.push({ timestamp, open, high,low, close, volume, turnover })
+
+    basePrice = close
+    timestamp += 60 * 1000
+  }
+  return dataList
+}
+
+const chart = init('k-line-chart')
+chart.applyNewData(genData())
+chart.loadMore((timestamp) => {
+  loadMoreTimer = setTimeout(() => {
+    chart.applyMoreData(genData(timestamp), true)
+  }, 2000)
+})
+chart.applyNewData(genData(), true)
+updateData()
+
+function updateData () {
+  setTimeout(() => {
+    const dataList = chart.getDataList()
+    const lastData = dataList[dataList.length - 1]
+    const newData = { ...lastData }
+    newData.close += (Math.random() * 20 - 10)
+    newData.high = Math.max(newData.high, newData.close)
+    newData.low = Math.min(newData.low, newData.close)
+    newData.volume += Math.round(Math.random() * 10)
+    chart.updateData(newData)
+    updateData()
+  }, 600)
+}
html
<div id="k-line-chart" style="height:430px"/>
+ + + + \ No newline at end of file diff --git a/en-US/sample/i18n.html b/en-US/sample/i18n.html new file mode 100644 index 0000000..912ae1b --- /dev/null +++ b/en-US/sample/i18n.html @@ -0,0 +1,105 @@ + + + + + + I18n | KLineChart + + + + + + + + + + + + + + + + +
Skip to content

I18n

Open in a new window
js
import { init, registerLocale } from 'klinecharts'
+import './index.css'
+
+function genData (timestamp = new Date().getTime(), length = 800) {
+  let basePrice = 5000
+  timestamp = Math.floor(timestamp / 1000 / 60) * 60 * 1000 - length * 60 * 1000
+  const dataList = []
+  for (let i = 0; i < length; i++) {
+    const prices = []
+    for (let j = 0; j < 4; j++) {
+      prices.push(basePrice + Math.random() * 60 - 30)
+    }
+    prices.sort()
+    const open = +(prices[Math.round(Math.random() * 3)].toFixed(2))
+    const high = +(prices[3].toFixed(2))
+    const low = +(prices[0].toFixed(2))
+    const close = +(prices[Math.round(Math.random() * 3)].toFixed(2))
+    const volume = Math.round(Math.random() * 100) + 10
+    const turnover = (open + high + low + close) / 4 * volume
+    dataList.push({ timestamp, open, high,low, close, volume, turnover })
+
+    basePrice = close
+    timestamp += 60 * 1000
+  }
+  return dataList
+}
+
+registerLocale('zh-HK', {
+  time: '時間:',
+  open: '開:',
+  high: '高:',
+  low: '低:',
+  close: '收:',
+  volume: '成交量:'
+})
+
+const chart = init('k-line-chart')
+chart.applyNewData(genData())
+
+function setLang (lang) {
+  chart.setLocale(lang)
+}
+
+// 以下仅仅是为了协助代码演示,在实际项目中根据情况进行调整。
+// The following is only for the purpose of assisting in code demonstration, and adjustments will be made according to the actual situation in the project.
+const container = document.getElementById('container')
+const buttonContainer = document.createElement('div')
+buttonContainer.className = 'button-container'
+const items = [
+  { key: 'zh-CN', text: '简体中文' },
+  { key: 'zh-HK', text: '繁体中文' },
+  { key: 'en-US', text: 'English' }
+]
+items.forEach(({ key, text }) => {
+  const button = document.createElement('button')
+  button.innerText = text
+  button.addEventListener('click', () => { setLang(key) })
+  buttonContainer.appendChild(button)
+})
+container.appendChild(buttonContainer)
html
<div id="container">
+  <div id="k-line-chart" style="height:430px">
+</div>
css
.button-container {
+  display: flex;
+  flex-wrap: wrap;
+  align-items: center;
+  gap: 8px;
+  margin-top: 10px;
+  padding: 10px 22px;
+}
+
+.button-container button {
+  padding: 2px 6px;
+  background-color: #1677FF;
+  border-radius: 4px;
+  font-size: 12px;
+  color: #fff;
+  outline: none;
+  border: none;
+}
+ + + + \ No newline at end of file diff --git a/en-US/sample/indicator.html b/en-US/sample/indicator.html new file mode 100644 index 0000000..5c0fe58 --- /dev/null +++ b/en-US/sample/indicator.html @@ -0,0 +1,152 @@ + + + + + + Indicator | KLineChart + + + + + + + + + + + + + + + + +
Skip to content

Indicator

Open in a new window
js
import { init, registerIndicator } from 'klinecharts'
+import './index.css'
+
+const fruits = [
+  '🍏', '🍎', '🍐', '🍊', '🍋', '🍌',
+  '🍉', '🍇', '🍓', '🍈', '🍒', '🍑',
+  '🍍', '🥥', '🥝', '🥭', '🥑', '🍏'
+]
+
+registerIndicator({
+  name: 'Custom',
+  figures: [
+    { key: 'emoji' }
+  ],
+  calc: (kLineDataList) => {
+    return kLineDataList.map(kLineData => ({ emoji: kLineData.close, text: fruits[Math.floor(Math.random() * 17)] }))
+  },
+  draw: ({
+    ctx,
+    barSpace,
+    visibleRange,
+    indicator,
+    xAxis,
+    yAxis
+  }) => {
+    const { from, to } = visibleRange
+
+    ctx.font = barSpace.gapBar + 'px' + ' Helvetica Neue'
+    ctx.textAlign = 'center'
+    const result = indicator.result
+    for (let i = from; i < to; i++) {
+      const data = result[i]
+      const x = xAxis.convertToPixel(i)
+      const y = yAxis.convertToPixel(data.emoji)
+      ctx.fillText(data.text, x, y)
+    }
+    return false
+  }
+})
+
+function genData (timestamp = new Date().getTime(), length = 800) {
+  let basePrice = 5000
+  timestamp = Math.floor(timestamp / 1000 / 60) * 60 * 1000 - length * 60 * 1000
+  const dataList = []
+  for (let i = 0; i < length; i++) {
+    const prices = []
+    for (let j = 0; j < 4; j++) {
+      prices.push(basePrice + Math.random() * 60 - 30)
+    }
+    prices.sort()
+    const open = +(prices[Math.round(Math.random() * 3)].toFixed(2))
+    const high = +(prices[3].toFixed(2))
+    const low = +(prices[0].toFixed(2))
+    const close = +(prices[Math.round(Math.random() * 3)].toFixed(2))
+    const volume = Math.round(Math.random() * 100) + 10
+    const turnover = (open + high + low + close) / 4 * volume
+    dataList.push({ timestamp, open, high,low, close, volume, turnover })
+
+    basePrice = close
+    timestamp += 60 * 1000
+  }
+  return dataList
+}
+
+const chart = init('k-line-chart')
+chart.applyNewData(genData())
+
+function setMainIndicator(name) {
+  chart.createIndicator(name, true, { id: 'candle_pane' })
+}
+
+function setSubIndicator(name) {
+  chart.createIndicator(name)
+}
+
+
+// 以下仅仅是为了协助代码演示,在实际项目中根据情况进行调整。
+// The following is only for the purpose of assisting in code demonstration, and adjustments will be made according to the actual situation in the project.
+const container = document.getElementById('container')
+const buttonContainer = document.createElement('div')
+buttonContainer.className = 'button-container'
+
+const mainIndicators = ['MA', 'BOLL', 'Custom']
+const subIndicators = ['VOL', 'MACD', 'Custom']
+
+const mainTitle = document.createElement('span')
+mainTitle.innerText = '主图指标-Main indicator: '
+buttonContainer.appendChild(mainTitle)
+mainIndicators.forEach((name) => {
+  const button = document.createElement('button')
+  button.innerText = name
+  button.addEventListener('click', () => { setMainIndicator(name) })
+  buttonContainer.appendChild(button)
+})
+
+const subTitle = document.createElement('span')
+subTitle.style.paddingLeft = '16px'
+subTitle.innerText = '副图指标-Sub indicator: '
+buttonContainer.appendChild(subTitle)
+subIndicators.forEach((name) => {
+  const button = document.createElement('button')
+  button.innerText = name
+  button.addEventListener('click', () => { setSubIndicator(name) })
+  buttonContainer.appendChild(button)
+})
+
+container.appendChild(buttonContainer)
html
<div id="container">
+  <div id="k-line-chart" style="height:430px">
+</div>
css
.button-container {
+  display: flex;
+  flex-wrap: wrap;
+  align-items: center;
+  gap: 8px;
+  margin-top: 10px;
+  padding: 10px 22px;
+}
+
+.button-container button {
+  padding: 2px 6px;
+  background-color: #1677FF;
+  border-radius: 4px;
+  font-size: 12px;
+  color: #fff;
+  outline: none;
+  border: none;
+}
+ + + + \ No newline at end of file diff --git a/en-US/sample/overlay.html b/en-US/sample/overlay.html new file mode 100644 index 0000000..4c1a0b3 --- /dev/null +++ b/en-US/sample/overlay.html @@ -0,0 +1,122 @@ + + + + + + Overlay | KLineChart + + + + + + + + + + + + + + + + +
Skip to content

Overlay

Open in a new window
js
import { init, registerOverlay } from 'klinecharts'
+import './index.css'
+
+function genData (timestamp = new Date().getTime(), length = 800) {
+  let basePrice = 5000
+  timestamp = Math.floor(timestamp / 1000 / 60) * 60 * 1000 - length * 60 * 1000
+  const dataList = []
+  for (let i = 0; i < length; i++) {
+    const prices = []
+    for (let j = 0; j < 4; j++) {
+      prices.push(basePrice + Math.random() * 60 - 30)
+    }
+    prices.sort()
+    const open = +(prices[Math.round(Math.random() * 3)].toFixed(2))
+    const high = +(prices[3].toFixed(2))
+    const low = +(prices[0].toFixed(2))
+    const close = +(prices[Math.round(Math.random() * 3)].toFixed(2))
+    const volume = Math.round(Math.random() * 100) + 10
+    const turnover = (open + high + low + close) / 4 * volume
+    dataList.push({ timestamp, open, high,low, close, volume, turnover })
+
+    basePrice = close
+    timestamp += 60 * 1000
+  }
+  return dataList
+}
+
+registerOverlay({
+  name: 'circle',
+  needDefaultPointFigure: true,
+  needDefaultXAxisFigure: true,
+  needDefaultYAxisFigure: true,
+  totalStep: 3,
+  createPointFigures: ({ coordinates }) => {
+    if (coordinates.length === 2) {
+      const xDis = Math.abs(coordinates[0].x - coordinates[1].x)
+      const yDis = Math.abs(coordinates[0].y - coordinates[1].y)
+      const radius = Math.sqrt(xDis * xDis + yDis * yDis)
+      return {
+        key: 'circle',
+        type: 'circle',
+        attrs: {
+          ...coordinates[0],
+          r: radius
+        },
+        styles: {
+          style: 'stroke_fill'
+        }
+      }
+    }
+    return []
+  }
+})
+
+const chart = init('k-line-chart')
+chart.applyNewData(genData())
+
+function createOverlay (name) {
+  chart.createOverlay(name)
+}
+
+// 以下仅仅是为了协助代码演示,在实际项目中根据情况进行调整。
+// The following is only for the purpose of assisting in code demonstration, and adjustments will be made according to the actual situation in the project.
+const container = document.getElementById('container')
+const buttonContainer = document.createElement('div')
+buttonContainer.className = 'button-container'
+const items = [
+  { key: 'priceLine', text: '价格线(内置)-Price line(built-in)' },
+  { key: 'circle', text: '圆(自定义)-Circle(custom)' }
+]
+items.forEach(({ key, text }) => {
+  const button = document.createElement('button')
+  button.innerText = text
+  button.addEventListener('click', () => { createOverlay(key) })
+  buttonContainer.appendChild(button)
+})
+container.appendChild(buttonContainer)
html
<div id="container">
+  <div id="k-line-chart" style="height:430px">
+</div>
css
.button-container {
+  display: flex;
+  flex-wrap: wrap;
+  align-items: center;
+  gap: 8px;
+  margin-top: 10px;
+  padding: 10px 22px;
+}
+
+.button-container button {
+  padding: 2px 6px;
+  background-color: #1677FF;
+  border-radius: 4px;
+  font-size: 12px;
+  color: #fff;
+  outline: none;
+  border: none;
+}
+ + + + \ No newline at end of file diff --git a/en-US/sample/theme.html b/en-US/sample/theme.html new file mode 100644 index 0000000..529551f --- /dev/null +++ b/en-US/sample/theme.html @@ -0,0 +1,195 @@ + + + + + + Theme | KLineChart + + + + + + + + + + + + + + + + +
Skip to content

Theme

Open in a new window
js
import { init, registerStyles } from 'klinecharts'
+import './index.css'
+
+function genData (timestamp = new Date().getTime(), length = 800) {
+  let basePrice = 5000
+  timestamp = Math.floor(timestamp / 1000 / 60) * 60 * 1000 - length * 60 * 1000
+  const dataList = []
+  for (let i = 0; i < length; i++) {
+    const prices = []
+    for (let j = 0; j < 4; j++) {
+      prices.push(basePrice + Math.random() * 60 - 30)
+    }
+    prices.sort()
+    const open = +(prices[Math.round(Math.random() * 3)].toFixed(2))
+    const high = +(prices[3].toFixed(2))
+    const low = +(prices[0].toFixed(2))
+    const close = +(prices[Math.round(Math.random() * 3)].toFixed(2))
+    const volume = Math.round(Math.random() * 100) + 10
+    const turnover = (open + high + low + close) / 4 * volume
+    dataList.push({ timestamp, open, high,low, close, volume, turnover })
+
+    basePrice = close
+    timestamp += 60 * 1000
+  }
+  return dataList
+}
+
+const red = '#F92855'
+const green = '#2DC08E'
+
+const alphaRed = 'rgba(249, 40, 85, .7)'
+const alphaGreen = 'rgba(45, 192, 142, .7)'
+
+registerStyles('green_rise_red_fall', {
+  candle: {
+    bar: {
+      upColor: green,
+      downColor: red,
+      upBorderColor: green,
+      downBorderColor: red,
+      upWickColor: green,
+      downWickColor: red
+    },
+    priceMark: {
+      last: {
+        upColor: green,
+        downColor: red
+      }
+    }
+  },
+  indicator: {
+    ohlc: {
+      upColor: alphaGreen,
+      downColor: alphaRed
+    },
+    bars: [{
+      style: 'fill',
+      borderStyle: 'solid',
+      borderSize: 1,
+      borderDashedValue: [2, 2],
+      upColor: alphaGreen,
+      downColor: alphaRed,
+      noChangeColor: '#888888'
+    }],
+    circles: [{
+      style: 'fill',
+      borderStyle: 'solid',
+      borderSize: 1,
+      borderDashedValue: [2, 2],
+      upColor: alphaGreen,
+      downColor: alphaRed,
+      noChangeColor: '#888888'
+    }]
+  }
+})
+
+registerStyles('red_rise_green_fall', {
+  candle: {
+    bar: {
+      upColor: red,
+      downColor: green,
+      upBorderColor: red,
+      downBorderColor: green,
+      upWickColor: red,
+      downWickColor: green,
+    },
+    priceMark: {
+      last: {
+        upColor: red,
+        downColor: green,
+      }
+    }
+  },
+  indicator: {
+    ohlc: {
+      upColor: alphaRed,
+      downColor: alphaGreen
+    },
+    bars: [{
+      style: 'fill',
+      borderStyle: 'solid',
+      borderSize: 1,
+      borderDashedValue: [2, 2],
+      upColor: alphaRed,
+      downColor: alphaGreen,
+      noChangeColor: '#888888'
+    }],
+    circles: [{
+      style: 'fill',
+      borderStyle: 'solid',
+      borderSize: 1,
+      borderDashedValue: [2, 2],
+      upColor: alphaRed,
+      downColor: alphaGreen,
+      noChangeColor: '#888888'
+    }]
+  }
+})
+
+const chart = init('k-line-chart')
+chart.createIndicator('VOL')
+chart.applyNewData(genData())
+
+function setTheme (theme) {
+  chart.setStyles(theme)
+  if (theme === 'light') {
+    document.getElementById('k-line-chart').style.backgroundColor = '#ffffff'
+  } else if (theme === 'dark') {
+    document.getElementById('k-line-chart').style.backgroundColor = '#1b1b1f'
+  }
+}
+
+// 以下仅仅是为了协助代码演示,在实际项目中根据情况进行调整。
+// The following is only for the purpose of assisting in code demonstration, and adjustments will be made according to the actual situation in the project.
+const container = document.getElementById('container')
+const buttonContainer = document.createElement('div')
+buttonContainer.className = 'button-container'
+const items = [
+  { key: 'light', text: '浅色-Light' },
+  { key: 'dark', text: '深色-Dark' },
+  { key: 'green_rise_red_fall', text: '绿涨红跌-Green rise and red fall' },
+  { key: 'red_rise_green_fall', text: '红涨绿跌-Red rise and green fall' }
+]
+items.forEach(({ key, text }) => {
+  const button = document.createElement('button')
+  button.innerText = text
+  button.addEventListener('click', () => { setTheme(key) })
+  buttonContainer.appendChild(button)
+})
+container.appendChild(buttonContainer)
html
<div id="container">
+  <div id="k-line-chart" style="height:430px">
+</div>
css
.button-container {
+  display: flex;
+  flex-wrap: wrap;
+  align-items: center;
+  gap: 8px;
+  margin-top: 10px;
+  padding: 10px 22px;
+}
+
+.button-container button {
+  padding: 2px 6px;
+  background-color: #1677FF;
+  border-radius: 4px;
+  font-size: 12px;
+  color: #fff;
+  outline: none;
+  border: none;
+}
+ + + + \ No newline at end of file diff --git a/en-US/sample/timezone.html b/en-US/sample/timezone.html new file mode 100644 index 0000000..3f5fcba --- /dev/null +++ b/en-US/sample/timezone.html @@ -0,0 +1,96 @@ + + + + + + Timezone | KLineChart + + + + + + + + + + + + + + + + +
Skip to content

Timezone

Open in a new window
js
import { init } from 'klinecharts'
+import './index.css'
+
+function genData (timestamp = new Date().getTime(), length = 800) {
+  let basePrice = 5000
+  timestamp = Math.floor(timestamp / 1000 / 60) * 60 * 1000 - length * 60 * 1000
+  const dataList = []
+  for (let i = 0; i < length; i++) {
+    const prices = []
+    for (let j = 0; j < 4; j++) {
+      prices.push(basePrice + Math.random() * 60 - 30)
+    }
+    prices.sort()
+    const open = +(prices[Math.round(Math.random() * 3)].toFixed(2))
+    const high = +(prices[3].toFixed(2))
+    const low = +(prices[0].toFixed(2))
+    const close = +(prices[Math.round(Math.random() * 3)].toFixed(2))
+    const volume = Math.round(Math.random() * 100) + 10
+    const turnover = (open + high + low + close) / 4 * volume
+    dataList.push({ timestamp, open, high,low, close, volume, turnover })
+
+    basePrice = close
+    timestamp += 60 * 1000
+  }
+  return dataList
+}
+
+const chart = init('k-line-chart')
+chart.applyNewData(genData())
+
+function setTimezone (timezone) {
+  chart.setTimezone(timezone)
+}
+
+// 以下仅仅是为了协助代码演示,在实际项目中根据情况进行调整。
+// The following is only for the purpose of assisting in code demonstration, and adjustments will be made according to the actual situation in the project.
+const container = document.getElementById('container')
+const buttonContainer = document.createElement('div')
+buttonContainer.className = 'button-container'
+const items = [
+  { key: 'Asia/Shanghai', text: '上海-Shanghai' },
+  { key: 'Europe/Berlin', text: '柏林-Berlin' },
+  { key: 'America/Chicago', text: '芝加哥-Chicago' }
+]
+items.forEach(({ key, text }) => {
+  const button = document.createElement('button')
+  button.innerText = text
+  button.addEventListener('click', () => { setTimezone(key) })
+  buttonContainer.appendChild(button)
+})
+container.appendChild(buttonContainer)
html
<div id="container">
+  <div id="k-line-chart" style="height:430px">
+</div>
css
.button-container {
+  display: flex;
+  flex-wrap: wrap;
+  align-items: center;
+  gap: 8px;
+  margin-top: 10px;
+  padding: 10px 22px;
+}
+
+.button-container button {
+  padding: 2px 6px;
+  background-color: #1677FF;
+  border-radius: 4px;
+  font-size: 12px;
+  color: #fff;
+  outline: none;
+  border: none;
+}
+ + + + \ No newline at end of file diff --git a/en-US/sample/tooltip.html b/en-US/sample/tooltip.html new file mode 100644 index 0000000..01c4ac7 --- /dev/null +++ b/en-US/sample/tooltip.html @@ -0,0 +1,175 @@ + + + + + + Tooltip | KLineChart + + + + + + + + + + + + + + + + +
Skip to content

Tooltip

Open in a new window
js
import { init } from 'klinecharts'
+import './index.css'
+
+function genData (timestamp = new Date().getTime(), length = 800) {
+  let basePrice = 5000
+  timestamp = Math.floor(timestamp / 1000 / 60) * 60 * 1000 - length * 60 * 1000
+  const dataList = []
+  for (let i = 0; i < length; i++) {
+    const prices = []
+    for (let j = 0; j < 4; j++) {
+      prices.push(basePrice + Math.random() * 60 - 30)
+    }
+    prices.sort()
+    const open = +(prices[Math.round(Math.random() * 3)].toFixed(2))
+    const high = +(prices[3].toFixed(2))
+    const low = +(prices[0].toFixed(2))
+    const close = +(prices[Math.round(Math.random() * 3)].toFixed(2))
+    const volume = Math.round(Math.random() * 100) + 10
+    const turnover = (open + high + low + close) / 4 * volume
+    dataList.push({ timestamp, open, high,low, close, volume, turnover })
+
+    basePrice = close
+    timestamp += 60 * 1000
+  }
+  return dataList
+}
+
+const chart = init('k-line-chart')
+chart.createIndicator('MA', false, { id: 'candle_pane' })
+chart.createIndicator('VOL')
+chart.applyNewData(genData())
+
+function setCandleTooltipShowRule (showRule) {
+  chart.setStyles({
+    candle: {
+      tooltip: {
+        showRule
+      }
+    }
+  })
+}
+
+function setCandleTooltipShowType (showType) {
+  chart.setStyles({
+    candle: {
+      tooltip: {
+        showType
+      }
+    }
+  })
+}
+
+function setIndicatorTooltipShowRule (showRule) {
+  chart.setStyles({
+    indicator: {
+      tooltip: {
+        showRule
+      }
+    }
+  })
+}
+
+function setIndicatorTooltipShowType (showType) {
+  chart.setStyles({
+    indicator: {
+      tooltip: {
+        showType
+      }
+    }
+  })
+}
+
+// 以下仅仅是为了协助代码演示,在实际项目中根据情况进行调整。
+// The following is only for the purpose of assisting in code demonstration, and adjustments will be made according to the actual situation in the project.
+const container = document.getElementById('container')
+const rules = [
+  { key: 'always', text: '总是显示-Always display' },
+  { key: 'follow_cross', text: '跟随十字光标-Follow cross' },
+  { key: 'none', text: '不显示-Hide' }
+]
+const types = [
+  { key: 'standard', text: '默认-Standard' },
+  { key: 'rect', text: '矩形框-Rect' }
+]
+
+const baseButtonContainer = document.createElement('div')
+baseButtonContainer.className = 'button-container'
+const baseTitle = document.createElement('span')
+baseTitle.innerText = '基础信息提示-Base info tip: '
+baseButtonContainer.appendChild(baseTitle)
+
+rules.forEach(({ key, text }) => {
+  const button = document.createElement('button')
+  button.innerText = text
+  button.addEventListener('click', () => { setCandleTooltipShowRule(key) })
+  baseButtonContainer.appendChild(button)
+})
+
+types.forEach(({ key, text }) => {
+  const button = document.createElement('button')
+  button.innerText = text
+  button.addEventListener('click', () => { setCandleTooltipShowType(key) })
+  baseButtonContainer.appendChild(button)
+})
+container.appendChild(baseButtonContainer)
+
+const indicatorButtonContainer = document.createElement('div')
+indicatorButtonContainer.className = 'button-container'
+const indicatorTitle = document.createElement('span')
+indicatorTitle.innerText = '指标信息提示-Indicator info tip: '
+indicatorButtonContainer.appendChild(indicatorTitle)
+
+rules.forEach(({ key, text }) => {
+  const button = document.createElement('button')
+  button.innerText = text
+  button.addEventListener('click', () => { setIndicatorTooltipShowRule(key) })
+  indicatorButtonContainer.appendChild(button)
+})
+
+types.forEach(({ key, text }) => {
+  const button = document.createElement('button')
+  button.innerText = text
+  button.addEventListener('click', () => { setIndicatorTooltipShowType(key) })
+  indicatorButtonContainer.appendChild(button)
+})
+container.appendChild(indicatorButtonContainer)
html
<div id="container">
+  <div id="k-line-chart" style="height:430px">
+</div>
css
.button-container {
+  display: flex;
+  flex-wrap: wrap;
+  align-items: center;
+  gap: 8px;
+  margin-top: 10px;
+  padding: 10px 22px;
+}
+
+.button-container:last-child {
+  margin-top: 0;
+}
+
+.button-container button {
+  padding: 2px 6px;
+  background-color: #1677FF;
+  border-radius: 4px;
+  font-size: 12px;
+  color: #fff;
+  outline: none;
+  border: none;
+}
+ + + + \ No newline at end of file diff --git a/en-US/sponsor.html b/en-US/sponsor.html new file mode 100644 index 0000000..c3efc28 --- /dev/null +++ b/en-US/sponsor.html @@ -0,0 +1,27 @@ + + + + + + ❤️ Sponsor | KLineChart + + + + + + + + + + + + + + + + +
Skip to content

❤️ Sponsor

KLineChart under the Apache License V2 and completely free to use.

If you think the plugin is good, I hope you can click 🌟 on GitHub. If you can reward a cup of ☕️, that would be very much appreciated.

For organizations or individuals sponsoring KLineChart, no matter how much, if necessary, display the organization's official website or personal homepage on the https://klinecharts.com on the homepage, please provide payment account or address, logo, homepage link, and other information by sending an email to hu_li888@foxmail.com . Those with sponsor amount top three, will use large logo display.

Alipay

Wechat Pay

Cryptocurrency

  • BTC
bc1qnwzukszzk5xfk0zs3sr8etzgctgnrtqts43jzp3khe6gm7xazprsp4y6n3
  • ETH
0xd2c3911654db861e0a2e17415e11a209c1fc3594
  • USDT-ERC20
0xd2c3911654db861e0a2e17415e11a209c1fc3594
  • USDT-TRC20
THJpTQmFGaVm12KE1Jzc5mLXiApP6qXMCi
+ + + + \ No newline at end of file diff --git a/guide/changelog.html b/guide/changelog.html new file mode 100644 index 0000000..5a3af00 --- /dev/null +++ b/guide/changelog.html @@ -0,0 +1,26 @@ + + + + + + 📠 更新日志 | KLineChart + + + + + + + + + + + + + + + +
Skip to content

📠 更新日志

9.8.10

2024-06-06

  • 🐞 修复基础图形 rect, line 绘制模糊问题。
  • 🐞 修复实例方法 zoomAtCoordinatezoomAtDataIndexzoomAtTimestamp,缩放不准确问题。
  • 🐞 修复x轴缩放可能出错问题。
  • 💄 优化实例方法 subscribeAction,当 type 是 'onScroll' 和 'onZoom' 时,回调方法新增参数。
  • 💄 优化指标属性 figures 中的子项 attrs,新增回调参数 data

9.8.9

2024-05-28

  • 🐞 修复样式配置 yAxis.type: 'percentage' 错误。
  • 🐞 修复 typescript 中声明问题。

9.8.8

2024-05-14

  • 🐞 修复样式配置 candle.tooltip.custom 是数组时无法覆盖问题。
  • 🐞 修复小数折叠不准确问题。
  • 💄 优化覆盖物回调方法中的参数 precision

9.8.7

2024-05-10

  • 🐞 修复指标精度不同步价格数量精度问题。

9.8.6

2024-05-07

  • 🐞 修复图表API registerIndicatorregisterOverlay 参数 extendData 无法生效问题。
  • 🐞 修复千分符指定 . 时,导致小数折叠不对问题。
  • 🐞 修复创建覆盖物后,可以无法拖动问题。

9.8.5

2024-04-14

  • 💄 优化图表默认右偏移距离。
  • 🐞 修复面积图显示问题。
  • 🐞 修复图表偶发会空白问题。

9.8.3

2024-04-12

  • 💄 优化样式,candle.tooltipindicator.tooltip 新增 offsetLeftoffsetTopoffsetRightoffsetBottom
  • 💄 优化基础图形,图形属性支持数组。
  • 💄 优化y轴渲染。
  • 💄 优化默认显示,蜡烛柱默认宽度改为8。
  • 🐞 修复 applyMoreData 添加重复数据问题。@cryptotooltop

9.8.2

2024-03-26

  • 💄 优化面积图显示。
  • 💄 优化平滑曲线绘制。
  • 🐞 修复覆盖物绘制到未来时间,可能不对问题。

9.8.1

2024-03-13

  • 🐞 修复初始化layout只指定xAxis时,导致图表无法初始化问题。
  • 🐞 修复内置指标VOL修改calcParams时出错问题。
  • 💄 优化y轴小数折叠显示时计算的宽度准确度。
  • 💄 优化滚轮事件触发。

9.8.0

2024-03-04

  • 🆕 支持自定义坐标轴。
  • 🆕 支持指标绘制到未来时间。
  • 🆕 支持长小数折叠。
  • 🆕 支持向前和向后添加数据。
  • 🐞 修复不同浏览器格式化时间问题。

9.7.2

2024-01-12

  • 🐞 修复指标属性 minValuemaxValue 不生效问题。
  • 🐞 修复覆盖物x轴上显示问题。
  • 💄 优化样式 candle.type: 'ohlc' 显示。
  • 💄 优化绘制清晰度。

9.7.1

2023-12-18

  • 🐞 修复指标和覆盖物方法不执行问题。
  • 🐞 修复包管理器下载node版本依赖问题。

9.7.0

2023-12-12

  • 🆕 实例方法新增setMaxOffsetLeftDistancesetMaxOffsetRightDistance
  • 🆕 指标新增zLevel属性。
  • 💄 优化ohlc蜡烛柱渲染。
  • 🐞 修复蜡烛柱模糊问题。
  • 🐞 修复覆盖物zLevel渲染规则。

9.6.0

2023-11-14

  • 🖋️ 重构窗口之间的分割线模块。
  • 🆕 图表方法init(ds, options),参数options新增layout
  • 🆕 实例方法createIndicator(value, isStack, paneOptions, callback),参数paneOptions新增position
  • 🆕 样式candle.tooltip.custom新增turnover字符串模版。
  • 💄 优化样式overlay.text配置。
  • 💄 优化utils.cloneutils.merge实现。
  • 🐞 修复多个覆盖物样式显示不对问题。
  • 🐞 修复多个指标样式显示不对问题。

9.5.4

2023-09-22

  • 🐞 修复样式candle.typearea时,最新价线不显示问题。
  • 🐞 修复样式crosshair.vertical.text.paddingLeft显示不对问题。

9.5.3

2023-09-19

  • 🐞 修复ts下引入问题。

9.5.2

2023-09-18

  • 💄 优化基础图形text
  • 💄 优化内置覆盖物simpleAnnotationsimpleTag
  • 💄 优化技术指标自由样式,支持增量。
  • 🐞 修复typescript声明问题。

9.5.1

2023-08-14

  • 🆕 图表方法新增getOverlayClass
  • 🆕 样式配置candle.tooltip.custom新增内置涨跌幅支持。
  • 💄 优化基础图形rect事件响应。
  • ↩️ 分割线事件响应回退

9.5.0

2023-06-15

  • 🆕 Overlay新增事件onDoubleClick,新增属性modeSensitivity
  • 🆕 样式配置candle.tooltip.custom支持字符串模版。
  • 🐞 优化移动端阻尼滚动掉帧问题。
  • 🐞 修复窗口id命名拼写错误。
  • 💄 优化分割线事件响应灵敏度。
  • 💄 优化typescript下,OverlayFigure中的attrs类型声明。

9.4.0

2023-05-25

  • 🆕 实例api createOverlay 支持数组。
  • 🆕 overlay新增属性paneIddefaultZLevelzLevel
  • 🆕 xAxis新增方法convertTimestampFromPixelconvertTimestampToPixel
  • 💄 优化蜡烛柱显示。

9.3.0

2023-05-13

  • 🆕 新增图表API utils.calcTextWidth
  • 🆕 图表API createIndicator(value, isStack, options)setPaneOptions(options)新增options.axisOptions
  • 🆕 指标图形配置支持自定义。
  • 💄 优化bar宽度比例。
  • 💄 优化内部获取屏幕像素比。
  • 💄 优化内部id生成。

9.2.2

2023-05-04

  • 🐞 修复基础图形line事件检查可能导致错误问题。
  • 💄 优化类型检查。

9.2.1

2023-04-27

  • 💄 优化默认样式,#EF5350变更为#F92855#26A69A变更为#2DC08E
  • 💄 优化typescript声明。

9.2.0

2023-04-24

  • 🆕 实例API新增getOffsetRightDistanceexecuteAction
  • 🆕 实例APIapplyNewDataapplyMoreDataupdateData新增成功回调入参callback
  • 🆕 支持千分符显示。
  • 🆕 样式配置新增candle.bar.upBorderColorcandle.bar.downBorderColorcandle.bar.noChangeBorderColorcandle.bar.upWickColorcandle.bar.downWickColorcandle.bar.noChangeWickColorcandle.tooltip.rect.positioncandle.tooltip.rect.offsetBottom
  • 🆕 所有visibleRange新增realFromrealTo
  • 💄 优化API,klinecharts.utils.isValidklinecharts.utils.formatBigNumber
  • 💄 优化开发环境下,日志输出。

9.1.3

2023-04-15

  • 🐞 修复图表api applyNewData 入参是空数组时不刷新问题。
  • 🐞 修复无数据时y轴上十字光标文字不显示问题。
  • 💄 优化面积图显示。
  • 💄 优化覆盖物事件回调参数,新增figureKeyfigureIndex
  • 💄 优化typescript覆盖物样式类型,和基础类型DeepPartial, DeepRequired

9.1.2

2023-04-10

  • 🐞 修复内置基础图形line触发事件不准确问题。
  • 🐞 修复内置覆盖物simpleAnnotationsimpleTag绘制完成后第一次触发事件问题。
  • 💄 优化覆盖物图形事件忽略,支持事件选择。

9.1.1

2023-03-14

  • 🐞 修复内置基础图形arc不生效问题。
  • 💄 优化渲染更新。

9.1.0

2023-02-23

  • 🆕 图表实例方法subscribeActionunsubscribeAction类型新增onCandleBarClick
  • 🆕 覆盖物支持双击强制结束绘制。
  • 💄 优化事件处理。

9.0.1

2023-02-17

  • 🐞 修复typescript引入问题。

9.0.0

2023-02-16

  • 🛠 Typescript重构。
  • 🆕 新特性
    • 新增Y轴方向缩放,滚动。
    • API
      • 新增基图表方法registerFiguregetSupportFiguresgetFigureClassrigisterOverlaygetSupportOverlaysregisterLocalegetSupportLocalesregisterStyles
      • 新增实例方法,getSizesetLocalegetLocalsetCustomApigetVisibleRangecreateOverlaygetOverlayByIdoverrideOverlayremoveOverlay
    • 样式配置
      • 新增candle.priceMark.last.text.borderStylecandle.tooltip.iconsindicator.lastValueMark.text.borderStyleindicator.tooltip.iconscrosshair.horizontal.text.borderStylecrosshair.vertical.text.borderStyle
  • 👉 变更
    • API
      • 图表方法extension.addTechnicalIndicatorTemplate变更为registerIndicator
      • 图表方法extension.addShapeTemplate变更为registerOverlay
      • 实例方法setStyleOptions变更为setStyles
      • 实例方法getStyleOptions变更为getStyles
      • 实例方法setPaneOptions(options)options新增属性gap
      • 实例方法setOffsetRightSpace变更为setOffsetRightDistance
      • 实例方法createTechnicalIndicator变更为createIndicator
      • 实例方法overlayTechnicalIndicator变更为overlayIndicator
      • 实例方法getTechnicalIndicatorByPaneId变更为getIndicatorByPaneId
      • 实例方法removeTechnicalIndicator变更为removeIndicator
    • 样式配置
      • 所有line.style选项变更为soliddashed
      • 所有dashValue变更为dashedValue
      • xAxis.height变更为xAxis.sizexAxis.tickText.paddingTop变更为xAxis.tickText.marginStartxAxis.tickText.paddingBottom变更为xAxis.tickText.marginEnd
      • yAxis.height变更为yAxis.sizeyAxis.tickText.paddingTop变更为yAxis.tickText.marginStartyAxis.tickText.paddingBottom变更为yAxis.tickText.marginEnd
      • technicalIndicator.bar变更为indicator.barstechnicalIndicator.line变更为indicator.linestechnicalIndicator.circle变更为indicator.circles
    • 自定义扩展
      • 技术指标属性calcParams,变更为支持任意类型。
      • 技术指标属性plots变更为figures
      • 技术指标属性regeneratePlots变更为regeneratefigures
      • 技术指标属性calcTechnicalIndicator变更为calc
      • 技术指标属性render变更为draw
  • 🗑 废弃
    • API
      • 删除实例方法getWidthgetHeight,改用getSize
      • 删除实例方法createShapecreateAnnotationcreateTag,改用createOverlay
      • 删除实例方法removeShaperemoveAnnotationremoveTag,改用removeOverlay
      • 删除实例方法setShapeOptions,改用overrideOverlay
      • 删除实例方法createHtmlremoveHtmladdTechnicalIndicatorTemplategetTechnicalIndicatorTemplateaddShapeTemplate
    • 样式配置
      • 删除shapeannotationtag,改用overlay
      • 删除candle.margintechnicalIndicator.margin
    • 自定义扩展
      • 技术指标模版不再保存相关属性。
      • 技术指标删除属性shouldCheckParamCount
      • 删除Shape,改用Overlay

8.x

Github上查看 8.x 的 Change Log。

7.x

Github上查看 7.x 的 Change Log。

6.x

Github上查看 6.x 的 Change Log。

5.x

Github上查看 5.x 的版本记录。

4.x

Github上查看 4.x 的版本记录。

+ + + + \ No newline at end of file diff --git a/guide/chart-api.html b/guide/chart-api.html new file mode 100644 index 0000000..965966b --- /dev/null +++ b/guide/chart-api.html @@ -0,0 +1,440 @@ + + + + + + 图表API | KLineChart + + + + + + + + + + + + + + + +
Skip to content

图表API

init(ds, options)

typescript
(
+  ds: string | HTMLElement,
+  options?: {
+    layout?: Array<{
+      type: 'candle' | 'indicator' | 'xAxis'
+      content: Array<Indicator | string>
+      options: {
+        id?: string
+        height?: number
+        minHeight?: number
+        dragEnabled?: boolean
+        position?: 'top' | 'bottom'
+        gap?: {
+          top?: number
+          bottom?: number
+        }
+        axisOptions?: {
+          name?: string
+          scrollZoomEnabled?: boolean
+        }
+      }
+    }>
+    locale?: string
+    styles?: string | object
+    timezone?: string
+    customApi?: {
+      formatDate?: (dateTimeFormat: Intl.DateTimeFormat, timestamp: number, format: string, type: number) => string
+      formatBigNumber?: (value: string | number) => string
+    }
+    thousandsSeparator?: string
+    decimalFoldThreshold?: number
+  }
+) => Chart

初始化一个图表,返回图表实例。

  • ds 容器,可以是dom元素或者元素id。
  • options 可选配置项。
    • layout 自定义布局,content中的内容和options参考实例方法 createIndicator 中的入参valueoptions^9.6.0
    • locale 语言,内置支持zh-CNen-US
    • timezone 时区名,如'Asia/Shanghai',如果不设置会自动获取本机时区,时区对应名字列表请参阅时区列表
    • styles 可以是通过klinecharts.registerStyles注册的样式名,也可以是object,样式列表,详情参阅样式,支持增量。
    • customApi 自定义一些api。
      • formatDate 格式化日期。
      • formatBigNumber 格式化大的数字,如1000转换成1k,1000000转换为1M等。
    • thousandsSeparator 千分符
    • decimalFoldThreshold 小数折叠阈值 ^9.8.0

dispose(dcs)

typescript
(dcs: HTMLElement | Chart | string) => void

销毁一个图表,一旦销毁,图表将不再可用。

  • dcs 可以是dom元素、元素id或者图表实例。

registerLocale(locale, locales)

typescript
(
+  locale: string,
+  locales: {
+    time: string
+    open: string
+    high: string
+    low: string
+    close: string
+    volume: string
+  }
+) => void

添加一个本地化语言。图表内置了zh-CNen-US

  • locale 语言名
  • locales 语言配置

getOverlayClass()

typescript
(name: string) => Nullable<OverlayConstructor>

根据覆盖物名称获取图表内覆盖物的属性。

getSupportedLocales()

typescript
() => string[]

获取图表支持的本地化语言类型。

registerStyles(name, styles)

typescript
(
+  name: string,
+  styles: object
+) => void

添加一个样式配置。

  • name 样式名
  • styles 样式配置,类型参阅样式,支持增量。

registerFigure(figure)

typescript
(
+  figure: {
+    name: string
+    draw: (ctx: CanvasRenderingContext2D, attrs: any, styles: object) => void
+    checkEventOn: (coordinate: Coordinate, attrs: any, styles: object) => boolean
+  }
+) => void

添加一个基础图形。

  • figure 基础图形信息,详情参阅基础图形
    • name 名字,唯一标识
    • draw 绘制方法
    • checkEventOn 检查事件是否在图形上

getSupportedFigures()

typescript
() => string[]

获取图表支持的基础图形类型。

getFigureClass(name)

typescript
(name: string) => Figure

获取图形类

  • name 图形名

registerIndicator(indicator)

typescript
(
+  indicator: {
+    name: string
+    shortName?: string
+    precision?: number
+    calcParams?: any[]
+    shouldOhlc?: boolean
+    shouldFormatBigNumber?: boolean
+    visible?: boolean
+    extendData?: any
+    series?: 'normal' | 'price' | 'volume'
+    figures?: Array<{
+      key: string
+      title?: string
+      type?: string
+      baseValue?: number
+      attrs?: ({
+        data: object
+        coordinate: object
+        bounding: object
+        barSpace: object
+        xAxis: object
+        yAxis: object
+      }) => object
+      styles?: (
+        data: object,
+        indicator: object,
+        defaultStyles: object
+      ) => object
+    }>
+    minValue?: number
+    maxValue?: number
+    styles?: object
+    calc: (dataList: KLineData[], indicator: object) => Promise<object[]> | object[]
+    regenerateFigures?: (calcParms: any[]) => Array<{
+      key: string
+      title?: string
+      type?: string
+      baseValue?: number
+      styles?: (
+        data: object,
+        indicator: object,
+        defaultStyles: object
+      ) => object
+      attrs: (
+        coordinate: object
+        bounding: Bounding
+        barSpace: BarSpace
+        xAxis: XAxis
+        yAxis: YAxis
+      ) => object
+    }>
+    createTooltipDataSource?: (params: object) => {
+      name?: string
+      calcParamsText?: string
+      values?: Array<{
+        title: string | {
+          text: string
+          color: string
+        }
+        value: string | {
+          text: string
+          color: string
+        }
+      }>
+    }
+    draw?: (params: object) => boolean
+  }
+) => void

添加一个技术指标。

  • indicator 技术指标信息
    • name 指标名,用于创建和操作的唯一标识
    • shortName 简短名字,用于显示
    • precision 精度
    • calcParams 计算参数
    • shouldOhlc 是否需要ohlc辅助图形
    • shouldFormatBigNumber 是否需要格式化大的数字。如1000转换成1k,1000000转换为1M等
    • visible 是否可见
    • extendData 扩展数据
    • series 指标系列,可选项有'normal','price'和'volume'
    • figures 图形配置
    • minValue 指定最小值
    • maxValue 指定最大值
    • styles 样式
    • calc 计算方法
    • regenerateFigures 重新生成图形信息方法
    • createTooltipDataSource 创建自定义提示信息方法
    • draw 自定义绘制方法

getSupportedIndicators()

typescript
() => string[]

获取图表支持的技术指标

registerOverlay(overlay)

typescript
(
+  overlay: {
+    name: string
+    totalStep?: number
+    lock?: boolean
+    visible?: boolean
+    zLevel?: number
+    needDefaultPointFigure?: boolean
+    needDefaultXAxisFigure?: boolean
+    needDefaultYAxisFigure?: boolean
+    mode?: 'normal' | 'weak_magnet' | 'strong_magnet'
+    modeSensitivity?: number
+    points?: Array<{ timestamp: number, dataIndex?: number, value?: number }>
+    extendData?: any
+    styles?: object
+    createPointFigures?: (params: object) => {
+      key?: string
+      type: string
+      attrs: any | any[]
+      styles?: any
+      ignoreEvent?: boolean | OverlayFigureIgnoreEventType[]
+    } | Array<{
+      key?: string
+      type: string
+      attrs: any | any[]
+      styles?: any
+      ignoreEvent?: boolean | OverlayFigureIgnoreEventType[]
+    }>
+    createXAxisFigures?: (params: object) => {
+      key?: string
+      type: string
+      attrs: any | any[]
+      styles?: any
+      ignoreEvent?: boolean | OverlayFigureIgnoreEventType[]
+    } | Array<{
+      key?: string
+      type: string
+      attrs: any | any[]
+      styles?: any
+      ignoreEvent?: boolean | OverlayFigureIgnoreEventType[]
+    }>
+    createYAxisFigures?: (params: object) => {
+      key?: string
+      type: string
+      attrs: any | any[]
+      styles?: any
+      ignoreEvent?: boolean | OverlayFigureIgnoreEventType[]
+    } | Array<{
+      key?: string
+      type: string
+      attrs: any | any[]
+      styles?: any
+      ignoreEvent?: boolean | OverlayFigureIgnoreEventType[]
+    }>
+    performEventPressedMove?: (params: object) => void
+    performEventMoveForDrawing?: (params: object) => void
+    onDrawStart?: (event: object) => boolean
+    onDrawing?: (event: object) => boolean
+    onDrawEnd?: (event: object) => boolean
+    onClick?: (event: object) => boolean
+    onDoubleClick?: (event: object) => boolean
+    onRightClick?: (event: object) => boolean
+    onPressedMoveStart?: (event: object) => boolean
+    onPressedMoving?: (event: object) => boolean
+    onPressedMoveEnd?: (event: object) => boolean
+    onMouseEnter?: (event: object) => boolean
+    onMouseLeave?: (event: object) => boolean
+    onRemoved?: (event: object) => boolean
+    onSelected?: (event: object) => boolean
+    onDeselected?: (event: object) => boolean
+  }
+) => void

添加一个覆盖物。

  • overlay 覆盖物信息,详情参阅覆盖物
    • name 覆盖物名,用于创建的唯一标识
    • totalStep 总的实现步骤
    • lock 是否锁定不让拖动
    • visible 是否可见
    • zLevel 绘制层级,值越大,越靠前显示
    • needDefaultPointFigure 是否需要默认的点对应的图形
    • needDefaultXAxisFigure 是否需要默认的x轴上的图形
    • needDefaultYAxisFigure 是否需要默认的y轴上的图形
    • mode 模式,可选项有'normal','weak_magnet'和'strong_magnet'
    • modeSensitivity 模式灵敏度,仅 mode 是 weak_magnet 时有效 ^9.5.0
    • points 点信息
    • extendData 扩展数据
    • styles 样式
    • createPointFigures 创建点对应的图形
    • createXAxisFigures 创建x轴上的图形
    • createYAxisFigures 创建y轴上的图形
    • performEventPressedMove 按住移动事件特殊处理方法
    • performEventMoveForDrawing 移动事件过程中特殊处理方法
    • onDrawStart 开始绘制事件
    • onDrawing 绘制中事件
    • onDrawEnd 绘制结束事件
    • onClick 点击事件
    • onDoubleClick 双击事件 ^9.5.0
    • onRightClick 右击事件
    • onPressedMoveStart 按住开始移动事件
    • onPressedMoving 按住移动中事件
    • onPressedMoveEnd 按住移动结束事件
    • onMouseEnter 鼠标移入事件
    • onMouseLeave 鼠标移出事件
    • onRemoved 删除事件
    • onSelected 选中事件
    • onDeselected 取消选中事件

getSupportedOverlays()

typescript
() => string[]

获取图表支持的覆盖物

registerXAxis(axis) ^9.8.0

typescript
(
+  axis: {
+    name: string
+    createTicks: (params: object) => Array<{
+      coord: number
+      value: number | string
+      text: string
+    }>
+  }
+) => void

添加一个自定义x轴。

  • axis 坐标信息
    • name 坐标轴名字
    • createTicks 创建分割文字

registerYAxis(axis) ^9.8.0

typescript
(
+  axis: {
+    name: string
+    createTicks: (params: object) => Array<{
+      coord: number
+      value: number | string
+      text: string
+    }>
+  }
+) => void

添加一个自定义y轴。

  • axis 坐标信息
    • name 坐标轴名字
    • createTicks 创建分割文字

version()

typescript
() => string

获取图表当前版本号。

utils

辅助方法集合。

utils.clone(target)

typescript
(target: any) => any

深度复制。

utils.merge(target, source)

typescript
(target: object, source: object) => void

将一个对象合并到另一个对象。

utils.isString(value)

typescript
(value: any) => boolean

检查某个值是否是字符串。

utils.isNumber(value)

typescript
(value: any) => boolean

检查某个值是否是数字。

utils.isValid(value)

typescript
(value: any) => boolean

检查某个值是否有效。

utils.isObject(value)

typescript
(value: any) => boolean

检查某个值是否是对象。

utils.isFunction(value)

typescript
(value: any) => boolean

检查某个值是否是方法。

utils.isBoolean(value)

typescript
(value: any) => boolean

检查某个值是否是bool值。

utils.formatValue(value, key, defaultValue)

typescript
(data: any, key: string, defaultValue?: any) => any

从某个值取对应的值,支持嵌套,如const o = { a: { b: { c: 1 } } }formatValue(o, 'a.b.c')c的值。

utils.formatPrecision(value)

typescript
(value: string | number, precision?: number) => string

格式化精度。

utils.formatBigNumber(value)

typescript
(value: string | number) => string

格式化大的数字,如1000转换成1k,1000000转换为1M等。

utils.formatDate(dateTimeFormat, timestamp, format)

typescript
(dateTimeFormat: Intl.DateTimeFormat, timestamp: number, format: string) => string

格式化日期。format格式,如'YYYY-MM-DD HH:mm:ss'。

utils.formatThousands(value, sign)

typescript
(value: string | number, sign: string) => string

格式化日期千分符。

utils.formatFoldDecimal(value, threshold) ^9.8.0

typescript
(value: string | number, threshold: number) => string

格式化折叠小数。

utils.calcTextWidth(text, size, weight, family) ^9.3.0

typescript
(text: string, size?: number, weight?: string | number, family?: string) => number

计算文字宽度

utils.getLinearSlopeIntercept(coordinate1, coordinate2)

typescript
(
+  coordinate1: {
+    x: number
+    y: number
+  },
+  coordinate2: {
+    x: number
+    y: number
+  }
+) => []

根据两个坐标点,获取点组成的线的斜率和常数项,即y = kx + b中的kb

utils.getLinearYFromCoordinates(coordinate1, coordinate2, targetCoordinate)

typescript
(
+  coordinate1: {
+    x: number
+    y: number
+  },
+  coordinate2: {
+    x: number
+    y: number
+  }
+  targetCoordinate: {
+    x: number
+    y: number
+  }
+) => number

获取一个点在另外两个坐标点形成的线上的y轴坐标值。

utils.getLinearYFromSlopeIntercept(kb, targetCoordinate)

typescript
(
+  kb: Array<number>,
+  targetCoordinate: {
+    x: number
+    y: number
+  }
+) => number

获取一个点在斜率和常数项形成的线上的y轴坐标值。

utils.checkCoordinateOnArc(coordinate, arc)

typescript
(
+  coordinate: {
+    x: number
+    y: number
+  },
+  arc: {
+    x: number
+    y: number
+    r: number
+    startAngle: number
+    endAngle: number
+  }
+) => boolean

检查某个坐标点是否在圆弧上。

  • coordinate 坐标点信息
  • arc 圆弧参数
    • x 圆心的x轴值
    • y 圆心的y轴值
    • r 半径
    • startAngle 起始角度
    • endAngle 结束角度

utils.checkCoordinateOnCircle(coordinate, circle)

typescript
(
+  coordinate: {
+    x: number
+    y: number
+  },
+  circle: {
+    x: number
+    y: number
+    r: number
+  }
+) => boolean

检查某个坐标点是否在圆上。

  • coordinate 坐标点信息
  • circle 圆参数
    • x 圆心的x轴值
    • y 圆心的y轴值
    • r 半径

utils.checkCoordinateOnLine(coordinate, line)

typescript
(
+  coordinate: {
+    x: number
+    y: number
+  },
+  line: {
+    coordinates: Array<{
+      x: number
+      y: number
+    }>
+  }
+) => boolean

检查某个坐标点是否在线上。

utils.checkCoordinateOnPolygon(coordinate, polygon)

typescript
(
+  coordinate: {
+    x: number
+    y: number
+  },
+  polygon: {
+    coordinates: Array<{
+      x: number
+      y: number
+    }>
+  }
+) => boolean

检查某个坐标点是否在多边形上。

utils.checkCoordinateOnRect(coordinate, rect)

typescript
(
+  coordinate: {
+    x: number
+    y: number
+  },
+  rect: {
+    x: number
+    y: number
+    width: number
+    height: number
+  }
+) => boolean

检查某个坐标点是否在矩形上。

  • coordinate 坐标点信息
  • rect 矩形参数
    • x 起始点x轴值
    • y 起始点y轴值
    • width 宽度
    • height 高度

utils.checkCoordinateOnText(coordinate, text, styles)

typescript
(
+  coordinate: {
+    x: number
+    y: number
+  },
+  text: {
+    x: number
+    y: number
+    text: any
+    align?: 'center' | 'end' | 'left' | 'right' | 'start'
+    baseline?: 'alphabetic' | 'bottom' | 'hanging' | 'ideographic' | 'middle' | 'top'
+  },
+  styles: {
+    color?: string
+    size?: number
+    family?: string
+    weight?: number | string
+  }
+) => boolean

检查某个坐标点是否在文字上。

  • coordinate 坐标点信息
  • text 文字参数
    • x 起始点x轴值
    • y 起始点y轴值
    • text 文字内容
    • align 水平对齐方式
    • baseline 垂直对齐方式
  • styles 样式
    • color 颜色
    • size 尺寸
    • family 字体
    • weight 权重

utils.drawArc(ctx, arc, styles)

typescript
(
+  ctx: CanvasRenderingContext2D,
+  arc: {
+    x: number
+    y: number
+    r: number
+    startAngle: number
+    endAngle: number
+  },
+  styles: {
+    style?: 'solid' | 'dashed'
+    size?: number
+    color?: string
+    dashedValue?: number[]
+  }
+) => void

绘制圆弧。

  • ctx 画布上下文
  • arc 圆弧参数
    • x 圆心的x轴值
    • y 圆心的y轴值
    • r 半径
    • startAngle 起始角度
    • endAngle 结束角度
  • styles 样式
    • style 弧样式
    • size 粗细
    • color 颜色
    • dashedValue 虚线参数值

utils.drawCircle(ctx, circle, styles)

typescript
(
+  ctx: CanvasRenderingContext2D,
+  circle: {
+    x: number
+    y: number
+    r: number
+  },
+  styles: {
+    style?: 'stroke' | 'fill' | 'stroke_fill'
+    color?: string | CanvasGradient
+    borderColor?: string
+    borderSize?: number
+    borderStyle?: 'solid' | 'dashed'
+    borderDashedValue?: Array<number>
+  }
+) => void

绘制圆。

  • ctx 画布上下文
  • circle 圆参数
    • x 圆心的x轴值
    • y 圆心的y轴值
    • r 半径
  • styles 样式
    • style 样式
    • color 颜色
    • borderColor 边框颜色
    • borderSize 边框粗细
    • borderStyle 边框样式
    • borderDashedValue 边框虚线参数值

utils.drawLine(ctx, line, styles)

typescript
(
+  ctx: CanvasRenderingContext2D,
+  line: {
+    coordinates: Array<{
+      x: number
+      y: number
+    }>
+  },
+  styles: {
+    style?: 'solid' | 'dashed'
+    size?: number
+    color?: string
+    dashedValue?: number[]
+  }
+) => void

绘制线。

  • ctx 画布上下文
  • line 线参数
  • styles 样式
    • style 线样式
    • size 粗细
    • color 颜色
    • dashedValue 虚线参数值

utils.drawPolygon(ctx, polygon, styles)

typescript
(
+  ctx: CanvasRenderingContext2D,
+  polygon: {
+    coordinates: Array<{
+      x: number
+      y: number
+    }>
+  },
+  styles: {
+    style?: 'stroke' | 'fill' | 'stroke_fill'
+    color?: string | CanvasGradient
+    borderColor?: string
+    borderSize?: number
+    borderStyle?: 'solid' | 'dashed'
+    borderDashedValue?: Array<number>
+  }
+) => void

绘制多边形。

  • ctx 画布上下文
  • polygon 多边形参数
  • styles 样式
    • style 样式
    • color 颜色
    • borderColor 边框颜色
    • borderSize 边框粗细
    • borderStyle 边框样式
    • borderDashedValue 边框虚线参数值

utils.drawRect(ctx, rect, styles)

typescript
(
+  ctx: CanvasRenderingContext2D,
+  rect: {
+    x: number
+    y: number
+    width: number
+    height: number
+  },
+  styles: {
+    style?: 'stroke' | 'fill' | 'stroke_fill'
+    color?: string | CanvasGradient
+    borderColor?: string
+    borderSize?: number
+    borderStyle?: 'solid' | 'dashed'
+    borderDashedValue?: Array<number>
+    borderRadius?: number
+  }
+) => void

绘制矩形。

  • ctx 画布上下文
  • rect 矩形参数
    • x 起始点x轴值
    • y 起始点y轴值
    • width 宽度
    • height 高度
  • styles 样式
    • style 样式
    • color 颜色
    • borderColor 边框颜色
    • borderSize 边框粗细
    • borderStyle 边框样式
    • borderDashedValue 边框虚线参数值
    • borderRadius 边框圆角值

utils.drawText(ctx, text, styles)

typescript
(
+  ctx: CanvasRenderingContext2D,
+  text: {
+    x: number
+    y: number
+    text: any
+    width?: number
+    height?: number
+    align?: 'center' | 'end' | 'left' | 'right' | 'start'
+    baseline?: 'alphabetic' | 'bottom' | 'hanging' | 'ideographic' | 'middle' | 'top'
+  },
+  styles: {
+    style?: 'stroke' | 'fill' | 'stroke_fill'
+    color?: string
+    size?: number
+    family?: string
+    weight?: number | string
+    paddingLeft?: number
+    paddingTop?: number
+    paddingRight?: number
+    paddingBottom?: number
+    borderStyle?: 'solid' | 'dashed'
+    borderDashedValue?: number[]
+    borderSize?: number
+    borderColor?: string
+    borderRadius?: number
+    backgroundColor?: string
+  }
+) => void

绘制带背景的文字。

  • ctx 画布上下文
  • attrs 文字参数
    • x 起始点x轴值
    • y 起始点y轴值
    • text 文字内容
    • width 宽度
    • height 高度
    • align 水平对齐方式
    • baseline 垂直对齐方式
  • styles 样式
    • style 样式
    • color 颜色
    • size 尺寸
    • family 字体
    • weight 权重
    • paddingLeft 左内边距,
    • paddingTop 上内边距,
    • paddingRight 右内边距,
    • paddingBottom 下内边距,
    • borderColor 边框颜色
    • borderSize 边框粗细
    • borderStyle 边框样式
    • borderRadius 边框圆角尺寸
    • borderDashedValue 边框虚线参数值
    • backgroundColor 背景色

utils.drawRectText(ctx, rectText, styles)

utils.drawText(ctx, text, styles),已废弃,v10之后会删除,请用utils.drawText(ctx, text, styles)代替。

+ + + + \ No newline at end of file diff --git a/guide/custom-axis.html b/guide/custom-axis.html new file mode 100644 index 0000000..b279c38 --- /dev/null +++ b/guide/custom-axis.html @@ -0,0 +1,119 @@ + + + + + + 自定义坐标轴 ^9.8.0 | KLineChart + + + + + + + + + + + + + + + +
Skip to content

自定义坐标轴 ^9.8.0

图表支持自定义坐标轴,可以通过图表方法 registerXAxis(axis)registerYAxis(axis) 来实现。

入参说明

typescript
{
+  // 坐标轴名字
+  name: string
+  // 创建分割文字方法实现
+  createTicks: (params: {
+    // 区间相关的信息
+    range: {
+      // 起点
+      from: number
+      // 终点
+      to: number
+      // 区间长度
+      range: number
+      // 真实起点
+      realFrom: number
+      // 真实终点
+      realTo: number
+      // 真实区间长度
+      realRange: number
+    }
+    // 窗口尺寸信息
+    bounding: {
+      // 宽
+      width: number
+      // 高
+      height: number
+      // 距离左边距离
+      left: number
+      // 距离右边距离
+      right: number
+      // 距离顶部距离
+      top: number
+      // 距离底部距离
+      bottom: number
+    }
+    // 默认生成的分割文字信息
+    defaultTicks: Array<{
+      // 坐标位置
+      coord: number
+      // 值
+      value: number | string
+      // 展示的文字
+      text: string
+    }>
+  }) => Array<{
+    // 坐标位置
+    coord: number
+    // 值
+    value: number | string
+    // 展示的文字
+    text: string
+  }>
+}

使用说明

当注册完成之后,即可使用图表方法 init(ds, options) 参数 options.layout 中的子项 options.axisOptions.name 来指定坐标轴,或者使用实例方法 createIndicator(value, isStack, paneOptions, callback)setPaneOptions(paneOptions) 参数 paneOptions.axisOptions.name 来指定。

使用 init 方法

typescript
init(
+  // 这里的 domId 使用自己定义的容器id代替
+  `${domId}`,
+  {
+    layout: [
+      {
+        type: 'candle',
+        options: {
+          axisOptions: {
+            // 这里的 customYAxisName 使用自定义y轴时的 name 代替
+            name: `${customYAxisName}`
+          }
+        }
+      },
+      {
+        type: 'xAxis',
+        options: {
+          position: 'bottom',
+          axisOptions: {
+            // 这里的 customXAxisName 使用自定义x轴时的 name 代替
+            name: `${customXAxisName}`
+          }
+        }
+      }
+    ]
+  }
+)

使用 createIndicator 方法

typescript
createIndicator(
+  'MA',
+  false,
+  {
+    axisOptions: {
+      // 这里的 customYAxisName 使用自定义y轴时的 name 代替
+      name: `${customYAxisName}`
+    }
+  }
+)

使用 setPaneOptions 方法

typescript
setPaneOptions({
+  id: 'candle_pane',
+  axisOptions: {
+    // 这里的 customYAxisName 使用自定义y轴时的 name 代替
+    name: `${customYAxisName}`
+  }
+})
+ + + + \ No newline at end of file diff --git a/guide/data-source.html b/guide/data-source.html new file mode 100644 index 0000000..c86c117 --- /dev/null +++ b/guide/data-source.html @@ -0,0 +1,41 @@ + + + + + + 📚 数据 | KLineChart + + + + + + + + + + + + + + + +
Skip to content

📚 数据

图表所需要的数据必须是固定格式。通过图表实例 API applyNewData(dataList, more)applyMoreData(dataList, more)updateData(data)来和图表进行数据交互。

typescript
{
+  // 时间戳,毫秒级别,必要字段
+  timestamp: number
+  // 开盘价,必要字段
+  open: number
+  // 收盘价,必要字段
+  close: number
+  // 最高价,必要字段
+  high: number
+  // 最低价,必要字段
+  low: number
+  // 成交量,非必须字段
+  volume: number
+  // 成交额,非必须字段,如果需要展示技术指标'EMV'和'AVP',则需要为该字段填充数据。
+  turnover: number
+}
+ + + + \ No newline at end of file diff --git a/guide/environment.html b/guide/environment.html new file mode 100644 index 0000000..f06bf56 --- /dev/null +++ b/guide/environment.html @@ -0,0 +1,29 @@ + + + + + + 🏝️ 环境要求 | KLineChart + + + + + + + + + + + + + + + +
Skip to content

🏝️ 环境要求

浏览器支持

图表基于 html5 canvas 构建,需要运行在支持 canvas 的浏览器上,如果需要运行在移动端,请用 webview 加载。

兼容处理

core.js

图表内部集合使用Map,用于兼容不支持的老版浏览器。

javascript
import 'core.js';
+import { init } from 'klincharts';

Intl.js

图表依赖Intl,某些浏览器无此 API。

javascript
import 'intl';
+import 'intl/local-data/jsonp/en';
+import { init } from 'klincharts';
+ + + + \ No newline at end of file diff --git a/guide/figure.html b/guide/figure.html new file mode 100644 index 0000000..74c1e85 --- /dev/null +++ b/guide/figure.html @@ -0,0 +1,268 @@ + + + + + + 基础图形 | KLineChart + + + + + + + + + + + + + + + +
Skip to content

基础图形

基础图形是图表重要的组成部分,图表上所有的元素都是由基础图形组成,如果需要制作复杂的自定义技术指标和覆盖物,建议仔细阅读。这篇文档介绍了内置的基本图形和如何自定义一个基础图形。基础图形可以通过图表方法klinecharts.getFigureClass(name)获取。

使用示例

注意

需要在有画布上下文的情况下使用。

javascript
// 获取基础图形实例
+// name为基础图形名字,如,'arc', 'circle'等。
+const Figure = klinecharts.getFigureClass(name)
+// 实例化并绘制
+// attrs 属性
+// styles 样式
+// ctx 画布上下文
+new Figure({ attrs, styles }).draw(ctx)

内置基础图形

图表内置了这些基础图形,arccirclelinepolygonrecttextrectText

arc

typescript
new ({
+  attrs: {
+    // 圆心x轴坐标值
+    x: number
+    // 圆心y轴坐标值
+    y: number
+    // 半径
+    r: number
+    // 开始角度
+    startAngle: number
+    // 结束角度
+    endAngle: number
+  },
+  styles: {
+    // 样式,可选项`solid`,`dashed`
+    style?: 'solid' | 'dashed'
+    // 尺寸
+    size?: number
+    // 颜色
+    color?: string
+    // 虚线参数
+    dashedValue?: number[]
+  }
+}) => Figure

circle

typescript
new ({
+  attrs: {
+    // 圆心x轴坐标值
+    x: number
+    // 圆心y轴坐标值
+    y: number
+    // 半径
+    r: number
+  },
+  styles: {
+    // 样式,可选项`fill`,`stroke`,`stroke_fill`
+    style?: 'fill' | 'stroke' | 'stroke_fill'
+    // 颜色
+    color?: string
+    // 边框样式
+    borderStyle?: 'solid' | 'dashed'
+    // 边框颜色
+    borderColor?: string
+    // 边框尺寸
+    borderSize?: number
+    // 边框虚线参数
+    borderDashedValue?: number[]
+  }
+}) => Figure

line

typescript
new ({
+  attrs: {
+    // 坐标集合
+    coordinates: Array<{
+      x: number
+      y: number
+    }>
+  },
+  styles: {
+    // 样式,可选项`solid`,`dashed`
+    style?: 'solid' | 'dashed'
+    // 尺寸
+    size?: number
+    // 颜色
+    color?: string
+    // 虚线参数
+    dashedValue?: number[]
+  }
+}) => Figure

polygon

typescript
new ({
+  attrs: {
+    // 坐标集合
+    coordinates: Array<{
+      x: number
+      y: number
+    }>
+  },
+  styles: {
+    // 样式,可选项`fill`,`stroke`,`stroke_fill`
+    style?: 'fill' | 'stroke' | 'stroke_fill'
+    // 颜色
+    color?: string
+    // 边框样式
+    borderStyle?: 'solid' | 'dashed'
+    // 边框颜色
+    borderColor?: string
+    // 边框尺寸
+    borderSize?: number
+    // 边框虚线参数
+    borderDashedValue?: number[]
+  }
+}) => Figure

rect

typescript
new ({
+  attrs: {
+    // 起始点x轴坐标值
+    x: number
+    // 起始点y轴坐标值
+    y: number
+    // 宽度
+    width: number
+    // 高度
+    height: number
+  },
+  styles: {
+    // 样式,可选项`fill`,`stroke`,`stroke_fill`
+    style?: 'fill' | 'stroke' | 'stroke_fill'
+    // 颜色
+    color?: string
+    // 边框样式
+    borderStyle?: 'solid' | 'dashed',
+    // 边框颜色
+    borderColor?: string
+    // 边框尺寸
+    borderSize?: number
+    // 边框虚线参数
+    borderDashedValue?: number[]
+    // 边框圆角值
+    borderRadius?: number
+  }
+}) => Figure

text

typescript
new ({
+  attrs: {
+    // 起始点x轴坐标值
+    x: number
+    // 起始点y轴坐标值
+    y: number
+    // 文字内容
+    text: any
+    // 指定宽
+    width?: number
+    // 指定高
+    height?: number
+    // 对齐方式
+    align?: CanvasTextAlign
+    // 基准
+    baseline?: CanvasTextBaseline
+  },
+  styles: {
+    // 样式,可选项`fill`,`stroke`,`stroke_fill`
+    style?: 'fill' | 'stroke' | 'stroke_fill'
+    // 颜色
+    color?: string
+    // 尺寸
+    size?: number
+    // 字体
+    family?: string
+    // 粗细
+    weight?: string | number
+    // 左内边距
+    paddingLeft?: number
+    // 右内边距
+    paddingRight?: number
+    // 上内边距
+    paddingTop?: number
+    // 下内边距
+    paddingBottom?: number
+    // 边框样式
+    borderStyle?: 'solid' | 'dashed'
+    // 边框颜色
+    borderColor?: string
+    // 边框尺寸
+    borderSize?: number
+    // 边框虚线参数
+    borderDashedValue?: number[]
+    // 边框圆角值
+    borderRadius?: number
+    // 背景色
+    backgroundColor?: string | CanvasGradient
+  }
+}) => Figure

rectText

text,已废弃,v10之后会删除,请用text代替。

自定义基础图形

创建一个自定义基础图形,只需要生成基础图形信息,然后通过klinecharts.registerFigure全局添加,添加到图表即可和内置基础图形一样去使用。

属性说明

typescript
{
+  // 图形名字,必要字段,是创建的唯一标识
+  name: string
+
+  // 校验事件是否在图形上,返回一个boolean值
+  checkEventOn: (
+    // 事件的坐标
+    coordinate: {
+      x: number
+      y: number
+    }
+    // 图形的属性
+    attrs: any
+    // 图形的样式
+    styles: any
+  ) => boolean
+
+  // 绘制
+  draw: (
+    // 画布上下文
+    ctx: CanvasRenderingContext2D,
+    // 图形的属性
+    attrs: any,
+    // 图形的样式
+  ) => void
+}

示例

以一个可以有边框和背景菱形来具体说明自定义。

步骤一

先确定属性和样式 属性{ x, y, width, height }x是中心点x轴坐标值,y是中心点y轴坐标值,width是宽度,height是高度。 样式{ style, color, borderStyle, borderSize, borderColor, dashedValue }style是样式类型,我们可以定义三个选项strokefillstroke_fillstroke只有边框,fill只有背景,stroke_fill又有边框又有背景,color是颜色,borderStyle是边框样式,可以定义两个选项soliddashedsolid是实线,dashed是虚线,borderSize是边框尺寸,borderColor是边框颜色,dashedValue是虚线值。

步骤二

实现checkEventOndraw两个方法。

javascript
{
+  name: 'diamond',
+  checkEventOn: (coordinate, attrs) => {
+    const { x, y, width, height } = attrs
+    const xDis = Math.abs(coordinate.x - x)
+    const yDis = Math.abs(coordinate.y - y)
+    return xDis * height + yDis * width < width * height / 2
+  },
+  draw: (ctx, attrs, styles) => {
+    const { x, y, width, height } = attrs
+    const {
+      style = 'fill',
+      color = 'currentColor',
+      borderSize = 1,
+      borderColor = 'currentColor',
+      borderStyle = 'solid',
+      borderDashedValue = [2, 2]
+    } = styles
+    // 绘制填充的菱形
+    if (style === 'fill' || styles.style === 'stroke_fill') {
+      ctx.fillStyle = color
+      ctx.beginPath()
+      ctx.moveTo(x - width / 2, y)
+      ctx.lineTo(x, y - height / 2)
+      ctx.lineTo(x + width / 2, y)
+      ctx.lineTo(x, y + height / 2)
+      ctx.closePath()
+      ctx.fill()
+    }
+    // 绘制边框的菱形
+    if (style === 'stroke' || styles.style === 'stroke_fill') {
+      ctx.strokeStyle = borderColor
+      ctx.lineWidth = borderSize
+      if (borderStyle === 'dashed') {
+        ctx.setLineDash(borderDashedValue)
+      } else {
+        ctx.setLineDash([])
+      }
+      ctx.beginPath()
+      ctx.beginPath()
+      ctx.moveTo(x - width / 2, y)
+      ctx.lineTo(x, y - height / 2)
+      ctx.lineTo(x + width / 2, y)
+      ctx.lineTo(x, y + height / 2)
+      ctx.closePath()
+      ctx.stroke()
+    }
+  }
+}

这样一个自定义的基础图形就完成了。

+ + + + \ No newline at end of file diff --git a/guide/hot-key.html b/guide/hot-key.html new file mode 100644 index 0000000..54531f5 --- /dev/null +++ b/guide/hot-key.html @@ -0,0 +1,26 @@ + + + + + + ⌨️ 快捷键 | KLineChart + + + + + + + + + + + + + + + +
Skip to content

⌨️ 快捷键

目前快捷键仅支持移动和缩放。

  • shift + 右移
  • shift + 左移
  • shift + + 放大
  • shift + - 缩小
+ + + + \ No newline at end of file diff --git a/guide/i18n.html b/guide/i18n.html new file mode 100644 index 0000000..63ddedf --- /dev/null +++ b/guide/i18n.html @@ -0,0 +1,35 @@ + + + + + + 🌏 国际化 | KLineChart + + + + + + + + + + + + + + + +
Skip to content

🌏 国际化

目前图表内置了en-USzh-CN两种语言,默认语言是en-US,如果需要使用其他语言,可以参考下面的方案。

增加语言包

增加语言包通过klinecharts.registerLocale(key, locales)去完成。 例如,添加一个中文繁体的语言包,可以这样做:

typescript
klinecharts.registerLocale('zh-HK', {
+  time: '時間:',
+  open: '開:',
+  high: '高:',
+  low: '低:',
+  close: '收:',
+  volume: '成交量:',
+  turnover: '成交額:',
+  change: '漲幅:'
+})

使用语言包

当添加完语言包后,可以通过图表API init(options)或者setLocale(key),完成语言切换。

+ + + + \ No newline at end of file diff --git a/guide/indicator.html b/guide/indicator.html new file mode 100644 index 0000000..2c50ebe --- /dev/null +++ b/guide/indicator.html @@ -0,0 +1,272 @@ + + + + + + 技术指标 | KLineChart + + + + + + + + + + + + + + + +
Skip to content

技术指标

本文档介绍了图表内置的技术指标和如何自定义一个技术指标。

内置技术指标

指标名默认计算参数指标名默认计算参数指标名默认计算参数
MA[5, 10, 30, 60]BIAS[6, 12, 24]VR[24, 30]
EMA[6, 12, 20]BRAR[26]WR[6, 10, 14]
SMA[12, 2]CCI[13]MTM[6, 10]
BBI[3, 6, 12, 24]DMI[14, 6]EMV[14, 9]
VOL[5, 10, 20]CR[26, 10, 20, 40, 60]SAR[2, 2,  20]
MACD[12, 26, 9]PSY[12, 6]AO[5, 34]
BOLL[20, 2]DMA[10, 50, 10]ROC[12, 6]
KDJ[9, 3, 3]TRIX[12, 20]PVT
RSI[6, 12, 24]OBV[30]AVP

自定义技术指标

创建一个自定义技术指标,只需要生成一个技术指标信息,然后通过klinecharts.registerIndicator全局添加,添加到图表即可和内置技术指标一样去使用。

属性说明

typescript
{
+  // 指标名
+  name: string
+  // 指标简短名称,用于显示,缺省将显示name
+  shortName?: string
+  // 精度,默认为4
+  precision?: number
+  // 计算参数
+  calcParams?: any[]
+  // 是否需要ohlc
+  shouldOhlc?: boolean
+  // 是否需要格式化大数据值,从1000开始格式化,比如100000是否需要格式化100K
+  shouldFormatBigNumber?: boolean
+  // 是否可见
+  visible?: boolean
+  // 层级
+  zLevel?: number
+  // 扩展数据
+  extendData?: any
+  // 系列,默认为'normal'
+  series?: 'normal' | 'price' | 'volume'
+  // 数据信息
+  figures?: Array<{
+    // 用于取计算结果中值
+    key: string
+    // 用于tooltip显示
+    title?: string
+    // 图形类型
+    type?: string
+    // 基准值,如果给定,将以这个值上下去绘制,一般用于type是'rect'
+    baseValue?: number
+    // 是一个方法,用于生成自定义图形的属性,
+    attrs?: ({
+      data: IndicatorFigureAttrsCallbackData
+      coordinate: IndicatorFigureAttrsCallbackCoordinate
+      bounding: Bounding
+      barSpace: BarSpace
+      xAxis: XAxis
+      yAxis: YAxis
+    }) => IndicatorFigureAttrs
+    // 是一个方法,用于生成样式
+    styles?: (
+      data: {
+        // 上一个图形的数据
+        prev: {
+          // k线数据,类型参阅[数据源]
+          kLineData?: KLineData
+          // 技术指标数据
+          indicatorData?: any
+        }
+        // 当前图形的数据
+        current: {
+          kLineData?: KLineData
+          indicatorData?: any
+        }
+        // 下一个图形的数据
+        next: {
+          kLineData?: KLineData
+          indicatorData?: any
+        }
+      },
+      // 技术图表实例
+      indicator: Indicator
+      // 默认的技术指标样式,即全局设置的技术指标样式,参阅[样式]中的indicator
+      defaultStyles: IndicatorStyle
+    ) => IndicatorFigureStyle
+  }>
+  // 指定的最小值,默认null
+  minValue?: number
+  // 指定的最大值,默认null
+  maxValue?: number
+  // 样式,支持增量,默认为null,类型参阅[样式]中的indicator
+  styles?: IndicatorStyle
+  // 计算方法,可以是一个promise
+  calc: (
+    // 数据源,类型参阅[数据源]
+    dataList: KLineData[],
+    // 技术指标实例
+    indicator: Indicator
+  ) => Promise<Array<any>> | Array<any>
+  // 重新生成数图形配置方法,会在计算参数发生变化后触发,返回类型参阅figures,默认为null
+  regenerateFigures?: (
+    // 计算参数
+    calcParms: any[]
+  ) => Array<IndicatorFigure<D>>
+  // 创建自定义提示文字
+  createTooltipDataSource?: (params: {
+    // 数据源,类型参阅[数据源]
+    kLineDataList: KLineData[]
+    // 技术指标实例
+    indicator: Indicator
+    // 可见区域信息
+    visibleRange: {
+      // 起点数据索引
+      from: number
+      // 终点数据索引
+      to: number
+      // 实际起点数据索引
+      realFrom: number
+      // 实际终点数据索引
+      realTo: number
+    },
+    // 窗口尺寸信息
+    bounding: {
+      // 宽
+      width: number
+      // 高
+      height: number
+      // 距离左边距离
+      left: number
+      // 距离右边距离
+      right: number
+      // 距离顶部距离
+      top: number
+      // 距离底部距离
+      bottom: number
+    },
+    // 十字光标的信息
+    crosshair: {
+      // 十字光标交叉点所在的窗口id
+      paneId?: string
+      // 真实的x坐标
+      realX?: number
+      // k线数据,类型参阅[数据源]
+      kLineData?: KLineData
+      // 数据索引
+      dataIndex?: number
+      // 真实数据索引
+      realDataIndex?: number
+    }
+    // 默认的技术指标样式,即全局设置的技术指标样式,参阅[样式]中的indicator
+    defaultStyles: IndicatorStyle
+    // x轴组件,内置一些转换方法
+    xAxis: XAxis
+    // y轴组件,内置一些转换方法
+    yAxis: YAxis
+  }) => ({
+    // 名字
+    name?: string
+    // 计算参数文字,如果name无值,则不会显示
+    calcParamsText?: string
+    // 值信息
+    values?: Array<{
+      title: string | {
+        text: string
+        color: string
+      }
+      value: string | {
+        text: string
+        color: string
+      }
+    }>
+  }),
+  // 自定义绘制,如果返回true,则figures配置的图形不会绘制
+  draw?: (params: {
+    // 画布上下文
+    ctx: CanvasRenderingContext2D
+    // 数据源,类型参阅[数据源]
+    kLineDataList: KLineData[]
+    // 技术指标实例
+    indicator: Indicator
+    // 可见区域信息
+    visibleRange: {
+      // 起点数据索引
+      from: number
+      // 终点数据索引
+      to: number,
+      // 实际起点数据索引
+      realFrom: number
+      // 实际终点数据索引
+      realTo: number
+    },
+    // 窗口尺寸信息
+    bounding: {
+      // 宽
+      width: number
+      // 高
+      height: number
+      // 距离左边距离
+      left: number
+      // 距离右边距离
+      right: number
+      // 距离顶部距离
+      top: number
+      // 距离底部距离
+      bottom: number
+    },
+    // 蜡烛柱的尺寸信息
+    barSpace: {
+      // 蜡烛柱尺寸
+      bar: number
+      halfBar: number
+      // 蜡烛柱不包含蜡烛柱之间间隙的尺寸
+      gapBar: number
+      halfGapBar: number
+    },
+    // 默认的技术指标样式,即全局设置的技术指标样式,参阅[样式]中的indicator
+    defaultStyles: IndicatorStyle
+    // x轴组件,内置一些转换方法
+    xAxis: XAxis
+    // y轴组件,内置一些转换方法
+    yAxis: YAxis
+  }) => boolean
+}

示例

以一个名为'MA'技术指标,介绍如何去做自定义技术指标。

步骤一

首先确定计算参数(calcParams)和配置项(figures),'MA'技术指标需要展示两个周期的收盘价平均值连起来的线,一条为'ma1',一条名为'ma2'。因此figures配置为:

javascript
{
+  // 计算参数是2个,一个计算5个周期时间的均值,即'ma1',另一个计算10个周期时间的均值,即'ma10'
+  calcParams: [5, 10],
+  figures: [
+    // 第一条线'ma5'
+    { key: 'ma1', title: 'MA5: ', type: 'line' },
+    // 第二条线'ma10'
+    { key: 'ma2', title: 'MA10: ', type: 'line' }
+  ]
+}

步骤二

确定其它属性

javascript
{
+  name: 'MA',
+  shortName: 'MA',
+  calcParams: [5, 10],
+  figures: [
+    { key: 'ma1', title: 'MA5: ', type: 'line' },
+    { key: 'ma2', title: 'MA10: ', type: 'line' }
+  ],
+  // 当计算参数改变时,希望提示的和参数一样,即title的值需要改变
+  regenerateFigures: (params) => {
+    return params.map((p, i) => {
+      return { key: `ma${i + 1}`, title: `MA${p}: `, type: 'line' }
+    })
+  },
+  // 计算结果
+  calc: (kLineDataList, { calcParams, figures }) => {
+    // 注意:返回数据个数需要和kLineDataList的数据个数一致,如果无值,用{}代替即可。
+    // 计算参数最好取回调参数calcParams,如果不是,后续计算参数发生变化的时候,这里计算不能及时响应
+    const closeSums = []
+    return kLineDataList.map((kLineData, i) => {
+      const ma = {}
+      const close = kLineData. close
+      calcParams.forEach((param, j) => {
+        closeSums[j] = (closeSums[j] || 0) + close
+        if (i >= param - 1) {
+          ma[figures[j].key] = closeSums[j] / param
+          closeSums[j] -= kLineDataList[i - (param - 1)].close
+        }
+      })
+      // 如果有值的情况下,这里每一项的数据格式应该是 { ma1: xxx, ma2: xxx }
+      // 每个key需要和figures中的子项key对应的值一致
+      return ma
+    })
+  }
+}

这样一个自定义指标就完成了。

+ + + + \ No newline at end of file diff --git a/guide/instance-api.html b/guide/instance-api.html new file mode 100644 index 0000000..cb02e85 --- /dev/null +++ b/guide/instance-api.html @@ -0,0 +1,558 @@ + + + + + + 实例API | KLineChart + + + + + + + + + + + + + + + +
Skip to content

实例API

getDom(paneId, position)

typescript
(paneId?: string, position?: 'root' | 'main' | 'yAxis') => HTMLElement

获取dom容器。

  • paneId 窗口id,缺省则是整个图表容器
  • position 支持rootmainyAxis,缺省则是root

getSize(paneId, position)

typescript
(paneId?: string, position?: 'root' | 'main' | 'yAxis') => {
+  width: number
+  height: number
+  left: number
+  top: number
+  right: number
+  bottom: number
+}

获取尺寸。

  • paneId 窗口id,缺省则是整个图表容器
  • position 位置,支持rootmainyAxis,缺省则是root

setStyles(styles)

typescript
(styles: string | object) => HTMLElement

设置样式配置。

  • styles 样式配置,可以是通过registerStyles注册进去的样式名。当是对象时,详情可参阅样式,支持合并。

getStyles()

typescript
() => object

获取样式配置,返回完整类型参阅样式

setPriceVolumePrecision(pricePrecision, volumePrecision)

typescript
(pricePrecision: number, volumePrecision: number) => void

设置价格和数量精度,同时技术指标系列是'price'或者'volume'也会受影响。

  • pricePrecision 价格精度
  • volumePrecision 数量精度

setTimezone(timezone)

typescript
(timezone: string) => void

设置时区。

  • timezone 时区名,如'Asia/Shanghai',如果不设置会自动获取本机时区,时区对应名字列表请参阅时区列表

getTimezone()

typescript
() => string

获取图表时区名。

setZoomEnabled(enabled)

typescript
(enabled: boolean) => void

设置是否缩放。

isZoomEnabled()

typescript
() => boolean

是否可以缩放。

setScrollEnabled(enabled)

typescript
(enabled: boolean) => void

设置是否可以拖拽滚动。

isScrollEnabled()

typescript
() => boolean

是否可以拖拽滚动。

setOffsetRightDistance(distance)

typescript
(distance: number) => void

设置图表右边可以空出来的间隙。

getOffsetRightDistance() ^9.2.0

typescript
() => number

获取图表右边可以空出来的间隙。

setMaxOffsetLeftDistance() ^9.7.0

typescript
(distance: number) => void

设置图表左边最大可空出来的间隙。

setMaxOffsetRightDistance() ^9.7.0

typescript
(distance: number) => void

设置图表右边最大可空出来的间隙。

setLeftMinVisibleBarCount(barCount)

typescript
(barCount: number) => void

设置左边最小可见的蜡烛数量。

setRightMinVisibleBarCount(barCount)

typescript
(barCount: number) => void

设置右边最小可见的蜡烛数量。

setBarSpace(space)

typescript
(space: number) => void

设置图表单根蜡烛柱的宽度。

getBarSpace()

typescript
() => number

获取图表单根蜡烛柱的宽度。

getVisibleRange()

typescript
() => {
+  from: number
+  to: number
+  realFrom: number
+  realTo: number
+}

获取可见区间范围。

applyNewData(dataList, more, callback)

typescript
(
+  dataListArray<{
+    timestamp: number
+    open: number
+    close: number
+    high: number
+    low: number
+    volume?: number,
+    turnover?: number
+  }>,
+  more?: boolean,
+  callback?: () => void
+) => void

添加新数据,此方法会清空图表数据,不需要额外调用clearData方法。

  • dataList 是一个K线数据数组,数据类型详情可参阅数据源
  • more 告诉图表还有没有更多历史数据,可缺省,默认为true
  • callback 成功回调 ^9.2.0

注意

参数 callback 自版本9.8.0开始,已废弃,请使用 subscribeAction('onDataReady', () => {}) 代替。

applyMoreData(dataList, more, callback)

typescript
(
+  dataListArray<{
+    timestamp: number
+    open: number
+    close: number
+    high: number
+    low: number
+    volume?: number
+    turnover?: number
+  }>,
+  more?: boolean,
+  callback?: () => void
+) => void

添加历史更多数据。

  • dataList 是一个K线数据数组,数据类型详情可参阅数据源
  • more 告诉图表还有没有更多历史数据,可缺省,默认为true
  • callback 成功回调 ^9.2.0

注意

该方法自版本9.8.0开始,已废弃。

updateData(data, callback)

typescript
(
+  data: {
+    timestamp: number
+    open: number
+    close: number
+    high: number
+    low: number
+    volume?: number
+    turnover?: number
+  },
+  callback?: () => void
+) => void

更新数据,目前只会匹配当前最后一条数据的时间戳,相同则覆盖,不同则追加。

  • data 单条k线数据,数据类型详情可参阅数据源
  • callback 成功回调 ^9.2.0

注意

参数 callback 自版本9.8.0开始,已废弃,请使用 subscribeAction('onDataReady', () => {}) 代替。

getDataList()

typescript
() => Array<{
+  timestamp: number
+  open: number
+  close: number
+  high: number
+  low: number
+  volume?: number
+  turnover?: number
+}>

获取图表目前的数据源,返回数据类型可参阅数据源

clearData()

typescript
() => void

清空图表数据,一般情况下不用手动调用,为了避免重复绘制,这里只是清除数据,图表不会重绘。

loadMore(cb)

typescript
(cb: (timestamp: number | null) => void) => void

设置加载更多回调函数。

  • cb 是一个回调方法,timestamp为第一条数据的时间戳

注意

该方法自版本9.8.0开始,已废弃,请使用 setLoadDataCallback 代替。

setLoadDataCallback(cb) ^9.8.0

typescript
(
+  cb: (params: { 
+    type: 'forward' | 'backward'
+    data: Nullable<KLineData>
+    callback: (dataList: KLineData[], more?: boolean) => void
+  }) => void
+) => void

设置自动加载数据回调方法

  • cb 回调方法
    • params 回调参数
      • type 类型,是往前加载还是往后加载
      • data 加载边界的数据
      • callback 回调方法,用于回传数据给图表

createIndicator(value, isStack, paneOptions, callback)

typescript
(
+  value: string | {
+    name: string
+    shortName?: string
+    precision?: number
+    calcParams?: any[]
+    shouldOhlc?: boolean
+    shouldFormatBigNumber?: boolean
+    visible?: boolean
+    zLevel?: number
+    extendData?: any
+    series?: 'normal' | 'price' | 'volume'
+    figures?: Array<{
+      key: string
+      title?: string
+      type?: string
+      baseValue?: number
+      attrs?: ({
+        data: object
+        coordinate: object
+        bounding: object
+        barSpace: object
+        xAxis: object
+        yAxis: object
+      }) => object
+      styles?: (
+        data: object,
+        indicator: object,
+        defaultStyles: object
+      ) => ({
+        style?: 'solid' | 'dashed' | 'stroke' | 'fill' | 'stroke_fill'
+        color?: string
+      })
+    }>
+    minValue?: number
+    maxValue?: number
+    styles?: object
+    calc?: (dataList: KLineData[], indicator: object) => Promise<object[]> | object[]
+    regenerateFigures?: (calcParms: any[]) => Array<{
+      key: string
+      title?: string
+      type?: string
+      baseValue?: number
+      styles?: (
+        data: object,
+        indicator: object,
+        defaultStyles: object
+      ) => {
+        style?: 'solid' | 'dashed' | 'stroke' | 'fill' | 'stroke_fill'
+        color?: string
+      }
+    }>,
+    createTooltipDataSource?: (params: object) => {
+      name?: string
+      calcParamsText?: string
+      values?: Array<{
+        title: string | {
+          text: string
+          color: string
+        }
+        value: string | {
+          text: string
+          color: string
+        }
+      }>
+    }
+    draw?: (params: object) => boolean
+  },
+  isStack?: boolean,
+  paneOptions?: {
+    id?: string
+    height?: number
+    minHeight?: number
+    dragEnabled?: boolean
+    position?: 'top' | 'bottom'
+    gap?: {
+      top?: number
+      bottom?: number
+    }
+    axisOptions?: {
+      name?: string
+      scrollZoomEnabled?: boolean
+    }
+  } | null,
+  callback?: () => void
+) => string | null

创建一个技术指标,返回值是一个标识窗口的字符串,这非常重要,后续对该窗口的一些操作,都需要此标识。

  • value 技术指标名或者技术指标对象,当是对象时,类型和图表方法overrideIndicator的入参一致

  • isStack 是否覆盖

  • paneOptions 窗口配置信息,可缺省

    • id 窗口id,可缺省
    • height 窗口高度,可缺省
    • minHeight 窗口最小高度,可缺省
    • dragEnabled 窗口是否可以拖拽调整高度,可缺省
    • position 位置,仅仅在创建新的窗口时有效 ^9.6.0
    • gap 边距
      • top 上边距,值小余1则是百分比
      • bottom 下边距,值小余1则是百分比
    • axisOptions
      • name 指定的轴的名字,此参数对应图表实例方法 registerYAxis(axis) 中的 axis.name,默认为 'default' ^9.8.0
      • scrollZoomEnabled 轴上是否可以滚动缩放 ^9.3.0
  • callback 指标创建完成回调方法

特殊的id

'candle_pane',主图的窗口id。

示例:

javascript
chart.createIndicator('MA', false, {
+  id: 'pane_1',
+  height: 100,
+  minHeight: 30,
+  dragEnabled: true,
+  gap: { top: 0.2, bottom: 0.1 },
+  axisOptions: { scrollZoomEnabled: true }
+}, () => {})

overrideIndicator(override, paneId, callback)

typescript
(
+  override: {
+    name: string
+    shortName?: string
+    precision?: number
+    calcParams?: any[]
+    shouldOhlc?: boolean
+    shouldFormatBigNumber?: boolean
+    visible?: boolean
+    zLevel?: number
+    extendData?: any
+    series?: 'normal' | 'price' | 'volume'
+    figures?: Array<{
+      key: string
+      title?: string
+      type?: string
+      baseValue?: number
+      attrs?: ({
+        data: object
+        coordinate: object
+        bounding: object
+        barSpace: object
+        xAxis: object
+        yAxis: object
+      }) => object
+      styles?: (
+        data: object,
+        indicator: object,
+        defaultStyles: object
+      ) => {
+        style?: 'solid' | 'dashed' | 'stroke' | 'fill' | 'stroke_fill'
+        color?: string
+      }
+    }>
+    minValue?: number
+    maxValue?: number
+    styles?: object
+    calc?: (dataList: KLineData[], indicator: object) => Promise<object[]> | object[]
+    regenerateFigures?: (calcParms: any[]) => Array<{
+      key: string
+      title?: string
+      type?: string
+      baseValue?: number
+      styles?: (
+        data: object,
+        indicator: object,
+        defaultStyles: object
+      ) => {
+        style?: 'solid' | 'dashed' | 'stroke' | 'fill' | 'stroke_fill'
+        color?: string
+      }
+    }>,
+    createTooltipDataSource?: (params: object) => {
+      name?: string
+      calcParamsText?: string
+      values?: Array<{
+        title: string | {
+          text: string
+          color: string 
+        }
+        value: string | {
+          text: string
+          color: string
+        }
+      }>
+    }
+    draw?: (params: object) => boolean
+  },
+  paneId?: string | null,
+  callback?: () => void
+) => void

覆盖技术指标信息。

  • override 需要覆盖的一些参数
    • name 指标名,用于创建和操作的唯一标识
    • shortName 简短名字,用于显示
    • precision 精度
    • calcParams 计算参数
    • shouldOhlc 是否需要ohlc辅助图形
    • shouldFormatBigNumber 是否需要格式化大的数字。如1000转换成1k,1000000转换为1M等
    • visible 是否可见
    • zLevel 层级 ^9.7.0
    • extendData 扩展数据
    • series 指标系列,可选项有'normal','price'和'volume'
    • figures 图形配置
    • minValue 指定最小值
    • maxValue 指定最大值
    • styles 样式
    • calc 计算方法
    • regenerateFigures 重新生成图形信息方法
    • createTooltipDataSource 创建自定义提示信息方法
    • draw 自定义绘制方法
  • paneId 窗口id,缺省则设置所有
  • callback 成功回调

特殊的id

'candle_pane',主图的窗口id。

示例:

javascript
chart.overrideIndicator({
+  name: 'BOLL',
+  showName: 'BOLL'
+  calcParams: [20, 5.5],
+  precision: 4,
+  shouldOhlc: true,
+  shouldFormatBigNumber: false,
+  visible: true,
+  zLevel: 1,
+  extendData: 2432435,
+  series: 'price',
+  figures: [],
+  minValue: null,
+  maxValue: null,
+  calc: () => [],
+  regenerateFigures: () => [],
+  draw: () => {},
+  styles: {
+  	bars:[{
+      style: 'fill,
+      borderStyle: 'solid,
+      borderSize: 1,
+      borderDashedValue: [2, 2],
+      upColor: '#26A69A',
+      downColor: '#EF5350',
+      noChangeColor: '#888888'
+    }],
+    lines: [{
+      size: 1,
+      style: 'solid',
+      dashedValue: [2, 2],
+      color: '#FF9600'
+    }],
+    circles: [{
+      style: 'fill,
+      borderStyle: 'solid,
+      borderSize: 1,
+      borderDashedValue: [2, 2],
+      upColor: '#26A69A',
+      downColor: '#EF5350',
+      noChangeColor: '#888888'
+    }]
+  }
+}, 'candle_pane', () => {})

getIndicatorByPaneId(paneId, name)

typescript
(paneId?: string, name?: string) => object

根据窗口id获取技术指标信息。

  • paneId 窗口id,即调用createIndicator方法时返回的窗口标识,可缺省,缺省则返回所有。
  • name 技术指标名

特殊的id

'candle_pane',主图的窗口id。

removeIndicator(paneId, name)

typescript
(paneId: string, name?: string) => object

移除技术指标。

  • paneId 窗口id,即调用createIndicator方法时返回的窗口标识
  • name 技术指标名,如果缺省,则会移除所有

特殊的id

'candle_pane',主图的窗口id。

createOverlay(value, paneId)

typescript
(
+  value: string | {
+    name: string
+    id?: string
+    groupId?: string
+    lock?: boolean
+    visible?: boolean
+    zLevel?: number
+    needDefaultPointFigure?: boolean
+    needDefaultXAxisFigure?: boolean
+    needDefaultYAxisFigure?: boolean
+    mode?: 'normal' | 'weak_magnet' | 'strong_magnet'
+    modeSensitivity?: number
+    points?: Array<{
+      timestamp?: number
+      dataIndex?: number
+      value?: number
+    }>
+    extendData?: any
+    styles?: object
+    onDrawStart?: (event: object) => boolean
+    onDrawing?: (event: object) => boolean
+    onDrawEnd?: (event: object) => boolean
+    onClick?: (event: object) => boolean
+    onDoubleClick?: (event: object) => boolean
+    onRightClick?: (event: object) => boolean
+    onPressedMoveStart?: (event: object) => boolean
+    onPressedMoving?: (event: object) => boolean
+    onPressedMoveEnd?: (event: object) => boolean
+    onMouseEnter?: (event: object) => boolean
+    onMouseLeave?: (event: object) => boolean
+    onRemoved?: (event: object) => boolean
+    onSelected?: (event: object) => boolean
+    onDeselected?: (event: object) => boolean
+  } | Array<string | {
+    name: string
+    id?: string
+    groupId?: string
+    lock?: boolean
+    visible?: boolean
+    zLevel?: number
+    needDefaultPointFigure?: boolean
+    needDefaultXAxisFigure?: boolean
+    needDefaultYAxisFigure?: boolean
+    mode?: 'normal' | 'weak_magnet' | 'strong_magnet'
+    modeSensitivity?: number
+    points?: Array<{
+      timestamp?: number
+      dataIndex?: number
+      value?: number
+    }>
+    extendData?: any
+    styles?: object
+    onDrawStart?: (event: object) => boolean
+    onDrawing?: (event: object) => boolean
+    onDrawEnd?: (event: object) => boolean
+    onClick?: (event: object) => boolean
+    onDoubleClick?: (event: object) => boolean
+    onRightClick?: (event: object) => boolean
+    onPressedMoveStart?: (event: object) => boolean
+    onPressedMoving?: (event: object) => boolean
+    onPressedMoveEnd?: (event: object) => boolean
+    onMouseEnter?: (event: object) => boolean
+    onMouseLeave?: (event: object) => boolean
+    onRemoved?: (event: object) => boolean
+    onSelected?: (event: object) => boolean
+    onDeselected?: (event: object) => boolean
+  }>,
+  paneId?: string
+) => string | null

创建覆盖物,返回一个字符串类型的标识。

  • value 覆盖物名或者对象,当是对象时,参数和overrideOverlay一致
  • paneId 窗口id,可缺省

特殊的id

'candle_pane',主图的窗口id。

示例:

javascript
chart.createOverlay({
+  name: 'segment',
+  id: 'segment_1',
+  groupId: 'segment',
+  points: [
+    { timestamp: 1614171282000, value: 18987 },
+    { timestamp: 1614171202000, value: 16098 },
+  ],
+  styles: {
+    line: {
+      style: 'solid',
+      dashedValue: [2, 2],
+      color: '#f00',
+      size: 2
+    }
+  },
+  lock: false,
+  visible: true,
+  zLevel: 0,
+  mode: 'weak_magnet',
+  modeSensitivity: 8,
+  extendData: 'xxxxxxxx',
+  needDefaultPointFigure: false,
+  needDefaultXAxisFigure: false,
+  needDefaultYAxisFigure: false,
+  onDrawStart: function (event) { console.log(event) },
+  onDrawing: function (event) { console.log(event) },
+  onDrawEnd: function (event) { console.log(event) },
+  onClick: function (event) { console.log(event) },
+  onDoubleClick: function (event) { console.log(event) },
+  onRightClick: function (event) {
+    console.log(event)
+    return false
+  },
+  onMouseEnter: function (event) { console.log(event) },
+  onMouseLeave: function (event) { console.log(event) },
+  onPressedMoveStart: function (event) { console.log(event) },
+  onPressedMoving: function (event) { console.log(event) },
+  onPressedMoveEnd: function (event) { console.log(event) },
+  onRemoved: function (event) { console.log(event) },
+  onSelected: function (event) { console.log(event) },
+  onDeselected: function (event) { console.log(event) }
+})

getOverlayById(id)

typescript
(id: string) => object

根据id获取覆盖物信息。

  • id 调用createOverlay方法是返回的标识

overrideOverlay(override)

typescript
(
+  override: {
+    name: string
+    id?: string
+    groupId?: string
+    lock?: boolean
+    visible?: boolean
+    zLevel?: number
+    needDefaultPointFigure?: boolean
+    needDefaultXAxisFigure?: boolean
+    needDefaultYAxisFigure?: boolean
+    mode?: 'normal' | 'weak_magnet' | 'strong_magnet'
+    modeSensitivity?: number
+    points?: Array<{
+      timestamp?: number
+      dataIndex?: number
+      value?: number
+    }>
+    extendData?: any
+    styles?: object
+    onDrawStart?: (event: object) => boolean
+    onDrawing?: (event: object) => boolean
+    onDrawEnd?: (event: object) => boolean
+    onClick?: (event: object) => boolean
+    onDoubleClick?: (event: object) => boolean
+    onRightClick?: (event: object) => boolean
+    onPressedMoveStart?: (event: object) => boolean
+    onPressedMoving?: (event: object) => boolean
+    onPressedMoveEnd?: (event: object) => boolean
+    onMouseEnter?: (event: object) => boolean
+    onMouseLeave?: (event: object) => boolean
+    onRemoved?: (event: object) => boolean
+    onSelected?: (event: object) => boolean
+    onDeselected?: (event: object) => boolean
+  }
+) => string | null

覆盖已绘制的覆盖物。

  • override 需要覆盖的参数
    • name 覆盖物名,用于创建的唯一标识
    • id 覆盖物标识,如果id存在,则会以id为依据去覆盖
    • groupId 编组id
    • lock 是否锁定不让拖动
    • visible 是否可见
    • zLevel 绘制层级,值越大越靠前显示
    • needDefaultPointFigure 是否需要默认的点对应的图形
    • needDefaultXAxisFigure 是否需要默认的x轴上的图形
    • needDefaultYAxisFigure 是否需要默认的y轴上的图形
    • mode 模式,可选项有'normal','weak_magnet'和'strong_magnet'
    • modeSensitivity 模式灵敏度,仅 mode 是 weak_magnet 时有效 ^9.5.0
    • points 点信息
    • extendData 扩展数据
    • styles 样式
    • onDrawStart 开始绘制事件
    • onDrawing 绘制中事件
    • onDrawEnd 绘制结束事件
    • onClick 点击事件
    • onDoubleClick 双击事件 ^9.5.0
    • onRightClick 右击事件
    • onPressedMoveStart 按住开始移动事件
    • onPressedMoving 按住移动中事件
    • onPressedMoveEnd 按住移动结束事件
    • onMouseEnter 鼠标移入事件
    • onMouseLeave 鼠标移出事件
    • onRemoved 删除事件
    • onSelected 选中事件
    • onDeselected 取消选中事件

示例:

javascript
chart.overrideOverlay({
+  name: 'segment',
+  id: 'segment_1',
+  groupId: 'segment',
+  points: [
+    { timestamp: 1614171282000, value: 18987 },
+    { timestamp: 1614171202000, value: 16098 },
+  ],
+  styles: {
+    line: {
+      style: 'solid',
+      dashedValue: [2, 2],
+      color: '#f00',
+      size: 2
+    }
+  },
+  lock: false,
+  visible: true,
+  zLevel: 0,
+  mode: 'weak_magnet',
+  modeSensitivity: 8,
+  extendData: 'xxxxxxxx',
+  needDefaultPointFigure: false,
+  needDefaultXAxisFigure: false,
+  needDefaultYAxisFigure: false,
+  onDrawStart: function (event) { console.log(event) },
+  onDrawing: function (event) { console.log(event) },
+  onDrawEnd: function (event) { console.log(event) },
+  onClick: function (event) { console.log(event) },
+  onDoubleClick: function (event) { console.log(event) },
+  onRightClick: function (event) {
+    console.log(event)
+    return false
+  },
+  onMouseEnter: function (event) { console.log(event) },
+  onMouseLeave: function (event) { console.log(event) },
+  onPressedMoveStart: function (event) { console.log(event) },
+  onPressedMoving: function (event) { console.log(event) },
+  onPressedMoveEnd: function (event) { console.log(event) },
+  onRemoved: function (event) { console.log(event) },
+  onSelected: function (event) { console.log(event) },
+  onDeselected: function (event) { console.log(event) }
+})

removeOverlay(remove)

typescript
(
+  remove: string | {
+    id?: string
+    groupId?: string
+    name?: string
+  }
+) => void

移除图形。

  • id 调用createOverlay方法是返回的标识
  • groupId 编组id
  • name 覆盖物名称

删除一个html元素

  • paneId 窗口id,缺省则删除所有
  • htmlId 创建时候的id,可以是单个id,也可以是id组成的数组,缺省则删除对应窗口上所有的

scrollByDistance(distance, animationDuration)

typescript
(distance: number, animationDuration?: number) => void

滚动一定的距离。

  • distance 距离
  • animationDuration 动画时间,可以缺省,缺省则无动画

scrollToRealTime(animationDuration)

typescript
(distance: number, animationDuration?: number) => void

滚动到最初的位置。

  • animationDuration 动画时间,可以缺省,缺省则无动画

scrollToDataIndex(dataIndex, animationDuration)

typescript
(dataIndex: number, animationDuration?: number) => void

滚动到指定的位置。

  • dataIndex 数据的索引
  • animationDuration 动画时间,可以缺省,缺省则无动画

scrollToTimestamp(timestamp, animationDuration)

typescript
(timestamp: number, animationDuration?: number) => void

滚动到指定时间戳。

  • timestamp 时间戳
  • animationDuration 动画时间,可以缺省,缺省则无动画

zoomAtCoordinate(scale, coordinate, animationDuration)

typescript
(
+  scale: number,
+  coordinate?: {
+    x: number
+    y: number
+  },
+  animationDuration?: number
+) => void

在某个坐标点缩放。

  • scale 缩放比例
  • coordinate 坐标点,可缺省,缺省则在图表中间位置缩放
  • animationDuration 动画时间,可以缺省,缺省则无动画

zoomAtDataIndex(scale, dataIndex, animationDuration)

typescript
(scale: number, dataIndex: number, animationDuration?: number) => void

在某个位置缩放。

  • scale 缩放比例
  • dataIndex 数据的索引
  • animationDuration 动画时间,可以缺省,缺省则无动画

zoomAtTimestamp(scale, timestamp, animationDuration)

typescript
(scale: number, timestamp: number, animationDuration?: number) => void

在指定时间戳上缩放。

  • scale 缩放比例
  • timestamp 时间戳
  • animationDuration 动画时间,可以缺省,缺省则无动画

setPaneOptions(options)

typescript
(
+  options: {
+    id: string
+    height?: number
+    minHeight?: number
+    dragEnabled?: boolean
+    gap?: {
+      top?: number
+      bottom?: number
+    }
+    axisOptions?: {
+      name?: string
+      scrollZoomEnabled?: boolean
+    }
+  }
+) => void

设置窗口配置。

  • options 窗口配置信息,可缺省
    • id 窗口id
    • height 窗口高度,可缺省
    • minHeight 窗口最小高度,可缺省
    • dragEnabled 窗口是否可以拖拽调整高度,可缺省
    • gap 边距
      • top 上边距,值小余1则是百分比
      • bottom 下边距,值小余1则是百分比
    • axisOptions
      • name 轴名字 ^9.8.0
      • scrollZoomEnabled 轴上是否可以滚动缩放 ^9.3.0

特殊的id

'candle_pane',主图的窗口id。

示例:

javascript
chart.setPaneOptions({
+  id: 'pane_1',
+  height: 100,
+  minHeight: 3,
+  dragEnabled: true,
+  gap: { top: 0.2, bottom: 0.1 },
+  axisOptions: { name: 'default', scrollZoomEnabled: true }
+})

executeAction(type, data) ^9.2.0

typescript
(
+   type: 'onCrosshairChange',
+   data: any => void
+) => void

执行图表动作

  • type 仅支持 'onCrosshairChange'
  • data 执行动作需要的数据

subscribeAction(type, callback)

typescript
(
+  type: 'onDataReady' | 'onZoom' | 'onScroll' | 'onVisibleRangeChange' | 'onCrosshairChange' | 'onCandleBarClick' | 'onTooltipIconClick' | 'onPaneDrag',
+  callback: (data?: any) => void
+) => void

订阅图表动作。

  • type 可选项为 'onDataReady','onZoom','onScroll','onVisibleRangeChange','onCandleBarClick', 'onTooltipIconClick','onCrosshairChange'和'onPaneDrag'
  • callback 是一个回调方法

unsubscribeAction(type, callback)

typescript
(
+  type: 'onDataReady' | 'onZoom' | 'onScroll' | 'onVisibleRangeChange' | 'onCrosshairChange' | 'onCandleBarClick' | 'onTooltipIconClick' | 'onPaneDrag',
+  callback?: (data?: any) => void
+) => void

取消订阅图表动作。

  • type 可选项为 'onDataReady','onZoom','onScroll','onVisibleRangeChange','onCandleBarClick', 'onTooltipIconClick','onCrosshairChange'和'onPaneDrag'
  • callback 订阅时的回调方法,缺省则取消当前类型所有

convertToPixel(value, finder)

typescript
(
+  value: {
+    dataIndex?: number
+    timestamp?: number
+    value?: number
+  } | Array<{
+    dataIndex?: number
+    timestamp?: number
+    value?: number
+  }>,
+  finder: {
+    paneId?: string
+    absolute?: boolean
+  }
+) => { x: number?, y?: number } | Array<{ x?: number, y?: number }>

将值转换成坐标。

  • value 需要转换的值,可以是当个对象,也可以是数组
    • dataIndex 数据索引,如果dataIndextimestamp同时存在,则依据索引转换
    • timestamp 时间戳
    • value 对应y轴的值
  • finder 过滤条件
    • paneId 窗口id
    • absolute 是否是绝对坐标,只作用于y轴

convertFromPixel(coordinate, finder)

typescript
(
+  coordinate: {
+    x?: number
+    y?: number
+  } | Array<{
+    x?: number
+    y?: number
+  },
+  finder: {
+    paneId?: string
+    absolute?: boolean
+  }
+) => {
+    dataIndex?: number
+    timestamp?: number
+    value?: number
+  } | Array<{
+    dataIndex?: number
+    timestamp?: number
+    value?: number
+  }>

将坐标转换成值。

  • coordinate 需要转换的值,可以是当个对象,也可以是数组
  • finder 过滤条件
    • paneId 窗口id
    • absolute 是否是绝对坐标,只作用于y轴

getConvertPictureUrl(includeOverlay, type, backgroundColor)

typescript
(includeOverlay?: boolean, type?: string, backgroundColor?: string) => string

获取图表转换成图片后的图片url。

  • includeOverlay 是否需要包含浮层,可缺省
  • type 转换后的图片类型,类型是'png'、'jpeg'、'bmp'三种中的一种,可缺省,默认为'jpeg'
  • backgroundColor 背景色,可缺省,默认为'#FFFFFF'

resize()

typescript
() => void

调整图表大小,总是会填充容器大小。

注意

此方法会重新计算整个图表各个模块的大小,频繁调用可能会影响到性能,调用请谨慎。

+ + + + \ No newline at end of file diff --git a/guide/introduction.html b/guide/introduction.html new file mode 100644 index 0000000..b62d31e --- /dev/null +++ b/guide/introduction.html @@ -0,0 +1,26 @@ + + + + + + 📃 介绍 | KLineChart + + + + + + + + + + + + + + + +
Skip to content

📃 介绍

什么是 KLineChart?

KLineChart,是一款可高度自定义的专业级轻量金融图表。

特性

  • 📦 开箱即用:简单快速集成,基本零成本上手。
  • 🚀 轻量流畅:零依赖,Gzip压缩下仅40k。
  • 💪 功能强大:内置多种指标和画线模型。
  • 🎨 高可扩展:丰富的样式配置和API,功能扩展随心所欲。
  • 📱 移动端:支持移动端,一个图表,搞定多端。
  • 🛡 Typescript开发:提供完整的类型定义文件。
+ + + + \ No newline at end of file diff --git a/guide/overlay.html b/guide/overlay.html new file mode 100644 index 0000000..dedfa4b --- /dev/null +++ b/guide/overlay.html @@ -0,0 +1,253 @@ + + + + + + 覆盖物 | KLineChart + + + + + + + + + + + + + + + +
Skip to content

覆盖物

本文档介绍了图表内置的覆盖物和如何自定义一个覆盖物。

内置覆盖物类型

horizontalRayLine, horizontalSegment, horizontalStraightLine, verticalRayLine, verticalSegment, verticalStraightLine, rayLine, segment, straightLine, priceLine, priceChannelLine, parallelStraightLine, fibonacciLine, simpleAnnotation, simpleTag

自定义覆盖物

自定义一个覆盖物,然后通过klinecharts.registerOverlay 全局添加,添加到图表即可和内置覆盖物一样去使用。

属性说明

typescript
{
+  // 名称,必须字段,作为覆盖物创建的唯一标识
+  name: string
+
+  // 总共需要多少步操作才行绘制完成,非必须
+  totalStep?: number
+
+  // 是否锁定,不触发事件,非必须
+  lock?: boolean
+
+  // 是否可见
+  visible?: boolean
+
+  // 绘制层级,值越大越靠前显示
+  zLevel?: number
+
+  // 是否需要默认的点对应的图形,非必须
+  needDefaultPointFigure?: boolean
+
+  // 是否需要默认的X轴上的图形,非必须
+  needDefaultXAxisFigure?: boolean
+
+  // 是否需要默认的Y轴上的图形,非必须
+  needDefaultYAxisFigure?: boolean
+
+  // 模式,可选项为`normal`,`weak_magnet`,`strong_magnet`,非必须
+  mode?: 'normal' | 'weak_magnet' | 'strong_magnet'
+
+  // 模式灵敏度,仅 mode 是 weak_magnet 时有效
+  modeSensitivity?: number
+
+  // 点信息,非必须
+  points?: Array<{
+    // 时间戳
+    timestamp: number
+    // 数据索引
+    dataIndex?: number
+    // 对应y轴的值
+    value?: number
+  }>
+
+  // 扩展数据,非必须
+  extendData?: any
+
+  // 样式,非必须,类型参与[样式]中的overlay
+  styles?: OverlayStyle
+
+  // 创建点对应的图形,非必须
+  createPointFigures: ({
+    // 覆盖物实例
+    overlay: Overlay
+    // points对应的坐标信息
+    coordinates: Array<{
+      x: number
+      y: number
+    }>
+    // 窗口尺寸信息
+    bounding: {
+      // 宽
+      width: number
+      // 高
+      height: number
+      // 距离左边距离
+      left: number
+      // 距离右边距离
+      right: number
+      // 距离顶部距离
+      top: number
+      // 距离底部距离
+      bottom: number
+    }
+    // 蜡烛柱的尺寸信息
+    barSpace: {
+      // 蜡烛柱尺寸
+      bar: number
+      halfBar: number
+      // 蜡烛柱不包含蜡烛柱之间间隙的尺寸
+      gapBar: number
+      halfGapBar: number
+    }
+    // 精度
+    precision: {
+      // 价格精度
+      price: number
+      // 数量精度
+      volume: number
+    }
+    // 千分符
+    thousandsSeparator: string
+    // 小数折叠阈值
+    decimalFoldThreshold: number
+    // 格式化日期和时间的对象的构造器,详情参阅 https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Intl/DateTimeFormat
+    dateTimeFormat: Intl.DateTimeFormat
+    // 默认样式,即全局样式配置中的overlay,类型参与[样式]中的overlay
+    defaultStyles: OverlayStyle
+     // x轴组件,内置一些转换方法
+    xAxis: XAxis
+    // y轴组件,内置一些转换方法
+    yAxis: YAxis
+  }) => ({
+    // 无特殊含义,可用于扩展字段
+    key?: string
+    // 图形类型,类型为klinecharts.getSupportFigures返回值中的一种
+    type: string
+    // type对应的图形的属性
+    attrs: any | any[]
+    // type对应的图形的样式
+    styles?: any
+    // 是否忽略事件
+    ignoreEvent?: boolean | OverlayFigureIgnoreEventType[]
+  }) | Array<{
+    key?: string
+    type: string
+    attrs: any | any[]
+    styles?: any
+    ignoreEvent?: boolean | OverlayFigureIgnoreEventType[]
+  }>
+
+  // 创建X轴上的图形,非必须,参数和返回值和`createPointFigures`一致
+  createXAxisFigures?: OverlayCreateFiguresCallback
+
+  // 创建Y轴上的图形,非必须,参数和返回值和`createPointFigures`一致
+  createYAxisFigures?: OverlayCreateFiguresCallback
+
+  // 处理在绘制过程中移动操作,可缺省,移动绘制过程中触发
+  performEventMoveForDrawing?: ({
+    // 当前步骤
+    currentStep: number
+    // 模式
+    mode: 'normal' | 'weak_magnet' | 'strong_magnet'
+    // 点信息
+    points: Array<{
+      // 时间戳
+      timestamp: number
+      // 数据索引
+      dataIndex?: number
+      // 对应y轴的值
+      value?: number
+    }>
+    // 事件所在点的索引
+    performPointIndex: number
+    // 事件所在点的信息
+    performPoint: {
+      // 时间戳
+      timestamp: number
+      // 数据索引
+      dataIndex?: number
+      // 对应y轴的值
+      value?: number
+    }
+  }) => void
+
+  // 处理按住移动操作,可缺省,按住某个操作点移动过程中触发
+  // 回调参数和`performEventMoveForDrawing`一致
+  performEventPressedMove?: (params: OverlayPerformEventParams) => void
+
+  // 绘制开始回调事件,可缺省
+  onDrawStart?: (event: OverlayEvent) => boolean
+
+  // 绘制过程中回调事件,可缺省
+  onDrawing?: (event: OverlayEvent) => boolean
+
+  // 绘制结束回调事件,可缺省
+  onDrawEnd?: (event: OverlayEvent) => boolean
+
+  // 点击回调事件,可缺省
+  onClick?: (event: OverlayEvent) => boolean
+
+  // 双击回调事件,可缺省
+  onDoubleClick?: (event: OverlayEvent) => boolean
+
+  // 右击回调事件,可缺省,需要返回一个boolean类型的值,如果返回true,内置的右击删除将无效
+  onRightClick?: (event: OverlayEvent) => boolean
+
+  // 按住拖动开始回调事件,可缺省
+  onPressedMoveStart?: (event: OverlayEvent) => boolean
+
+  // 按住拖动回调事件,可缺省  
+  onPressedMoving?: (event: OverlayEvent) => boolean
+
+  // 按住拖动结束回调事件,可缺省
+  onPressedMoveEnd?: (event: OverlayEvent) => boolean
+
+  // 鼠标移入事件,可缺省
+  onMouseEnter?: (event: OverlayEvent) => boolean
+
+  // 鼠标移出事件,可缺省
+  onMouseLeave?: (event: OverlayEvent) => boolean
+
+  // 删除回调事件,可缺省
+  onRemoved?: (event: OverlayEvent) => boolean
+
+  // 选中回调事件,可缺省
+  onSelected?: (event: OverlayEvent) => boolean
+
+  // 取消回调事件,可缺省
+  onDeselected?: (event: OverlayEvent) => boolean
+}

示例

以一个填充带边框的圆来具体说明如何配置。

javascript
{
+  // 名称
+  name: 'sampleCircle',
+
+  // 完成一个圆的绘制需要三个步骤
+  totalStep: 3,
+
+  // 创建点对应的图形信息
+  createPointFigures: ({ coordinates }) => {
+    if (coordinates.length === 2) {
+      const xDis = Math.abs(coordinates[0].x - coordinates[1].x)
+      const yDis = Math.abs(coordinates[0].y - coordinates[1].y)
+      // 确定对应点生成的圆的坐标
+      const radius = Math.sqrt(xDis * xDis + yDis * yDis)
+      // 图表内置了基础图形'circle',可以直接使用
+      return {
+        key: 'sampleCircle',
+        type: 'circle',
+        attrs: {
+          ...coordinates[0],
+          r: radius
+        },
+        styles: {
+          // 选择边框且填充,其它选择使用默认样式
+          style: 'stroke_fill'
+        }
+      }
+    }
+    return []
+  }
+}

这样一个自定义覆盖物就完成了。

+ + + + \ No newline at end of file diff --git a/guide/quick-start.html b/guide/quick-start.html new file mode 100644 index 0000000..3b431a9 --- /dev/null +++ b/guide/quick-start.html @@ -0,0 +1,217 @@ + + + + + + 🚀 快速上手 | KLineChart + + + + + + + + + + + + + + + +
Skip to content

🚀 快速上手

获取KLineChart

KLineChart 支持多种下载方式,你可以通过 npmyarnpnpmbun 包管理工具下载。另外,也提供了 umd 版本,所以也可以从 cdn 网站 等进行下载,使用全局变量 klinecharts 即可。

推荐使用包管理工具的方式进行开发,不仅可在开发环境轻松调试,也可放心地在生产环境打包部署使用,享受整个生态圈和工具链带来的诸多好处。

bash
npm install klinecharts
bash
yarn add klinecharts
bash
pnpm install klinecharts
bash
bun add klinecharts
html
<script src="https://cdn.jsdelivr.net/npm/klinecharts/dist/umd/klinecharts.min.js"></script>

创建第一个图表

KLineChart 不受前端框架限制,所以你可以在任何一个前端框架中使用。

jsx
import { useEffect } from 'react'
+import { init, dispose } from 'klinecharts'
+export default () => {
+  useEffect(() => {
+    const chart = init('chart')
+          
+    chart.applyNewData([
+      { close: 4976.16, high: 4977.99, low: 4970.12, open: 4972.89, timestamp: 1587660000000, volume: 204 },
+      { close: 4977.33, high: 4979.94, low: 4971.34, open: 4973.20, timestamp: 1587660060000, volume: 194 },
+      { close: 4977.93, high: 4977.93, low: 4974.20, open: 4976.53, timestamp: 1587660120000, volume: 197 },
+      { close: 4966.77, high: 4968.53, low: 4962.20, open: 4963.88, timestamp: 1587660180000, volume: 28 },
+      { close: 4961.56, high: 4972.61, low: 4961.28, open: 4961.28, timestamp: 1587660240000, volume: 184 },
+      { close: 4964.19, high: 4964.74, low: 4961.42, open: 4961.64, timestamp: 1587660300000, volume: 191 },
+      { close: 4968.93, high: 4972.70, low: 4964.55, open: 4966.96, timestamp: 1587660360000, volume: 105 },
+      { close: 4979.31, high: 4979.61, low: 4973.99, open: 4977.06, timestamp: 1587660420000, volume: 35 },
+      { close: 4977.02, high: 4981.66, low: 4975.14, open: 4981.66, timestamp: 1587660480000, volume: 135 },
+      { close: 4985.09, high: 4988.62, low: 4980.30, open: 4986.72, timestamp: 1587660540000, volume: 76 }
+    ])
+          
+    return () => {
+      dispose('chart')
+    }
+  }, [])
+
+  return <div id="chart" style={{ width: 600, height: 600 }}/>
+}
vue
<script setup>
+import { onMounted, onUnmounted } from 'vue'
+import { init, dispose } from 'klinecharts'
+
+onMounted(() => {
+  const chart = init('chart')
+
+  chart.applyNewData([
+    { close: 4976.16, high: 4977.99, low: 4970.12, open: 4972.89, timestamp: 1587660000000, volume: 204 },
+    { close: 4977.33, high: 4979.94, low: 4971.34, open: 4973.20, timestamp: 1587660060000, volume: 194 },
+    { close: 4977.93, high: 4977.93, low: 4974.20, open: 4976.53, timestamp: 1587660120000, volume: 197 },
+    { close: 4966.77, high: 4968.53, low: 4962.20, open: 4963.88, timestamp: 1587660180000, volume: 28 },
+    { close: 4961.56, high: 4972.61, low: 4961.28, open: 4961.28, timestamp: 1587660240000, volume: 184 },
+    { close: 4964.19, high: 4964.74, low: 4961.42, open: 4961.64, timestamp: 1587660300000, volume: 191 },
+    { close: 4968.93, high: 4972.70, low: 4964.55, open: 4966.96, timestamp: 1587660360000, volume: 105 },
+    { close: 4979.31, high: 4979.61, low: 4973.99, open: 4977.06, timestamp: 1587660420000, volume: 35 },
+    { close: 4977.02, high: 4981.66, low: 4975.14, open: 4981.66, timestamp: 1587660480000, volume: 135 },
+    { close: 4985.09, high: 4988.62, low: 4980.30, open: 4986.72, timestamp: 1587660540000, volume: 76 }
+  ])
+})
+
+onUnmounted(() => {
+  dispose('chart')
+})
+</script>
+
+<template>
+  <div id="chart" style="width:600px;height:600px"/>
+</template>
ts
import { Component, AfterViewInit, OnDestroy } from '@angular/core';
+import { init, dispose } from 'klinecharts';
+
+@Component({
+  selector: 'app-chart',
+  template: `<div id="chart" style="width:600px;height:600px"/>`,
+})
+export class ChartComponent implements AfterViewInit, OnDestroy {
+  ngAfterViewInit(): void {
+    const chart = init('chart');
+
+    chart?.applyNewData([
+      { close: 4976.16, high: 4977.99, low: 4970.12, open: 4972.89, timestamp: 1587660000000, volume: 204 },
+      { close: 4977.33, high: 4979.94, low: 4971.34, open: 4973.20, timestamp: 1587660060000, volume: 194 },
+      { close: 4977.93, high: 4977.93, low: 4974.20, open: 4976.53, timestamp: 1587660120000, volume: 197 },
+      { close: 4966.77, high: 4968.53, low: 4962.20, open: 4963.88, timestamp: 1587660180000, volume: 28 },
+      { close: 4961.56, high: 4972.61, low: 4961.28, open: 4961.28, timestamp: 1587660240000, volume: 184 },
+      { close: 4964.19, high: 4964.74, low: 4961.42, open: 4961.64, timestamp: 1587660300000, volume: 191 },
+      { close: 4968.93, high: 4972.70, low: 4964.55, open: 4966.96, timestamp: 1587660360000, volume: 105 },
+      { close: 4979.31, high: 4979.61, low: 4973.99, open: 4977.06, timestamp: 1587660420000, volume: 35 },
+      { close: 4977.02, high: 4981.66, low: 4975.14, open: 4981.66, timestamp: 1587660480000, volume: 135 },
+      { close: 4985.09, high: 4988.62, low: 4980.30, open: 4986.72, timestamp: 1587660540000, volume: 76 }
+    ]);
+  }
+
+  ngOnDestroy(): void {
+    dispose('chart');
+  }
+}
jsx
import { useEffect } from 'preact/hooks'
+import { init, dispose } from 'klinecharts'
+
+export default () => {
+  useEffect(() => {
+    const chart = init('chart')
+
+    chart.applyNewData([
+      { close: 4976.16, high: 4977.99, low: 4970.12, open: 4972.89, timestamp: 1587660000000, volume: 204 },
+      { close: 4977.33, high: 4979.94, low: 4971.34, open: 4973.20, timestamp: 1587660060000, volume: 194 },
+      { close: 4977.93, high: 4977.93, low: 4974.20, open: 4976.53, timestamp: 1587660120000, volume: 197 },
+      { close: 4966.77, high: 4968.53, low: 4962.20, open: 4963.88, timestamp: 1587660180000, volume: 28 },
+      { close: 4961.56, high: 4972.61, low: 4961.28, open: 4961.28, timestamp: 1587660240000, volume: 184 },
+      { close: 4964.19, high: 4964.74, low: 4961.42, open: 4961.64, timestamp: 1587660300000, volume: 191 },
+      { close: 4968.93, high: 4972.70, low: 4964.55, open: 4966.96, timestamp: 1587660360000, volume: 105 },
+      { close: 4979.31, high: 4979.61, low: 4973.99, open: 4977.06, timestamp: 1587660420000, volume: 35 },
+      { close: 4977.02, high: 4981.66, low: 4975.14, open: 4981.66, timestamp: 1587660480000, volume: 135 },
+      { close: 4985.09, high: 4988.62, low: 4980.30, open: 4986.72, timestamp: 1587660540000, volume: 76 }
+    ])
+
+    return () => {
+      dispose('chart')
+    }
+  }, [])
+
+  return <div id="chart" style={{ width: 600, height: 600 }}/>
+}
jsx
import { onMount, onCleanup } from 'solid-js'
+import { init, dispose } from 'klinecharts'
+
+export default () => {
+  onMount(() => {
+    const chart = init('chart')
+
+    chart.applyNewData([
+      { close: 4976.16, high: 4977.99, low: 4970.12, open: 4972.89, timestamp: 1587660000000, volume: 204 },
+      { close: 4977.33, high: 4979.94, low: 4971.34, open: 4973.20, timestamp: 1587660060000, volume: 194 },
+      { close: 4977.93, high: 4977.93, low: 4974.20, open: 4976.53, timestamp: 1587660120000, volume: 197 },
+      { close: 4966.77, high: 4968.53, low: 4962.20, open: 4963.88, timestamp: 1587660180000, volume: 28 },
+      { close: 4961.56, high: 4972.61, low: 4961.28, open: 4961.28, timestamp: 1587660240000, volume: 184 },
+      { close: 4964.19, high: 4964.74, low: 4961.42, open: 4961.64, timestamp: 1587660300000, volume: 191 },
+      { close: 4968.93, high: 4972.70, low: 4964.55, open: 4966.96, timestamp: 1587660360000, volume: 105 },
+      { close: 4979.31, high: 4979.61, low: 4973.99, open: 4977.06, timestamp: 1587660420000, volume: 35 },
+      { close: 4977.02, high: 4981.66, low: 4975.14, open: 4981.66, timestamp: 1587660480000, volume: 135 },
+      { close: 4985.09, high: 4988.62, low: 4980.30, open: 4986.72, timestamp: 1587660540000, volume: 76 }
+    ])
+  })
+
+  onCleanup(() => {
+    // 销毁图表
+    dispose('chart')
+  })
+
+  return <div id="chart" style={{ width: '600px', height: '600px' }}/>
+}
svelte
<div id="chart" style="width:600px;height:600px"/>
+
+<script>
+import { onMount, onDestroy } from 'svelte'
+
+onMount(() => {
+  const chart = init('chart')
+
+  chart.applyNewData([
+    { close: 4976.16, high: 4977.99, low: 4970.12, open: 4972.89, timestamp: 1587660000000, volume: 204 },
+    { close: 4977.33, high: 4979.94, low: 4971.34, open: 4973.20, timestamp: 1587660060000, volume: 194 },
+    { close: 4977.93, high: 4977.93, low: 4974.20, open: 4976.53, timestamp: 1587660120000, volume: 197 },
+    { close: 4966.77, high: 4968.53, low: 4962.20, open: 4963.88, timestamp: 1587660180000, volume: 28 },
+    { close: 4961.56, high: 4972.61, low: 4961.28, open: 4961.28, timestamp: 1587660240000, volume: 184 },
+    { close: 4964.19, high: 4964.74, low: 4961.42, open: 4961.64, timestamp: 1587660300000, volume: 191 },
+    { close: 4968.93, high: 4972.70, low: 4964.55, open: 4966.96, timestamp: 1587660360000, volume: 105 },
+    { close: 4979.31, high: 4979.61, low: 4973.99, open: 4977.06, timestamp: 1587660420000, volume: 35 },
+    { close: 4977.02, high: 4981.66, low: 4975.14, open: 4981.66, timestamp: 1587660480000, volume: 135 },
+    { close: 4985.09, high: 4988.62, low: 4980.30, open: 4986.72, timestamp: 1587660540000, volume: 76 }
+  ])
+})
+
+onDestroy(() => {
+  dispose('chart')
+})
+</script>
html
<!DOCTYPE html>
+<html lang="cn" >
+  <head>
+    <meta charset="utf-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1" />
+    <meta name="theme-color" content="#000000" />
+    <meta name="keywords" content="Quick Start"/>
+    <meta name="description" content="Quick Start"/>
+    <title>Quick Start</title>
+    <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/klinecharts/dist/umd/klinecharts.min.js"></script>
+  </head>
+  <body>
+    <div id="chart" style="width:600px;height:600px"></div>
+    <script>
+      window.onload = function () {
+        var chart = klinecharts.init('chart')
+
+        chart.applyNewData([
+          { close: 4976.16, high: 4977.99, low: 4970.12, open: 4972.89, timestamp: 1587660000000, volume: 204 },
+          { close: 4977.33, high: 4979.94, low: 4971.34, open: 4973.20, timestamp: 1587660060000, volume: 194 },
+          { close: 4977.93, high: 4977.93, low: 4974.20, open: 4976.53, timestamp: 1587660120000, volume: 197 },
+          { close: 4966.77, high: 4968.53, low: 4962.20, open: 4963.88, timestamp: 1587660180000, volume: 28 },
+          { close: 4961.56, high: 4972.61, low: 4961.28, open: 4961.28, timestamp: 1587660240000, volume: 184 },
+          { close: 4964.19, high: 4964.74, low: 4961.42, open: 4961.64, timestamp: 1587660300000, volume: 191 },
+          { close: 4968.93, high: 4972.70, low: 4964.55, open: 4966.96, timestamp: 1587660360000, volume: 105 },
+          { close: 4979.31, high: 4979.61, low: 4973.99, open: 4977.06, timestamp: 1587660420000, volume: 35 },
+          { close: 4977.02, high: 4981.66, low: 4975.14, open: 4981.66, timestamp: 1587660480000, volume: 135 },
+          { close: 4985.09, high: 4988.62, low: 4980.30, open: 4986.72, timestamp: 1587660540000, volume: 76 }
+        ])
+      }
+    </script>
+  </body>
+</html>

这样你的第一个图表就创建完成了。

+ + + + \ No newline at end of file diff --git a/guide/styles.html b/guide/styles.html new file mode 100644 index 0000000..f05cda9 --- /dev/null +++ b/guide/styles.html @@ -0,0 +1,576 @@ + + + + + + 🎨 样式配置 | KLineChart + + + + + + + + + + + + + + + + +
Skip to content

🎨 样式配置

图表上看到的不管是点还是线,基本都可以自定义样式。可以通过图表方法init(ds, options)或者图表实例方法setStyles(styles)进行更改。

图解说明

1 grid.horizontal2 grid.vertical3 candle.bar4 candle.candle.priceMark.last.line5 candle.candle.priceMark.last.text6 candle.candle.priceMark.high7 candle.candle.priceMark.low8 candle.candle.tooltip9 indicator.ohlc10 indicator.lastValueMark11 indicator.tooltip12 xAxis.axisLine13 xAxis.tickLine14 xAxis.tickText15 yAxis.axisLine16 yAxis.tickLine17 yAxis.tickText18 separator19 crosshair.horizontal.line20 crosshair.horizontal.text21 crosshair.vertical.line22 crosshair.vertical.text23 overlay

默认完整配置

javascript
{
+  // 网格线
+  grid: {
+    show: true,
+    horizontal: {
+      show: true,
+      size: 1,
+      color: '#EDEDED',
+      style: 'dashed',
+      dashedValue: [2, 2]
+    },
+    vertical: {
+      show: true,
+      size: 1,
+      color: '#EDEDED',
+      style: 'dashed',
+      dashedValue: [2, 2]
+    }
+  },
+  // 蜡烛图
+  candle: {
+    // 蜡烛图类型 'candle_solid'|'candle_stroke'|'candle_up_stroke'|'candle_down_stroke'|'ohlc'|'area'
+    type: 'candle_solid',
+    // 蜡烛柱
+    bar: {
+      upColor: '#2DC08E',
+      downColor: '#F92855',
+      noChangeColor: '#888888',
+      upBorderColor: '#2DC08E',
+      downBorderColor: '#F92855',
+      noChangeBorderColor: '#888888',
+      upWickColor: '#2DC08E',
+      downWickColor: '#F92855',
+      noChangeWickColor: '#888888'
+    },
+    // 面积图
+    area: {
+      lineSize: 2,
+      lineColor: '#2196F3',
+      value: 'close',
+      smooth: false,
+      backgroundColor: [{
+        offset: 0,
+        color: 'rgba(33, 150, 243, 0.01)'
+      }, {
+        offset: 1,
+        color: 'rgba(33, 150, 243, 0.2)'
+      }],
+      point: {
+        show: true,
+        color: blue,
+        radius: 4,
+        rippleColor: getAlphaBlue(0.3),
+        rippleRadius: 8,
+        animation: true,
+        animationDuration: 1000
+      }
+    },
+    priceMark: {
+      show: true,
+      // 最高价标记
+      high: {
+        show: true,
+        color: '#D9D9D9',
+        textOffset: 5,
+        textSize: 10,
+        textFamily: 'Helvetica Neue',
+        textWeight: 'normal'
+      },
+      // 最低价标记
+      low: {
+        show: true,
+        color: '#D9D9D9',
+        textOffset: 5,
+        textSize: 10,
+        textFamily: 'Helvetica Neue',
+        textWeight: 'normal',
+      },
+      // 最新价标记
+      last: {
+        show: true,
+        upColor: '#2DC08E',
+        downColor: '#F92855',
+        noChangeColor: '#888888',
+        line: {
+          show: true,
+          // 'solid' | 'dashed'
+          style: 'dashed',
+          dashedValue: [4, 4],
+          size: 1
+        },
+        text: {
+          show: true,
+          // 'fill' | 'stroke' | 'stroke_fill'
+          style: 'fill',
+          size: 12,
+          paddingLeft: 4,
+          paddingTop: 4,
+          paddingRight: 4,
+          paddingBottom: 4,
+          // 'solid' | 'dashed'
+          borderStyle: 'solid',
+          borderSize: 0,
+          borderColor: 'transparent',
+          borderDashedValue: [2, 2],
+          color: '#FFFFFF',
+          family: 'Helvetica Neue',
+          weight: 'normal',
+          borderRadius: 2
+        }
+      }
+    },
+    // 提示
+    tooltip: {
+      offsetLeft: 4,
+      offsetTop: 6,
+      offsetRight: 4,
+      offsetBottom: 6,
+      // 'always' | 'follow_cross' | 'none'
+      showRule: 'always',
+      // 'standard' | 'rect'
+      showType: 'standard',
+      // 自定义显示,可以是回调方法也可以是数组,当是一个方法时,需要返回一个数组
+      // 数组的子项类型为 { title, value }
+      // title和value可以是字符串或者对象,对象类型为 { text, color }
+      // title 或者 title.text 可以是国际化的 key,
+      // value 或者 value.text 支持字符串模版
+      // 例如:想显示时间,开盘和收盘,配置[{ title: 'time', value: '{time}' }, { title: 'open', value: '{open}' }, { title: 'close', value: '{close}' }]
+      custom: [
+        { title: 'time', value: '{time}' },
+        { title: 'open', value: '{open}' },
+        { title: 'high', value: '{high}' },
+        { title: 'low', value: '{low}' },
+        { title: 'close', value: '{close}' },
+        { title: 'volume', value: '{volume}' }
+      ],
+      defaultValue: 'n/a',
+      rect: {
+        // 'fixed' | 'pointer'
+        position: 'fixed',
+        paddingLeft: 4,
+        paddingRight: 4,
+        paddingTop: 4,
+        paddingBottom: 4,
+        offsetLeft: 4,
+        offsetTop: 4,
+        offsetRight: 4,
+        offsetBottom: 4,
+        borderRadius: 4,
+        borderSize: 1,
+        borderColor: '#f2f3f5',
+        color: '#FEFEFE'
+      },
+      text: {
+        size: 12,
+        family: 'Helvetica Neue',
+        weight: 'normal',
+        color: '#D9D9D9',
+        marginLeft: 8,
+        marginTop: 4,
+        marginRight: 8,
+        marginBottom: 4
+      },
+      // 示例:
+      // [{
+      //   id: 'icon_id',
+      //   position: 'left', // 类型有'left','middle','right'
+      //   marginLeft: 8,
+      //   marginTop: 6,
+      //   marginRight: 0,
+      //   marginBottom: 0,
+      //   paddingLeft: 1,
+      //   paddingTop: 1,
+      //   paddingRight: 1,
+      //   paddingBottom: 1,
+      //   icon: '\ue900',
+      //   fontFamily: 'iconfont',
+      //   size: 12,
+      //   color: '#76808F',
+      //   backgroundColor: 'rgba(33, 150, 243, 0.2)',
+      //   activeBackgroundColor: 'rgba(33, 150, 243, 0.4)'
+      // }]
+      icons: []
+    }
+  },
+  // 技术指标
+  indicator: {
+    ohlc: {
+      upColor: 'rgba(45, 192, 142, .7)',
+      downColor: 'rgba(249, 40, 85, .7)',
+      noChangeColor: '#888888'
+    },
+    bars: [{
+      // 'fill' | 'stroke' | 'stroke_fill'
+      style: 'fill',
+      // 'solid' | 'dashed'
+      borderStyle: 'solid',
+      borderSize: 1,
+      borderDashedValue: [2, 2],
+      upColor: 'rgba(45, 192, 142, .7)',
+      downColor: 'rgba(249, 40, 85, .7)',
+      noChangeColor: '#888888'
+    }],
+    lines: [
+      {
+        // 'solid' | 'dashed'
+        style: 'solid',
+        smooth: false,
+        size: 1,
+        dashedValue: [2, 2],
+        color: '#FF9600'
+      }, {
+        style: 'solid',
+        smooth: false,
+        size: 1,
+        dashedValue: [2, 2],
+        color: '#935EBD'
+      }, {
+        style: 'solid',
+        smooth: false,
+        size: 1,
+        dashedValue: [2, 2],
+        color: '#2196F3'
+      }, {
+        style: 'solid',
+        smooth: false,
+        size: 1,
+        dashedValue: [2, 2],
+        color: '#E11D74'
+      }, {
+        style: 'solid',
+        smooth: false,
+        size: 1,
+        dashedValue: [2, 2],
+        color: '#01C5C4'
+      }
+    ],
+    circles: [{
+      // 'fill' | 'stroke' | 'stroke_fill'
+      style: 'fill',
+      // 'solid' | 'dashed'
+      borderStyle: 'solid',
+      borderSize: 1,
+      borderDashedValue: [2, 2],
+      upColor: 'rgba(45, 192, 142, .7)',
+      downColor: 'rgba(249, 40, 85, .7)',
+      noChangeColor: '#888888'
+    }],
+    // 最新值标记
+    lastValueMark: {
+      show: false,
+      text: {
+        show: false,
+        // 'fill' | 'stroke' | 'stroke_fill'
+        style: 'fill',
+        color: '#FFFFFF',
+        size: 12,
+        family: 'Helvetica Neue',
+        weight: 'normal',
+        // 'solid' | 'dashed'
+        borderStyle: 'solid',
+        borderSize: 1,
+        borderDashedValue: [2, 2],
+        paddingLeft: 4,
+        paddingTop: 4,
+        paddingRight: 4,
+        paddingBottom: 4,
+        borderRadius: 2
+      }
+    },
+    // 提示
+    tooltip: {
+      offsetLeft: 4,
+      offsetTop: 6,
+      offsetRight: 4,
+      offsetBottom: 6,
+      // 'always' | 'follow_cross' | 'none'
+      showRule: 'always',
+      // 'standard' | 'rect'
+      showType: 'standard',
+      showName: true,
+      showParams: true,
+      defaultValue: 'n/a',
+      text: {
+        size: 12,
+        family: 'Helvetica Neue',
+        weight: 'normal',
+        color: '#D9D9D9',
+        marginTop: 4,
+        marginRight: 8,
+        marginBottom: 4,
+        marginLeft: 8
+      },
+      // 示例:
+      // [{
+      //   id: 'icon_id',
+      //   position: 'left', // 类型有'left','middle','right'
+      //   marginLeft: 8,
+      //   marginTop: 6,
+      //   marginRight: 0,
+      //   marginBottom: 0,
+      //   paddingLeft: 1,
+      //   paddingTop: 1,
+      //   paddingRight: 1,
+      //   paddingBottom: 1,
+      //   icon: '\ue900',
+      //   fontFamily: 'iconfont',
+      //   size: 12,
+      //   color: '#76808F',
+      //   backgroundColor: 'rgba(33, 150, 243, 0.2)',
+      //   activeBackgroundColor: 'rgba(33, 150, 243, 0.4)'
+      // }]
+      icons: []
+    }
+  },
+  // x轴
+  xAxis: {
+    show: true,
+    size: 'auto',
+    // x轴线
+    axisLine: {
+      show: true,
+      color: '#888888',
+      size: 1
+    },
+    // x轴分割文字
+    tickText: {
+      show: true,
+      color: '#D9D9D9',
+      family: 'Helvetica Neue',
+      weight: 'normal',
+      size: 12,
+      marginStart: 4,
+      marginEnd: 4
+    },
+    // x轴分割线
+    tickLine: {
+      show: true,
+      size: 1,
+      length: 3,
+      color: '#888888'
+    }
+  },
+  // y轴
+  yAxis: {
+    show: true,
+    size: 'auto',
+    // 'left' | 'right'
+    position: 'right',
+    // 'normal' | 'percentage' | 'log'
+    type: 'normal',
+    inside: false,
+    reverse: false,
+    // y轴线
+    axisLine: {
+      show: true,
+      color: '#888888',
+      size: 1
+    },
+    // x轴分割文字
+    tickText: {
+      show: true,
+      color: '#D9D9D9',
+      family: 'Helvetica Neue',
+      weight: 'normal',
+      size: 12,
+      marginStart: 4,
+      marginEnd: 4
+    },
+    // x轴分割线
+    tickLine: {
+      show: true,
+      size: 1,
+      length: 3,
+      color: '#888888'
+    }
+  },
+  // 图表之间的分割线
+  separator: {
+    size: 1,
+    color: '#888888',
+    fill: true,
+    activeBackgroundColor: 'rgba(230, 230, 230, .15)'
+  },
+  // 十字光标
+  crosshair: {
+    show: true,
+    // 十字光标水平线及文字
+    horizontal: {
+      show: true,
+      line: {
+        show: true,
+        // 'solid'|'dashed'
+        style: 'dashed',
+        dashedValue: [4, 2],
+        size: 1,
+        color: '#888888'
+      },
+      text: {
+        show: true,
+        // 'fill' | 'stroke' | 'stroke_fill'
+        style: 'fill',
+        color: '#FFFFFF',
+        size: 12,
+        family: 'Helvetica Neue',
+        weight: 'normal',
+        // 'solid' | 'dashed'
+        borderStyle: 'solid',
+        borderDashedValue: [2, 2],
+        borderSize: 1,
+        borderColor: '#686D76',
+        borderRadius: 2,
+        paddingLeft: 4,
+        paddingRight: 4,
+        paddingTop: 4,
+        paddingBottom: 4,
+        backgroundColor: '#686D76'
+      }
+    },
+    // 十字光标垂直线及文字
+    vertical: {
+      show: true,
+      line: {
+        show: true,
+        // 'solid'|'dashed'
+        style: 'dashed',
+        dashedValue: [4, 2],
+        size: 1,
+        color: '#888888'
+      },
+      text: {
+        show: true,
+        // 'fill' | 'stroke' | 'stroke_fill'
+        style: 'fill',
+        color: '#FFFFFF',
+        size: 12,
+        family: 'Helvetica Neue',
+        weight: 'normal',
+        // 'solid' | 'dashed'
+        borderStyle: 'solid',
+        borderDashedValue: [2, 2],
+        borderSize: 1,
+        borderColor: '#686D76',
+        borderRadius: 2,
+        paddingLeft: 4,
+        paddingRight: 4,
+        paddingTop: 4,
+        paddingBottom: 4,
+        backgroundColor: '#686D76'
+      }
+    }
+  },
+  // 覆盖物
+  overlay: {
+    point: {
+      color: '#1677FF',
+      borderColor: 'rgba(22, 119, 255, 0.35)',
+      borderSize: 1,
+      radius: 5,
+      activeColor: '#1677FF',
+      activeBorderColor: 'rgba(22, 119, 255, 0.35)',
+      activeBorderSize: 3,
+      activeRadius: 5
+    },
+    line: {
+      // 'solid' | 'dashed'
+      style: 'solid',
+      smooth: false,
+      color: '#1677FF',
+      size: 1,
+      dashedValue: [2, 2]
+    },
+    rect: {
+      // 'fill' | 'stroke' | 'stroke_fill'
+      style: 'fill',
+      color: 'rgba(22, 119, 255, 0.25)',
+      borderColor: '#1677FF',
+      borderSize: 1,
+      borderRadius: 0,
+      // 'solid' | 'dashed'
+      borderStyle: 'solid',
+      borderDashedValue: [2, 2]
+    },
+    polygon: {
+      // 'fill' | 'stroke' | 'stroke_fill'
+      style: 'fill',
+      color: '#1677FF',
+      borderColor: '#1677FF',
+      borderSize: 1,
+      // 'solid' | 'dashed'
+      borderStyle: 'solid',
+      borderDashedValue: [2, 2]
+    },
+    circle: {
+      // 'fill' | 'stroke' | 'stroke_fill'
+      style: 'fill',
+      color: 'rgba(22, 119, 255, 0.25)',
+      borderColor: '#1677FF',
+      borderSize: 1,
+      // 'solid' | 'dashed'
+      borderStyle: 'solid',
+      borderDashedValue: [2, 2]
+    },
+    arc: {
+      // 'solid' | 'dashed'
+      style: 'solid',
+      color: '#1677FF',
+      size: 1,
+      dashedValue: [2, 2]
+    },
+    text: {
+      // 'fill' | 'stroke' | 'stroke_fill'
+      style: 'fill',
+      color: '#FFFFFF',
+      size: 12,
+      family: 'Helvetica Neue',
+      weight: 'normal',
+      // 'solid' | 'dashed'
+      borderStyle: 'solid',
+      borderDashedValue: [2, 2],
+      borderSize: 0,
+      borderRadius: 2,
+      borderColor: '#1677FF',
+      paddingLeft: 0,
+      paddingRight: 0,
+      paddingTop: 0,
+      paddingBottom: 0,
+      backgroundColor: 'transparent'
+    },
+    rectText: {
+      // 'fill' | 'stroke' | 'stroke_fill'
+      style: 'fill',
+      color: '#FFFFFF',
+      size: 12,
+      family: 'Helvetica Neue',
+      weight: 'normal',
+      // 'solid' | 'dashed'
+      borderStyle: 'solid',
+      borderDashedValue: [2, 2],
+      borderSize: 1,
+      borderRadius: 2,
+      borderColor: '#1677FF',
+      paddingLeft: 4,
+      paddingRight: 4,
+      paddingTop: 4,
+      paddingBottom: 4,
+      backgroundColor: '#1677FF'
+    }
+  }
+}
+ + + + \ No newline at end of file diff --git a/guide/v8-to-v9.html b/guide/v8-to-v9.html new file mode 100644 index 0000000..5c72183 --- /dev/null +++ b/guide/v8-to-v9.html @@ -0,0 +1,26 @@ + + + + + + 🛠️ 从 V8 到 V9 | KLineChart + + + + + + + + + + + + + + + +
Skip to content

🛠️ 从 V8 到 V9

本文档将帮助你从 klinecharts 8.x 版本升级到 klinecharts 9.x 版本,如果你是 7.x 或者更老的版本,请先参考之前的升级文档升级到 8.x。

引入调整

不再区分klinecharts/index.blankklinecharts/index.simple,请统一使用import { ... } from 'klinecharts'

设计调整

shapeannotationtag合并成overlay,详情请查阅覆盖物

样式配置调整

  • 所有线的样式选项dash,更改为dasheddashValue更改为dashedValue
  • candle.tooltip.labelscandle.tooltip.values,合并为candle.tooltip.custom
  • xAxis.height变更为xAxis.sizexAxis.tickText.paddingTop变更为xAxis.tickText.marginStartxAxis.tickText.paddingBottom变更为xAxis.tickText.marginEnd
  • yAxis.height变更为yAxis.sizeyAxis.tickText.paddingTop变更为yAxis.tickText.marginStartyAxis.tickText.paddingBottom变更为yAxis.tickText.marginEnd
  • technicalIndicator.bar变更为indicator.barstechnicalIndicator.line变更为indicator.linestechnicalIndicator.circle变更为indicator.circles
  • 删除shapeannotationtag,请用overlay代替。

API调整

图表API

  • extension.addTechnicalIndicatorTemplate(template)变更为registerIndicator(template)
  • 删除extension.addShapeTemplate(template),请用registerOverlay(template)代替。

实例API

  • getDom({ paneId, position })变更为getDom(paneId, position),参数position选项变更为rootmainyAxis
  • getWidth()getHeight()合并成一个方法getSize(paneId, position)
  • setStyleOptions(styles)变更为setStyles(styles)
  • getStyleOptions()变更为getStyles()
  • setOffsetRightSpace(space)变更为setOffsetRightDistance(distance)
  • createTechnicalIndicator(value, isStack, paneOptions)变更为createIndicator(value, isStack, paneOptions)
  • overrideTechnicalIndicator(override, paneId)变更为overrideIndicator(override, paneId)
  • getTechnicalIndicatorByPaneId(paneId, name)变更为getIndicatorByPaneId(paneId, name)
  • removeTechnicalIndicator(paneId, name)变更为removeIndicator(paneId, name)
  • subscribeAction(type, callback)unsubscribeAction(type, callback),参数type选项变更为onZoomonScrollonCrosshairChangeonVisibleRangeChangeonPaneDrag
  • convertToPixel(value, finder)convertFromPixel(coordinate, finder),参数finder.absoluteYAxis变更为finder.absolute
  • 删除createShape(value, paneId)createAnnotation(annotation, paneId)createTag(tag, paneId),请用createOverlay(value, paneId)代替。
  • 删除removeShape(id)removeAnnotation(paneId, points)removeTag(paneId, tagId),请用removeOverlay(id)代替。
  • 删除setShapeOptions(options),请用overrideOverlay(override)代替。
  • 删除createHtml(html, paneId)removeHtml(paneId, htmlId),请通过getDom(paneId, position)获取到对应的dom后操作。
  • 删除getTechnicalIndicatorByPaneId(paneId, name)

图形辅助API

  • 所有的API都迁移至klinecharts.utils

自定义技术指标调整

  • 属性plots变更为figures,子项方法colorisStrokeisDashed合并成styles
  • 方法regeneratePlots(params)变更为regenerateFigures(params)
  • 方法calcTechnicalIndicator(kLineDataList, options)变更为calc(kLineDataList, indicator)
  • 方法createTooltipDataSource({ dataSource, viewport, crosshair, technicalIndicator, xAxis,yAxis, defaultStyles })变更为createTooltipDataSource({ kLineDataList, indicator, visibleRange, bounding, crosshair, defaultStyles, xAxis, yAxis }),返回值由[{ title: 'xxx', value: 'xxx', color: 'xxx' }, ...]变更为{ name: 'xxx', calcParamsText: 'xxx', values: [{ title: 'xxx', value: 'xxx', color: 'xxx' }, ...] }
  • 方法render({ ctx, dataSource, viewport, styles,xAxis, yAxis })变更为draw({ ctx, kLineDataList, indicator, visibleRange, bounding, barSpace, defaultStyles, xAxis, yAxis })
  • 删除属性shouldCheckParamCount
+ + + + \ No newline at end of file diff --git a/hashmap.json b/hashmap.json new file mode 100644 index 0000000..463744d --- /dev/null +++ b/hashmap.json @@ -0,0 +1 @@ +{"customize.md":"7QgzgixA","en-us_customize.md":"CeeQpRWl","en-us_guide_changelog.md":"Dxcvdcef","en-us_guide_chart-api.md":"BkDZq4IT","en-us_guide_custom-axis.md":"BGiVLvU-","en-us_guide_data-source.md":"Csc1OS-q","en-us_guide_environment.md":"DJIzP9Pa","en-us_guide_figure.md":"ot49wrDt","en-us_guide_hot-key.md":"XstEzyUM","en-us_guide_i18n.md":"Bbw6zY8t","en-us_guide_indicator.md":"Dawr8_Vq","en-us_guide_instance-api.md":"BjbPhLfD","en-us_guide_introduction.md":"CsfoCQo0","en-us_guide_overlay.md":"fHTVoVvf","en-us_guide_quick-start.md":"DjE452b9","en-us_guide_styles.md":"IMTByYQY","en-us_guide_v8-to-v9.md":"ddEqE0Vn","en-us_index.md":"CdmPl99x","en-us_more_faq.md":"DQiAekkc","en-us_more_feedback.md":"CL4Qb9kJ","en-us_more_local-development.md":"BR-TqRbK","en-us_sample_axis.md":"45GltXMK","en-us_sample_basic.md":"DHIM9tgv","en-us_sample_candle-type.md":"pcvHIi0v","en-us_sample_data.md":"q_cJvvki","en-us_sample_i18n.md":"DRCsxcNb","en-us_sample_indicator.md":"CoOSTif6","en-us_sample_overlay.md":"rL__HVok","en-us_sample_theme.md":"Ci6f1PhO","en-us_sample_timezone.md":"eq1R28dC","en-us_sample_tooltip.md":"3hv073Yw","en-us_sponsor.md":"B7kPf9Ed","guide_changelog.md":"Dr9EvcMG","guide_chart-api.md":"BO0EApnm","guide_custom-axis.md":"CclwillF","guide_data-source.md":"BBHuBdZH","guide_environment.md":"BVezHuOo","guide_figure.md":"YALxk5fQ","guide_hot-key.md":"BCqBjXEe","guide_i18n.md":"BaWkQ9Ke","guide_indicator.md":"Bx8Xb2xL","guide_instance-api.md":"CzSDI5iq","guide_introduction.md":"CeKWbWWZ","guide_overlay.md":"DcZru8Cd","guide_quick-start.md":"CY5OW8NL","guide_styles.md":"BMit2YwO","guide_v8-to-v9.md":"Djsg7IqF","index.md":"DvoAa-an","more_faq.md":"jD8drqKw","more_feedback.md":"0APC3uzY","more_local-development.md":"CbDSmSMM","sample_axis.md":"DL4QJR4z","sample_basic.md":"9glQKJaK","sample_candle-type.md":"DSMOj8ZC","sample_data.md":"B-kDfmvb","sample_i18n.md":"1BTTNsoj","sample_indicator.md":"ChL3VIyk","sample_overlay.md":"rtXhvoMF","sample_theme.md":"B-qLFv3p","sample_timezone.md":"DYu_qbRI","sample_tooltip.md":"BP4CrYBq","sponsor.md":"SLwybD6_"} diff --git a/images/alipay_qr_code.png b/images/alipay_qr_code.png new file mode 100644 index 0000000..db2c913 Binary files /dev/null and b/images/alipay_qr_code.png differ diff --git a/images/box.png b/images/box.png new file mode 100644 index 0000000..4b14e01 Binary files /dev/null and b/images/box.png differ diff --git a/images/expand.png b/images/expand.png new file mode 100644 index 0000000..9b02c24 Binary files /dev/null and b/images/expand.png differ diff --git a/images/logo.svg b/images/logo.svg new file mode 100644 index 0000000..ae5bd79 --- /dev/null +++ b/images/logo.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/images/logo_hero.svg b/images/logo_hero.svg new file mode 100644 index 0000000..f3fe907 --- /dev/null +++ b/images/logo_hero.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/images/module.png b/images/module.png new file mode 100644 index 0000000..d428179 Binary files /dev/null and b/images/module.png differ diff --git a/images/qq_group_qr_code.png b/images/qq_group_qr_code.png new file mode 100644 index 0000000..97f4e1c Binary files /dev/null and b/images/qq_group_qr_code.png differ diff --git a/images/rocket.png b/images/rocket.png new file mode 100644 index 0000000..8fe85a3 Binary files /dev/null and b/images/rocket.png differ diff --git a/images/sponsors/Northstar.png b/images/sponsors/Northstar.png new file mode 100644 index 0000000..bd975cb Binary files /dev/null and b/images/sponsors/Northstar.png differ diff --git a/images/sponsors/flameOnYou.jpg b/images/sponsors/flameOnYou.jpg new file mode 100644 index 0000000..5e545d5 Binary files /dev/null and b/images/sponsors/flameOnYou.jpg differ diff --git a/images/style.jpg b/images/style.jpg new file mode 100644 index 0000000..c1b3a27 Binary files /dev/null and b/images/style.jpg differ diff --git a/images/wechat.jpeg b/images/wechat.jpeg new file mode 100644 index 0000000..118bfbb Binary files /dev/null and b/images/wechat.jpeg differ diff --git a/images/wechat_pay_qr_code.png b/images/wechat_pay_qr_code.png new file mode 100644 index 0000000..9511639 Binary files /dev/null and b/images/wechat_pay_qr_code.png differ diff --git a/index.html b/index.html new file mode 100644 index 0000000..048e775 --- /dev/null +++ b/index.html @@ -0,0 +1,26 @@ + + + + + + 可高度自定义的专业级轻量金融图表 | KLineChart + + + + + + + + + + + + + + + +
Skip to content

KLineChart

可高度自定义的专业级轻量金融图表

简单易用,轻量流畅,适用场景丰富的 Web 前端金融图表。

KLineChart
+ + + + \ No newline at end of file diff --git a/more/faq.html b/more/faq.html new file mode 100644 index 0000000..0a25d39 --- /dev/null +++ b/more/faq.html @@ -0,0 +1,30 @@ + + + + + + 🙋 常见问题 | KLineChart + + + + + + + + + + + + + + + +
Skip to content

🙋 常见问题

初始化图表后,只能看到一条线,是怎么回事?

图表总是会填充容器,检查一下容器是否有高度。

蜡烛柱显示趋近于一条线,看不到波动,怎么办?

图表默认价格精度为两位小数,调用setPriceVolumePrecision(pricePrecision, volumePrecision)设置下精度。

分时图怎么创建?

通过样式设置。

javascript
chart.setStyles({
+  candle: {
+    type: 'area',
+  },
+});

内置的技术指标,计算出来的数据不是想要的,怎么办?

可以通过图表方法createIndicator或者overrideIndicator重写calc即可。

想创建一个内置技术指标之外的指标,怎么办?

图表支持自定义技术指标,详情参阅技术指标

想标记一下买卖点,该怎么做?

可以使用覆盖物,内置的覆盖物有一个simpleAnnotation,用图表api创建即可createOverlay({ name: 'simpleAnnotation', ... }, paneId)

+ + + + \ No newline at end of file diff --git a/more/feedback.html b/more/feedback.html new file mode 100644 index 0000000..e145638 --- /dev/null +++ b/more/feedback.html @@ -0,0 +1,27 @@ + + + + + + 💬 反馈和共建 | KLineChart + + + + + + + + + + + + + + + + +
Skip to content

💬 反馈和共建

Github

Telegram

https://t.me/+098syuQtzI0yNzll

微信讨论群

扫一扫,添加开发者,备注『 KLineChart 』,加入群聊。

+ + + + \ No newline at end of file diff --git a/more/local-development.html b/more/local-development.html new file mode 100644 index 0000000..a4f5ccb --- /dev/null +++ b/more/local-development.html @@ -0,0 +1,28 @@ + + + + + + 本地开发 | KLineChart + + + + + + + + + + + + + + + + +
Skip to content

本地开发

摘要

如果你看到此处,你可能会对改进 KLineChart 核心感兴趣。感谢 @fish2016 编写的此文档。

须知

文件目录说明

  • dist
    //  存放编译生成的文件
  • docs
    //  文档目录
  • scripts
    //  构建的脚本目录
  • src
    //  源码目录
    • common
      //  存放公共的基础的一些文件
      • utils
        //  工具类文件夹
    • component
      //  组件文件夹
    • extension
      //  可扩展的一些模块文件夹
      • figure
        //  基础图形文件夹
      • i18n
        //  国际化文件夹
      • indicator
        //  指标文件夹
      • overlay
        //  覆盖物文件夹
      • styles
        //  样式文件夹
      • x-axis
        //  x轴文件夹
      • y-axis
        //  y轴文件夹
    • pane
      //  窗口文件夹
    • store
      //  数据存储文件夹
    • view
      //  绘制模块文件夹
    • widget
      //  绘制模块集合文件夹
  • tests
    //  测试模块文件夹

模块依赖关系

上图是按照下层作为上层的容器,从上到下列出图表模块层级。

  • Figure 基本图形,如圆(circle),多边形(polygon),矩形(rect),文本(text)等。
  • ViewChartStore 中获取数据,进行单一业务绘制,如k线柱,面积图,网格线,十字光标线,指标等等。
  • Widget 创建canvas,将相关的 View 进行组装到一起。
  • Pane 创建dom容器,将Widget组装到一起。
  • Chart 对Pane进行管理,例如删除和添加操作,形成最终的图表。此外,还进行事件分发,对ChartStore里面的数据进行操作,根据需要通知下级组件进行更新。

开发

安装依赖

项目采用依赖 Node.js 的包管理器管理,所以需要 Node.js 环境。 你可以使用 npm,pnpm 或者 yarn 来安装依赖。

bash
# 项目根目录下执行
+npm install

NPM 执行命令说明

  • lint:运行 npm run lint 检验代码规则。
  • clean:运行 npm run clean 进行清理打包好的文件。
  • build-esm:运行 npm run build-esm 打包成 esm 模块。
  • build-cjs:运行 npm run build-cjs 打包成 commonjs 模块。
  • build-umd:dev:运行 npm run build-umd:dev 打包成 umd 开发环境模块。
  • build-umd:prod:运行 npm run build-umd:dev 打包成 umd 生产环境模块。
  • build-umd:运行 npm run build-umd 同时打包 umd 开发环境和生产环境模块。
  • build-core:运行 npm run build-core 同时打包 esm 模块,commonjs 模块,umd 开发环境和生产环境模块。
  • build-dts:运行 npm run build-dts 生成 typescript 依赖文件。
  • build:运行 npm run build 同时打包 esm 模块,commonjs 模块,umd 开发环境和生产环境模块并生成 typescript 依赖文件。

调试

此项目没有调试项目,需要创建新的工程,用 npm link 引入,或者直接引入 index.ts 入口文件的方式进行调试。你可以使用 vite 进行项目创建。

+ + + + \ No newline at end of file diff --git a/sample/axis.html b/sample/axis.html new file mode 100644 index 0000000..583be08 --- /dev/null +++ b/sample/axis.html @@ -0,0 +1,155 @@ + + + + + + 坐标轴 | KLineChart + + + + + + + + + + + + + + + + +
Skip to content

坐标轴

在新窗口中打开
js
import { init } from 'klinecharts'
+import './index.css'
+
+function genData (timestamp = new Date().getTime(), length = 800) {
+  let basePrice = 5000
+  timestamp = Math.floor(timestamp / 1000 / 60) * 60 * 1000 - length * 60 * 1000
+  const dataList = []
+  for (let i = 0; i < length; i++) {
+    const prices = []
+    for (let j = 0; j < 4; j++) {
+      prices.push(basePrice + Math.random() * 60 - 30)
+    }
+    prices.sort()
+    const open = +(prices[Math.round(Math.random() * 3)].toFixed(2))
+    const high = +(prices[3].toFixed(2))
+    const low = +(prices[0].toFixed(2))
+    const close = +(prices[Math.round(Math.random() * 3)].toFixed(2))
+    const volume = Math.round(Math.random() * 100) + 10
+    const turnover = (open + high + low + close) / 4 * volume
+    dataList.push({ timestamp, open, high,low, close, volume, turnover })
+
+    basePrice = close
+    timestamp += 60 * 1000
+  }
+  return dataList
+}
+
+const chart = init('k-line-chart')
+chart.applyNewData(genData())
+
+function setPosition (position) {
+  chart.setStyles({
+    yAxis: {
+      position
+    }
+  })
+}
+
+function setInside (inside) {
+  chart.setStyles({
+    yAxis: {
+      inside
+    }
+  })
+}
+
+function setType (type) {
+  chart.setStyles({
+    yAxis: {
+      type
+    }
+  })
+}
+
+function setReverse (reverse) {
+  chart.setStyles({
+    yAxis: {
+      reverse
+    }
+  })
+}
+
+// 以下仅仅是为了协助代码演示,在实际项目中根据情况进行调整。
+// The following is only for the purpose of assisting in code demonstration, and adjustments will be made according to the actual situation in the project.
+const container = document.getElementById('container')
+const buttonContainer = document.createElement('div')
+buttonContainer.className = 'button-container'
+
+const positions = [
+  { key: 'right', text: '右侧-Right' },
+  { key: 'left', text: '左侧-Left' }
+]
+const insideOutside = [
+  { key: false, text: '外部-Outside' },
+  { key: true, text: '内部-Inside' }
+]
+const types = [
+  { key: 'normal', text: '线性轴-Liner Axis' },
+  { key: 'percentage', text: '百分比轴-Percentage axis' },
+  { key: 'log', text: '对数轴-Logarithm axis' },
+]
+const reverse = [
+  { key: false, text: '正向-Regularity' },
+  { key: true, text: '反向-Reverse' }
+]
+positions.forEach(({ key, text }) => {
+  const button = document.createElement('button')
+  button.innerText = text
+  button.addEventListener('click', () => { setPosition(key) })
+  buttonContainer.appendChild(button)
+})
+insideOutside.forEach(({ key, text }) => {
+  const button = document.createElement('button')
+  button.innerText = text
+  button.addEventListener('click', () => { setInside(key) })
+  buttonContainer.appendChild(button)
+})
+types.forEach(({ key, text }) => {
+  const button = document.createElement('button')
+  button.innerText = text
+  button.addEventListener('click', () => { setType(key) })
+  buttonContainer.appendChild(button)
+})
+reverse.forEach(({ key, text }) => {
+  const button = document.createElement('button')
+  button.innerText = text
+  button.addEventListener('click', () => { setReverse(key) })
+  buttonContainer.appendChild(button)
+})
+container.appendChild(buttonContainer)
html
<div id="container">
+  <div id="k-line-chart" style="height:430px">
+</div>
css
.button-container {
+  display: flex;
+  flex-wrap: wrap;
+  align-items: center;
+  gap: 8px;
+  margin-top: 10px;
+  padding: 10px 22px;
+}
+
+.button-container button {
+  padding: 2px 6px;
+  background-color: #1677FF;
+  border-radius: 4px;
+  font-size: 12px;
+  color: #fff;
+  outline: none;
+  border: none;
+}
+ + + + \ No newline at end of file diff --git a/sample/basic.html b/sample/basic.html new file mode 100644 index 0000000..5b8d7d9 --- /dev/null +++ b/sample/basic.html @@ -0,0 +1,54 @@ + + + + + + 基础展示 | KLineChart + + + + + + + + + + + + + + + + +
Skip to content

基础展示

在新窗口中打开
js
import { init } from 'klinecharts'
+
+function genData (timestamp = new Date().getTime(), length = 800) {
+  let basePrice = 5000
+  timestamp = Math.floor(timestamp / 1000 / 60) * 60 * 1000 - length * 60 * 1000
+  const dataList = []
+  for (let i = 0; i < length; i++) {
+    const prices = []
+    for (let j = 0; j < 4; j++) {
+      prices.push(basePrice + Math.random() * 60 - 30)
+    }
+    prices.sort()
+    const open = +(prices[Math.round(Math.random() * 3)].toFixed(2))
+    const high = +(prices[3].toFixed(2))
+    const low = +(prices[0].toFixed(2))
+    const close = +(prices[Math.round(Math.random() * 3)].toFixed(2))
+    const volume = Math.round(Math.random() * 100) + 10
+    const turnover = (open + high + low + close) / 4 * volume
+    dataList.push({ timestamp, open, high,low, close, volume, turnover })
+
+    basePrice = close
+    timestamp += 60 * 1000
+  }
+  return dataList
+}
+
+const chart = init('k-line-chart')
+chart.applyNewData(genData())
html
<div id="k-line-chart" style="height:430px"/>
+ + + + \ No newline at end of file diff --git a/sample/candle-type.html b/sample/candle-type.html new file mode 100644 index 0000000..430cd7c --- /dev/null +++ b/sample/candle-type.html @@ -0,0 +1,101 @@ + + + + + + 蜡烛类型 | KLineChart + + + + + + + + + + + + + + + + +
Skip to content

蜡烛类型

在新窗口中打开
js
import { init } from 'klinecharts'
+import './index.css'
+
+function genData (timestamp = new Date().getTime(), length = 800) {
+  let basePrice = 5000
+  timestamp = Math.floor(timestamp / 1000 / 60) * 60 * 1000 - length * 60 * 1000
+  const dataList = []
+  for (let i = 0; i < length; i++) {
+    const prices = []
+    for (let j = 0; j < 4; j++) {
+      prices.push(basePrice + Math.random() * 60 - 30)
+    }
+    prices.sort()
+    const open = +(prices[Math.round(Math.random() * 3)].toFixed(2))
+    const high = +(prices[3].toFixed(2))
+    const low = +(prices[0].toFixed(2))
+    const close = +(prices[Math.round(Math.random() * 3)].toFixed(2))
+    const volume = Math.round(Math.random() * 100) + 10
+    const turnover = (open + high + low + close) / 4 * volume
+    dataList.push({ timestamp, open, high,low, close, volume, turnover })
+
+    basePrice = close
+    timestamp += 60 * 1000
+  }
+  return dataList
+}
+
+const chart = init('k-line-chart')
+chart.applyNewData(genData())
+
+function setType (type) {
+  chart.setStyles({
+    candle: { type }
+  })
+}
+
+// 以下仅仅是为了协助代码演示,在实际项目中根据情况进行调整。
+// The following is only for the purpose of assisting in code demonstration, and adjustments will be made according to the actual situation in the project.
+const container = document.getElementById('container')
+const buttonContainer = document.createElement('div')
+buttonContainer.className = 'button-container'
+const items = [
+  { key: 'candle_solid', text: '全实心-All solid' },
+  { key: 'candle_stroke', text: '全空心-All stroke' },
+  { key: 'candle_up_stroke', text: '涨空心-Up stroke' },
+  { key: 'candle_down_stroke', text: '跌空心-Down stroke' },
+  { key: 'ohlc', text: 'OHLC' },
+  { key: 'area', text: '面积图-Area' }
+]
+items.forEach(({ key, text }) => {
+  const button = document.createElement('button')
+  button.innerText = text
+  button.addEventListener('click', () => { setType(key) })
+  buttonContainer.appendChild(button)
+})
+container.appendChild(buttonContainer)
html
<div id="container">
+  <div id="k-line-chart" style="height:430px">
+</div>
css
.button-container {
+  display: flex;
+  flex-wrap: wrap;
+  align-items: center;
+  gap: 8px;
+  margin-top: 10px;
+  padding: 10px 22px;
+}
+
+.button-container button {
+  padding: 2px 6px;
+  background-color: #1677FF;
+  border-radius: 4px;
+  font-size: 12px;
+  color: #fff;
+  outline: none;
+  border: none;
+}
+ + + + \ No newline at end of file diff --git a/sample/data.html b/sample/data.html new file mode 100644 index 0000000..b9639d4 --- /dev/null +++ b/sample/data.html @@ -0,0 +1,75 @@ + + + + + + 数据加载 | KLineChart + + + + + + + + + + + + + + + + +
Skip to content

数据加载

在新窗口中打开
js
import { init } from 'klinecharts'
+
+function genData (timestamp = new Date().getTime(), length = 800) {
+  let basePrice = 5000
+  timestamp = Math.floor(timestamp / 1000 / 60) * 60 * 1000 - length * 60 * 1000
+  const dataList = []
+  for (let i = 0; i < length; i++) {
+    const prices = []
+    for (let j = 0; j < 4; j++) {
+      prices.push(basePrice + Math.random() * 60 - 30)
+    }
+    prices.sort()
+    const open = +(prices[Math.round(Math.random() * 3)].toFixed(2))
+    const high = +(prices[3].toFixed(2))
+    const low = +(prices[0].toFixed(2))
+    const close = +(prices[Math.round(Math.random() * 3)].toFixed(2))
+    const volume = Math.round(Math.random() * 100) + 10
+    const turnover = (open + high + low + close) / 4 * volume
+    dataList.push({ timestamp, open, high,low, close, volume, turnover })
+
+    basePrice = close
+    timestamp += 60 * 1000
+  }
+  return dataList
+}
+
+const chart = init('k-line-chart')
+chart.applyNewData(genData())
+chart.loadMore((timestamp) => {
+  loadMoreTimer = setTimeout(() => {
+    chart.applyMoreData(genData(timestamp), true)
+  }, 2000)
+})
+chart.applyNewData(genData(), true)
+updateData()
+
+function updateData () {
+  setTimeout(() => {
+    const dataList = chart.getDataList()
+    const lastData = dataList[dataList.length - 1]
+    const newData = { ...lastData }
+    newData.close += (Math.random() * 20 - 10)
+    newData.high = Math.max(newData.high, newData.close)
+    newData.low = Math.min(newData.low, newData.close)
+    newData.volume += Math.round(Math.random() * 10)
+    chart.updateData(newData)
+    updateData()
+  }, 600)
+}
html
<div id="k-line-chart" style="height:430px"/>
+ + + + \ No newline at end of file diff --git a/sample/i18n.html b/sample/i18n.html new file mode 100644 index 0000000..9dfb162 --- /dev/null +++ b/sample/i18n.html @@ -0,0 +1,105 @@ + + + + + + 多语言 | KLineChart + + + + + + + + + + + + + + + + +
Skip to content

多语言

在新窗口中打开
js
import { init, registerLocale } from 'klinecharts'
+import './index.css'
+
+function genData (timestamp = new Date().getTime(), length = 800) {
+  let basePrice = 5000
+  timestamp = Math.floor(timestamp / 1000 / 60) * 60 * 1000 - length * 60 * 1000
+  const dataList = []
+  for (let i = 0; i < length; i++) {
+    const prices = []
+    for (let j = 0; j < 4; j++) {
+      prices.push(basePrice + Math.random() * 60 - 30)
+    }
+    prices.sort()
+    const open = +(prices[Math.round(Math.random() * 3)].toFixed(2))
+    const high = +(prices[3].toFixed(2))
+    const low = +(prices[0].toFixed(2))
+    const close = +(prices[Math.round(Math.random() * 3)].toFixed(2))
+    const volume = Math.round(Math.random() * 100) + 10
+    const turnover = (open + high + low + close) / 4 * volume
+    dataList.push({ timestamp, open, high,low, close, volume, turnover })
+
+    basePrice = close
+    timestamp += 60 * 1000
+  }
+  return dataList
+}
+
+registerLocale('zh-HK', {
+  time: '時間:',
+  open: '開:',
+  high: '高:',
+  low: '低:',
+  close: '收:',
+  volume: '成交量:'
+})
+
+const chart = init('k-line-chart')
+chart.applyNewData(genData())
+
+function setLang (lang) {
+  chart.setLocale(lang)
+}
+
+// 以下仅仅是为了协助代码演示,在实际项目中根据情况进行调整。
+// The following is only for the purpose of assisting in code demonstration, and adjustments will be made according to the actual situation in the project.
+const container = document.getElementById('container')
+const buttonContainer = document.createElement('div')
+buttonContainer.className = 'button-container'
+const items = [
+  { key: 'zh-CN', text: '简体中文' },
+  { key: 'zh-HK', text: '繁体中文' },
+  { key: 'en-US', text: 'English' }
+]
+items.forEach(({ key, text }) => {
+  const button = document.createElement('button')
+  button.innerText = text
+  button.addEventListener('click', () => { setLang(key) })
+  buttonContainer.appendChild(button)
+})
+container.appendChild(buttonContainer)
html
<div id="container">
+  <div id="k-line-chart" style="height:430px">
+</div>
css
.button-container {
+  display: flex;
+  flex-wrap: wrap;
+  align-items: center;
+  gap: 8px;
+  margin-top: 10px;
+  padding: 10px 22px;
+}
+
+.button-container button {
+  padding: 2px 6px;
+  background-color: #1677FF;
+  border-radius: 4px;
+  font-size: 12px;
+  color: #fff;
+  outline: none;
+  border: none;
+}
+ + + + \ No newline at end of file diff --git a/sample/indicator.html b/sample/indicator.html new file mode 100644 index 0000000..659885d --- /dev/null +++ b/sample/indicator.html @@ -0,0 +1,152 @@ + + + + + + 技术指标 | KLineChart + + + + + + + + + + + + + + + + +
Skip to content

技术指标

在新窗口中打开
js
import { init, registerIndicator } from 'klinecharts'
+import './index.css'
+
+const fruits = [
+  '🍏', '🍎', '🍐', '🍊', '🍋', '🍌',
+  '🍉', '🍇', '🍓', '🍈', '🍒', '🍑',
+  '🍍', '🥥', '🥝', '🥭', '🥑', '🍏'
+]
+
+registerIndicator({
+  name: 'Custom',
+  figures: [
+    { key: 'emoji' }
+  ],
+  calc: (kLineDataList) => {
+    return kLineDataList.map(kLineData => ({ emoji: kLineData.close, text: fruits[Math.floor(Math.random() * 17)] }))
+  },
+  draw: ({
+    ctx,
+    barSpace,
+    visibleRange,
+    indicator,
+    xAxis,
+    yAxis
+  }) => {
+    const { from, to } = visibleRange
+
+    ctx.font = barSpace.gapBar + 'px' + ' Helvetica Neue'
+    ctx.textAlign = 'center'
+    const result = indicator.result
+    for (let i = from; i < to; i++) {
+      const data = result[i]
+      const x = xAxis.convertToPixel(i)
+      const y = yAxis.convertToPixel(data.emoji)
+      ctx.fillText(data.text, x, y)
+    }
+    return false
+  }
+})
+
+function genData (timestamp = new Date().getTime(), length = 800) {
+  let basePrice = 5000
+  timestamp = Math.floor(timestamp / 1000 / 60) * 60 * 1000 - length * 60 * 1000
+  const dataList = []
+  for (let i = 0; i < length; i++) {
+    const prices = []
+    for (let j = 0; j < 4; j++) {
+      prices.push(basePrice + Math.random() * 60 - 30)
+    }
+    prices.sort()
+    const open = +(prices[Math.round(Math.random() * 3)].toFixed(2))
+    const high = +(prices[3].toFixed(2))
+    const low = +(prices[0].toFixed(2))
+    const close = +(prices[Math.round(Math.random() * 3)].toFixed(2))
+    const volume = Math.round(Math.random() * 100) + 10
+    const turnover = (open + high + low + close) / 4 * volume
+    dataList.push({ timestamp, open, high,low, close, volume, turnover })
+
+    basePrice = close
+    timestamp += 60 * 1000
+  }
+  return dataList
+}
+
+const chart = init('k-line-chart')
+chart.applyNewData(genData())
+
+function setMainIndicator(name) {
+  chart.createIndicator(name, true, { id: 'candle_pane' })
+}
+
+function setSubIndicator(name) {
+  chart.createIndicator(name)
+}
+
+
+// 以下仅仅是为了协助代码演示,在实际项目中根据情况进行调整。
+// The following is only for the purpose of assisting in code demonstration, and adjustments will be made according to the actual situation in the project.
+const container = document.getElementById('container')
+const buttonContainer = document.createElement('div')
+buttonContainer.className = 'button-container'
+
+const mainIndicators = ['MA', 'BOLL', 'Custom']
+const subIndicators = ['VOL', 'MACD', 'Custom']
+
+const mainTitle = document.createElement('span')
+mainTitle.innerText = '主图指标-Main indicator: '
+buttonContainer.appendChild(mainTitle)
+mainIndicators.forEach((name) => {
+  const button = document.createElement('button')
+  button.innerText = name
+  button.addEventListener('click', () => { setMainIndicator(name) })
+  buttonContainer.appendChild(button)
+})
+
+const subTitle = document.createElement('span')
+subTitle.style.paddingLeft = '16px'
+subTitle.innerText = '副图指标-Sub indicator: '
+buttonContainer.appendChild(subTitle)
+subIndicators.forEach((name) => {
+  const button = document.createElement('button')
+  button.innerText = name
+  button.addEventListener('click', () => { setSubIndicator(name) })
+  buttonContainer.appendChild(button)
+})
+
+container.appendChild(buttonContainer)
html
<div id="container">
+  <div id="k-line-chart" style="height:430px">
+</div>
css
.button-container {
+  display: flex;
+  flex-wrap: wrap;
+  align-items: center;
+  gap: 8px;
+  margin-top: 10px;
+  padding: 10px 22px;
+}
+
+.button-container button {
+  padding: 2px 6px;
+  background-color: #1677FF;
+  border-radius: 4px;
+  font-size: 12px;
+  color: #fff;
+  outline: none;
+  border: none;
+}
+ + + + \ No newline at end of file diff --git a/sample/overlay.html b/sample/overlay.html new file mode 100644 index 0000000..9c71682 --- /dev/null +++ b/sample/overlay.html @@ -0,0 +1,122 @@ + + + + + + 覆盖物 | KLineChart + + + + + + + + + + + + + + + + +
Skip to content

覆盖物

在新窗口中打开
js
import { init, registerOverlay } from 'klinecharts'
+import './index.css'
+
+function genData (timestamp = new Date().getTime(), length = 800) {
+  let basePrice = 5000
+  timestamp = Math.floor(timestamp / 1000 / 60) * 60 * 1000 - length * 60 * 1000
+  const dataList = []
+  for (let i = 0; i < length; i++) {
+    const prices = []
+    for (let j = 0; j < 4; j++) {
+      prices.push(basePrice + Math.random() * 60 - 30)
+    }
+    prices.sort()
+    const open = +(prices[Math.round(Math.random() * 3)].toFixed(2))
+    const high = +(prices[3].toFixed(2))
+    const low = +(prices[0].toFixed(2))
+    const close = +(prices[Math.round(Math.random() * 3)].toFixed(2))
+    const volume = Math.round(Math.random() * 100) + 10
+    const turnover = (open + high + low + close) / 4 * volume
+    dataList.push({ timestamp, open, high,low, close, volume, turnover })
+
+    basePrice = close
+    timestamp += 60 * 1000
+  }
+  return dataList
+}
+
+registerOverlay({
+  name: 'circle',
+  needDefaultPointFigure: true,
+  needDefaultXAxisFigure: true,
+  needDefaultYAxisFigure: true,
+  totalStep: 3,
+  createPointFigures: ({ coordinates }) => {
+    if (coordinates.length === 2) {
+      const xDis = Math.abs(coordinates[0].x - coordinates[1].x)
+      const yDis = Math.abs(coordinates[0].y - coordinates[1].y)
+      const radius = Math.sqrt(xDis * xDis + yDis * yDis)
+      return {
+        key: 'circle',
+        type: 'circle',
+        attrs: {
+          ...coordinates[0],
+          r: radius
+        },
+        styles: {
+          style: 'stroke_fill'
+        }
+      }
+    }
+    return []
+  }
+})
+
+const chart = init('k-line-chart')
+chart.applyNewData(genData())
+
+function createOverlay (name) {
+  chart.createOverlay(name)
+}
+
+// 以下仅仅是为了协助代码演示,在实际项目中根据情况进行调整。
+// The following is only for the purpose of assisting in code demonstration, and adjustments will be made according to the actual situation in the project.
+const container = document.getElementById('container')
+const buttonContainer = document.createElement('div')
+buttonContainer.className = 'button-container'
+const items = [
+  { key: 'priceLine', text: '价格线(内置)-Price line(built-in)' },
+  { key: 'circle', text: '圆(自定义)-Circle(custom)' }
+]
+items.forEach(({ key, text }) => {
+  const button = document.createElement('button')
+  button.innerText = text
+  button.addEventListener('click', () => { createOverlay(key) })
+  buttonContainer.appendChild(button)
+})
+container.appendChild(buttonContainer)
html
<div id="container">
+  <div id="k-line-chart" style="height:430px">
+</div>
css
.button-container {
+  display: flex;
+  flex-wrap: wrap;
+  align-items: center;
+  gap: 8px;
+  margin-top: 10px;
+  padding: 10px 22px;
+}
+
+.button-container button {
+  padding: 2px 6px;
+  background-color: #1677FF;
+  border-radius: 4px;
+  font-size: 12px;
+  color: #fff;
+  outline: none;
+  border: none;
+}
+ + + + \ No newline at end of file diff --git a/sample/theme.html b/sample/theme.html new file mode 100644 index 0000000..db03bba --- /dev/null +++ b/sample/theme.html @@ -0,0 +1,195 @@ + + + + + + 主题 | KLineChart + + + + + + + + + + + + + + + + +
Skip to content

主题

在新窗口中打开
js
import { init, registerStyles } from 'klinecharts'
+import './index.css'
+
+function genData (timestamp = new Date().getTime(), length = 800) {
+  let basePrice = 5000
+  timestamp = Math.floor(timestamp / 1000 / 60) * 60 * 1000 - length * 60 * 1000
+  const dataList = []
+  for (let i = 0; i < length; i++) {
+    const prices = []
+    for (let j = 0; j < 4; j++) {
+      prices.push(basePrice + Math.random() * 60 - 30)
+    }
+    prices.sort()
+    const open = +(prices[Math.round(Math.random() * 3)].toFixed(2))
+    const high = +(prices[3].toFixed(2))
+    const low = +(prices[0].toFixed(2))
+    const close = +(prices[Math.round(Math.random() * 3)].toFixed(2))
+    const volume = Math.round(Math.random() * 100) + 10
+    const turnover = (open + high + low + close) / 4 * volume
+    dataList.push({ timestamp, open, high,low, close, volume, turnover })
+
+    basePrice = close
+    timestamp += 60 * 1000
+  }
+  return dataList
+}
+
+const red = '#F92855'
+const green = '#2DC08E'
+
+const alphaRed = 'rgba(249, 40, 85, .7)'
+const alphaGreen = 'rgba(45, 192, 142, .7)'
+
+registerStyles('green_rise_red_fall', {
+  candle: {
+    bar: {
+      upColor: green,
+      downColor: red,
+      upBorderColor: green,
+      downBorderColor: red,
+      upWickColor: green,
+      downWickColor: red
+    },
+    priceMark: {
+      last: {
+        upColor: green,
+        downColor: red
+      }
+    }
+  },
+  indicator: {
+    ohlc: {
+      upColor: alphaGreen,
+      downColor: alphaRed
+    },
+    bars: [{
+      style: 'fill',
+      borderStyle: 'solid',
+      borderSize: 1,
+      borderDashedValue: [2, 2],
+      upColor: alphaGreen,
+      downColor: alphaRed,
+      noChangeColor: '#888888'
+    }],
+    circles: [{
+      style: 'fill',
+      borderStyle: 'solid',
+      borderSize: 1,
+      borderDashedValue: [2, 2],
+      upColor: alphaGreen,
+      downColor: alphaRed,
+      noChangeColor: '#888888'
+    }]
+  }
+})
+
+registerStyles('red_rise_green_fall', {
+  candle: {
+    bar: {
+      upColor: red,
+      downColor: green,
+      upBorderColor: red,
+      downBorderColor: green,
+      upWickColor: red,
+      downWickColor: green,
+    },
+    priceMark: {
+      last: {
+        upColor: red,
+        downColor: green,
+      }
+    }
+  },
+  indicator: {
+    ohlc: {
+      upColor: alphaRed,
+      downColor: alphaGreen
+    },
+    bars: [{
+      style: 'fill',
+      borderStyle: 'solid',
+      borderSize: 1,
+      borderDashedValue: [2, 2],
+      upColor: alphaRed,
+      downColor: alphaGreen,
+      noChangeColor: '#888888'
+    }],
+    circles: [{
+      style: 'fill',
+      borderStyle: 'solid',
+      borderSize: 1,
+      borderDashedValue: [2, 2],
+      upColor: alphaRed,
+      downColor: alphaGreen,
+      noChangeColor: '#888888'
+    }]
+  }
+})
+
+const chart = init('k-line-chart')
+chart.createIndicator('VOL')
+chart.applyNewData(genData())
+
+function setTheme (theme) {
+  chart.setStyles(theme)
+  if (theme === 'light') {
+    document.getElementById('k-line-chart').style.backgroundColor = '#ffffff'
+  } else if (theme === 'dark') {
+    document.getElementById('k-line-chart').style.backgroundColor = '#1b1b1f'
+  }
+}
+
+// 以下仅仅是为了协助代码演示,在实际项目中根据情况进行调整。
+// The following is only for the purpose of assisting in code demonstration, and adjustments will be made according to the actual situation in the project.
+const container = document.getElementById('container')
+const buttonContainer = document.createElement('div')
+buttonContainer.className = 'button-container'
+const items = [
+  { key: 'light', text: '浅色-Light' },
+  { key: 'dark', text: '深色-Dark' },
+  { key: 'green_rise_red_fall', text: '绿涨红跌-Green rise and red fall' },
+  { key: 'red_rise_green_fall', text: '红涨绿跌-Red rise and green fall' }
+]
+items.forEach(({ key, text }) => {
+  const button = document.createElement('button')
+  button.innerText = text
+  button.addEventListener('click', () => { setTheme(key) })
+  buttonContainer.appendChild(button)
+})
+container.appendChild(buttonContainer)
html
<div id="container">
+  <div id="k-line-chart" style="height:430px">
+</div>
css
.button-container {
+  display: flex;
+  flex-wrap: wrap;
+  align-items: center;
+  gap: 8px;
+  margin-top: 10px;
+  padding: 10px 22px;
+}
+
+.button-container button {
+  padding: 2px 6px;
+  background-color: #1677FF;
+  border-radius: 4px;
+  font-size: 12px;
+  color: #fff;
+  outline: none;
+  border: none;
+}
+ + + + \ No newline at end of file diff --git a/sample/timezone.html b/sample/timezone.html new file mode 100644 index 0000000..6b350fa --- /dev/null +++ b/sample/timezone.html @@ -0,0 +1,96 @@ + + + + + + 时区 | KLineChart + + + + + + + + + + + + + + + + +
Skip to content

时区

在新窗口中打开
js
import { init } from 'klinecharts'
+import './index.css'
+
+function genData (timestamp = new Date().getTime(), length = 800) {
+  let basePrice = 5000
+  timestamp = Math.floor(timestamp / 1000 / 60) * 60 * 1000 - length * 60 * 1000
+  const dataList = []
+  for (let i = 0; i < length; i++) {
+    const prices = []
+    for (let j = 0; j < 4; j++) {
+      prices.push(basePrice + Math.random() * 60 - 30)
+    }
+    prices.sort()
+    const open = +(prices[Math.round(Math.random() * 3)].toFixed(2))
+    const high = +(prices[3].toFixed(2))
+    const low = +(prices[0].toFixed(2))
+    const close = +(prices[Math.round(Math.random() * 3)].toFixed(2))
+    const volume = Math.round(Math.random() * 100) + 10
+    const turnover = (open + high + low + close) / 4 * volume
+    dataList.push({ timestamp, open, high,low, close, volume, turnover })
+
+    basePrice = close
+    timestamp += 60 * 1000
+  }
+  return dataList
+}
+
+const chart = init('k-line-chart')
+chart.applyNewData(genData())
+
+function setTimezone (timezone) {
+  chart.setTimezone(timezone)
+}
+
+// 以下仅仅是为了协助代码演示,在实际项目中根据情况进行调整。
+// The following is only for the purpose of assisting in code demonstration, and adjustments will be made according to the actual situation in the project.
+const container = document.getElementById('container')
+const buttonContainer = document.createElement('div')
+buttonContainer.className = 'button-container'
+const items = [
+  { key: 'Asia/Shanghai', text: '上海-Shanghai' },
+  { key: 'Europe/Berlin', text: '柏林-Berlin' },
+  { key: 'America/Chicago', text: '芝加哥-Chicago' }
+]
+items.forEach(({ key, text }) => {
+  const button = document.createElement('button')
+  button.innerText = text
+  button.addEventListener('click', () => { setTimezone(key) })
+  buttonContainer.appendChild(button)
+})
+container.appendChild(buttonContainer)
html
<div id="container">
+  <div id="k-line-chart" style="height:430px">
+</div>
css
.button-container {
+  display: flex;
+  flex-wrap: wrap;
+  align-items: center;
+  gap: 8px;
+  margin-top: 10px;
+  padding: 10px 22px;
+}
+
+.button-container button {
+  padding: 2px 6px;
+  background-color: #1677FF;
+  border-radius: 4px;
+  font-size: 12px;
+  color: #fff;
+  outline: none;
+  border: none;
+}
+ + + + \ No newline at end of file diff --git a/sample/tooltip.html b/sample/tooltip.html new file mode 100644 index 0000000..71782a3 --- /dev/null +++ b/sample/tooltip.html @@ -0,0 +1,175 @@ + + + + + + 提示条 | KLineChart + + + + + + + + + + + + + + + + +
Skip to content

提示条

在新窗口中打开
js
import { init } from 'klinecharts'
+import './index.css'
+
+function genData (timestamp = new Date().getTime(), length = 800) {
+  let basePrice = 5000
+  timestamp = Math.floor(timestamp / 1000 / 60) * 60 * 1000 - length * 60 * 1000
+  const dataList = []
+  for (let i = 0; i < length; i++) {
+    const prices = []
+    for (let j = 0; j < 4; j++) {
+      prices.push(basePrice + Math.random() * 60 - 30)
+    }
+    prices.sort()
+    const open = +(prices[Math.round(Math.random() * 3)].toFixed(2))
+    const high = +(prices[3].toFixed(2))
+    const low = +(prices[0].toFixed(2))
+    const close = +(prices[Math.round(Math.random() * 3)].toFixed(2))
+    const volume = Math.round(Math.random() * 100) + 10
+    const turnover = (open + high + low + close) / 4 * volume
+    dataList.push({ timestamp, open, high,low, close, volume, turnover })
+
+    basePrice = close
+    timestamp += 60 * 1000
+  }
+  return dataList
+}
+
+const chart = init('k-line-chart')
+chart.createIndicator('MA', false, { id: 'candle_pane' })
+chart.createIndicator('VOL')
+chart.applyNewData(genData())
+
+function setCandleTooltipShowRule (showRule) {
+  chart.setStyles({
+    candle: {
+      tooltip: {
+        showRule
+      }
+    }
+  })
+}
+
+function setCandleTooltipShowType (showType) {
+  chart.setStyles({
+    candle: {
+      tooltip: {
+        showType
+      }
+    }
+  })
+}
+
+function setIndicatorTooltipShowRule (showRule) {
+  chart.setStyles({
+    indicator: {
+      tooltip: {
+        showRule
+      }
+    }
+  })
+}
+
+function setIndicatorTooltipShowType (showType) {
+  chart.setStyles({
+    indicator: {
+      tooltip: {
+        showType
+      }
+    }
+  })
+}
+
+// 以下仅仅是为了协助代码演示,在实际项目中根据情况进行调整。
+// The following is only for the purpose of assisting in code demonstration, and adjustments will be made according to the actual situation in the project.
+const container = document.getElementById('container')
+const rules = [
+  { key: 'always', text: '总是显示-Always display' },
+  { key: 'follow_cross', text: '跟随十字光标-Follow cross' },
+  { key: 'none', text: '不显示-Hide' }
+]
+const types = [
+  { key: 'standard', text: '默认-Standard' },
+  { key: 'rect', text: '矩形框-Rect' }
+]
+
+const baseButtonContainer = document.createElement('div')
+baseButtonContainer.className = 'button-container'
+const baseTitle = document.createElement('span')
+baseTitle.innerText = '基础信息提示-Base info tip: '
+baseButtonContainer.appendChild(baseTitle)
+
+rules.forEach(({ key, text }) => {
+  const button = document.createElement('button')
+  button.innerText = text
+  button.addEventListener('click', () => { setCandleTooltipShowRule(key) })
+  baseButtonContainer.appendChild(button)
+})
+
+types.forEach(({ key, text }) => {
+  const button = document.createElement('button')
+  button.innerText = text
+  button.addEventListener('click', () => { setCandleTooltipShowType(key) })
+  baseButtonContainer.appendChild(button)
+})
+container.appendChild(baseButtonContainer)
+
+const indicatorButtonContainer = document.createElement('div')
+indicatorButtonContainer.className = 'button-container'
+const indicatorTitle = document.createElement('span')
+indicatorTitle.innerText = '指标信息提示-Indicator info tip: '
+indicatorButtonContainer.appendChild(indicatorTitle)
+
+rules.forEach(({ key, text }) => {
+  const button = document.createElement('button')
+  button.innerText = text
+  button.addEventListener('click', () => { setIndicatorTooltipShowRule(key) })
+  indicatorButtonContainer.appendChild(button)
+})
+
+types.forEach(({ key, text }) => {
+  const button = document.createElement('button')
+  button.innerText = text
+  button.addEventListener('click', () => { setIndicatorTooltipShowType(key) })
+  indicatorButtonContainer.appendChild(button)
+})
+container.appendChild(indicatorButtonContainer)
html
<div id="container">
+  <div id="k-line-chart" style="height:430px">
+</div>
css
.button-container {
+  display: flex;
+  flex-wrap: wrap;
+  align-items: center;
+  gap: 8px;
+  margin-top: 10px;
+  padding: 10px 22px;
+}
+
+.button-container:last-child {
+  margin-top: 0;
+}
+
+.button-container button {
+  padding: 2px 6px;
+  background-color: #1677FF;
+  border-radius: 4px;
+  font-size: 12px;
+  color: #fff;
+  outline: none;
+  border: none;
+}
+ + + + \ No newline at end of file diff --git a/sponsor.html b/sponsor.html new file mode 100644 index 0000000..340ddcc --- /dev/null +++ b/sponsor.html @@ -0,0 +1,27 @@ + + + + + + ❤️ 赞助 | KLineChart + + + + + + + + + + + + + + + + +
Skip to content

❤️ 赞助

KLineChart 是采用 Apache-2.0 许可的开源项目,使用完全免费。

如果你觉得插件还不错,希望你能在 GitHub 点一个 🌟。如果能够打赏一杯 ☕️,那就真的太感谢了。

对于赞助 KLineChart 的组织或个人,无论数额多少,如果需要将组织官网或者个人主页展示在 https://klinecharts.com 首页,请提供付款账号或地址,logo,主页链接等信息,发送邮件到 hu_li888@foxmail.com 。赞助额前三名,将使用超大logo展示。

赞助渠道

支付宝

微信支付

加密资产

  • BTC
bc1qnwzukszzk5xfk0zs3sr8etzgctgnrtqts43jzp3khe6gm7xazprsp4y6n3
  • ETH
0xd2c3911654db861e0a2e17415e11a209c1fc3594
  • USDT-ERC20
0xd2c3911654db861e0a2e17415e11a209c1fc3594
  • USDT-TRC20
THJpTQmFGaVm12KE1Jzc5mLXiApP6qXMCi
+ + + + \ No newline at end of file