{"id":118386,"date":"2026-10-27T03:48:36","date_gmt":"2026-10-26T19:48:36","guid":{"rendered":"https:\/\/www.wsisp.com\/helps\/118386.html"},"modified":"2026-10-27T03:48:36","modified_gmt":"2026-10-26T19:48:36","slug":"%e3%80%8aecharts%e5%85%a5%e9%97%a8%e3%80%8b%e7%ac%ac-20-%e7%ab%a0-%e7%bc%a9%e6%94%be%e4%b8%8e%e6%97%b6%e9%97%b4%ef%bc%9adatazoom-%e4%b8%8e-timeline%ef%bc%88%e4%b8%8b%ef%bc%89%ef%bc%9a%e5%ae%9e","status":"publish","type":"post","link":"https:\/\/www.wsisp.com\/helps\/118386.html","title":{"rendered":"\u300aECharts\u5165\u95e8\u300b\u7b2c 20 \u7ae0 \u7f29\u653e\u4e0e\u65f6\u95f4\uff1adataZoom \u4e0e timeline\uff08\u4e0b\uff09\uff1a\u5b9e\u9a8c\u53f0\uff08\u4e0b\uff09\uff5e\u5c0f\u7ed3"},"content":{"rendered":"

\u672c\u7bc7\u662f\u7b2c 20 \u7ae0\u7684\u7b2c 3\/3 \u7bc7，\u63a5\u4e0a\u7bc7\u300a\u7b2c 20 \u7ae0 \u7f29\u653e\u4e0e\u65f6\u95f4：dataZoom \u4e0e timeline（\u4e2d）：\u5b9e\u9a8c\u53f0（\u4e0a）：index.html\u3001app.js\u300b\u3002
\n\"\u5728\u8fd9\u91cc\u63d2\u5165\u56fe\u7247\u63cf\u8ff0\"<\/p>\n

（\u4ee3\u7801\u63a5\u4e0a\u7bc7）<\/p>\n

\/* ===== \u9762\u677f\u516b：slider \u7684\u4e24\u6761\u51e0\u4f55\u5b9a\u5f8b（\u7b2c\u5341\u56db\u8282） ===== *\/<\/span><\/p>\n

function<\/span> initPanel8<\/span>(<\/span>)<\/span> {<\/span>
\n var<\/span> p =<\/span> makePanel<\/span>(<\/span>'p8'<\/span>)<\/span>;<\/span>
\n \/** @type {any[][]} *\/<\/span>
\n var<\/span> V<\/span> =<\/span> [<\/span>
\n [<\/span>'\u2460 \u9ed8\u8ba4（B0）'<\/span>,<\/span> baseOpt<\/span>(<\/span>)<\/span>]<\/span>,<\/span>
\n [<\/span>'\u2461 brushSelect:false \u21d2 \u6ca1\u6709\u62d6\u52a8\u6761，\u6574\u7ec4\u4e0b\u79fb 7（\u8f68\u9053\u9876 208\u2192215）'<\/span>,<\/span> dzOpt<\/span>(<\/span>[<\/span>slider<\/span>(<\/span>25<\/span>,<\/span> 75<\/span>,<\/span> {<\/span> brushSelect<\/span>:<\/span> false<\/span> }<\/span>)<\/span>]<\/span>)<\/span>]<\/span>,<\/span>
\n [<\/span>'\u2462 moveHandleSize:0'<\/span>,<\/span> dzOpt<\/span>(<\/span>[<\/span>slider<\/span>(<\/span>25<\/span>,<\/span> 75<\/span>,<\/span> {<\/span> moveHandleSize<\/span>:<\/span> 0<\/span> }<\/span>)<\/span>]<\/span>)<\/span>]<\/span>,<\/span>
\n [<\/span>'\u2463 moveHandleSize:8'<\/span>,<\/span> dzOpt<\/span>(<\/span>[<\/span>slider<\/span>(<\/span>25<\/span>,<\/span> 75<\/span>,<\/span> {<\/span> moveHandleSize<\/span>:<\/span> 8<\/span> }<\/span>)<\/span>]<\/span>)<\/span>]<\/span>,<\/span>
\n [<\/span>'\u2464 moveHandleSize:20'<\/span>,<\/span> dzOpt<\/span>(<\/span>[<\/span>slider<\/span>(<\/span>25<\/span>,<\/span> 75<\/span>,<\/span> {<\/span> moveHandleSize<\/span>:<\/span> 20<\/span> }<\/span>)<\/span>]<\/span>)<\/span>]<\/span>,<\/span>
\n [<\/span>'\u2465 moveHandleSize:30（\u8f68\u9053\u9876\u51fa\u753b\u5e03）'<\/span>,<\/span> dzOpt<\/span>(<\/span>[<\/span>slider<\/span>(<\/span>25<\/span>,<\/span> 75<\/span>,<\/span> {<\/span> moveHandleSize<\/span>:<\/span> 30<\/span> }<\/span>)<\/span>]<\/span>)<\/span>]<\/span>,<\/span>
\n [<\/span>'\u2466 height:12 + bottom:4 + left:20 + right:20'<\/span>,<\/span>
\n dzOpt<\/span>(<\/span>[<\/span>slider<\/span>(<\/span>25<\/span>,<\/span> 75<\/span>,<\/span> {<\/span> height<\/span>:<\/span> 12<\/span>,<\/span> bottom<\/span>:<\/span> 4<\/span>,<\/span> left<\/span>:<\/span> 20<\/span>,<\/span> right<\/span>:<\/span> 20<\/span> }<\/span>)<\/span>]<\/span>)<\/span>]<\/span>,<\/span>
\n [<\/span>'\u2467 \u7ad6\u6761 orient:vertical'<\/span>,<\/span> \/** @type {any} *\/<\/span> (<\/span>{<\/span>
\n animation<\/span>:<\/span> false<\/span>,<\/span> xAxis<\/span>:<\/span> {<\/span> type<\/span>:<\/span> 'value'<\/span> }<\/span>,<\/span>
\n yAxis<\/span>:<\/span> {<\/span> type<\/span>:<\/span> 'category'<\/span>,<\/span> data<\/span>:<\/span> CAT12<\/span>.<\/span>slice<\/span>(<\/span>)<\/span> }<\/span>,<\/span>
\n series<\/span>:<\/span> [<\/span>{<\/span> type<\/span>:<\/span> 'bar'<\/span>,<\/span> data<\/span>:<\/span> A12<\/span>.<\/span>slice<\/span>(<\/span>)<\/span> }<\/span>]<\/span>,<\/span>
\n dataZoom<\/span>:<\/span> [<\/span>{<\/span> type<\/span>:<\/span> 'slider'<\/span>,<\/span> yAxisIndex<\/span>:<\/span> 0<\/span>,<\/span> orient<\/span>:<\/span> 'vertical'<\/span>,<\/span> start<\/span>:<\/span> 25<\/span>,<\/span> end<\/span>:<\/span> 75<\/span> }<\/span>]<\/span>
\n }<\/span>)<\/span>]<\/span>
\n ]<\/span>;<\/span>
\n function<\/span> std<\/span>(<\/span>svg,<\/span> c<\/span>)<\/span> {<\/span>
\n return<\/span> [<\/span>geometryRow<\/span>(<\/span>svg)<\/span>,<\/span> shadowRow<\/span>(<\/span>svg)<\/span>,<\/span> gridRow<\/span>(<\/span>c)<\/span>,<\/span> dzRow<\/span>(<\/span>c,<\/span> 0<\/span>)<\/span>]<\/span>;<\/span>
\n }<\/span>
\n for<\/span> (<\/span>var<\/span> i =<\/span> 0<\/span>;<\/span> i <<\/span> V<\/span>.<\/span>length;<\/span> i++<\/span>)<\/span> {<\/span>
\n (<\/span>function<\/span> (<\/span>idx<\/span>)<\/span> {<\/span>
\n bind<\/span>(<\/span>'b8'<\/span> +<\/span> String.<\/span>fromCharCode<\/span>(<\/span>97<\/span> +<\/span> idx)<\/span>,<\/span> function<\/span> (<\/span>)<\/span> {<\/span> p.<\/span>run<\/span>(<\/span>V<\/span>[<\/span>idx]<\/span>[<\/span>0<\/span>]<\/span>,<\/span> V<\/span>[<\/span>idx]<\/span>[<\/span>1<\/span>]<\/span>,<\/span> std)<\/span>;<\/span> }<\/span>)<\/span>;<\/span>
\n }<\/span>)<\/span>(<\/span>i)<\/span>;<\/span>
\n }<\/span>
\n bind<\/span>(<\/span>'b8i'<\/span>,<\/span> function<\/span> (<\/span>)<\/span> {<\/span>
\n p.<\/span>run<\/span>(<\/span>'\u2468 \u4e24\u6761\u5b9a\u5f8b\u9010\u6863\u5bf9\u8d26：moveHandleSize \u4ece 0 \u626b\u5230 33'<\/span>,<\/span> baseOpt<\/span>(<\/span>)<\/span>,<\/span> function<\/span> (<\/span>svg,<\/span> c<\/span>)<\/span> {<\/span>
\n var<\/span> out =<\/span> [<\/span>' \u5b9a\u5f8b\u4e00（\u7eb5\u5411）\u7ec4\u9876 = \u753b\u5e03\u9ad8 \u2212 30 \u2212 edgeGap(15) \u2212 (brushSelect ? 7 : 0)，\u90a3\u4e2a 7 \u5199\u6b7b\u5728\u6e90\u7801\u91cc，\u4e0d\u8bfb\u4f60\u7684 moveHandleSize'<\/span>,<\/span>
\n ' \u5b9a\u5f8b\u4e8c（\u6a2a\u5411）\u8f68\u9053\u8d77 x = grid.x + max(2.5, 0.4 \u00d7 moveHandleSize)；\u539a\u5ea6\u4e0a\u6cbf = \u7ec4\u9876 + max(0, moveHandleSize \u2212 0.5)'<\/span>]<\/span>;<\/span>
\n var<\/span> mhs =<\/span> [<\/span>null<\/span>,<\/span> 0<\/span>,<\/span> 1<\/span>,<\/span> 2<\/span>,<\/span> 3<\/span>,<\/span> 4<\/span>,<\/span> 5<\/span>,<\/span> 6<\/span>,<\/span> 7<\/span>,<\/span> 8<\/span>,<\/span> 10<\/span>,<\/span> 12<\/span>,<\/span> 15<\/span>,<\/span> 20<\/span>,<\/span> 25<\/span>,<\/span> 30<\/span>,<\/span> 33<\/span>]<\/span>;<\/span>
\n var<\/span> inst =<\/span> echarts.<\/span>init<\/span>(<\/span>null<\/span>,<\/span> null<\/span>,<\/span> {<\/span> renderer<\/span>:<\/span> 'svg'<\/span>,<\/span> ssr<\/span>:<\/span> true<\/span>,<\/span> width<\/span>:<\/span> 400<\/span>,<\/span> height<\/span>:<\/span> 260<\/span> }<\/span>)<\/span>;<\/span>
\n var<\/span> bad1 =<\/span> 0<\/span>,<\/span> bad2 =<\/span> 0<\/span>;<\/span>
\n try<\/span> {<\/span>
\n for<\/span> (<\/span>var<\/span> j =<\/span> 0<\/span>;<\/span> j <<\/span> mhs.<\/span>length;<\/span> j++<\/span>)<\/span> {<\/span>
\n var<\/span> extra =<\/span> mhs[<\/span>j]<\/span> ==<\/span> null<\/span> ?<\/span> {<\/span>}<\/span> :<\/span> {<\/span> moveHandleSize<\/span>:<\/span> mhs[<\/span>j]<\/span> }<\/span>;<\/span>
\n inst.<\/span>setOption<\/span>(<\/span>\/** @type {any} *\/<\/span> (<\/span>dzOpt<\/span>(<\/span>[<\/span>slider<\/span>(<\/span>25<\/span>,<\/span> 75<\/span>,<\/span> extra)<\/span>]<\/span>)<\/span>)<\/span>,<\/span> true<\/span>)<\/span>;<\/span>
\n var<\/span> svg2 =<\/span> svgOf<\/span>(<\/span>inst)<\/span>;<\/span>
\n var<\/span> rs =<\/span> rectShapes<\/span>(<\/span>svg2)<\/span>;<\/span>
\n var<\/span> track =<\/span> null<\/span>;<\/span>
\n for<\/span> (<\/span>var<\/span> t =<\/span> 0<\/span>;<\/span> t <<\/span> rs.<\/span>length;<\/span> t++<\/span>)<\/span> {<\/span>
\n if<\/span> (<\/span>rs[<\/span>t]<\/span>.<\/span>\u6cbf\u8f74 &&<\/span> String<\/span>(<\/span>rs[<\/span>t]<\/span>.<\/span>op)<\/span> !==<\/span> '0.2'<\/span>)<\/span> track =<\/span> rs[<\/span>t]<\/span>;<\/span>
\n }<\/span>
\n if<\/span> (<\/span>!<\/span>track)<\/span> {<\/span> out.<\/span>push<\/span>(<\/span>' '<\/span> +<\/span> JSON<\/span>.<\/span>stringify<\/span>(<\/span>mhs[<\/span>j]<\/span>)<\/span> +<\/span> ' \u21d2 \u8f68\u9053\u8bfb\u4e0d\u5230'<\/span>)<\/span>;<\/span> continue<\/span>;<\/span> }<\/span>
\n var<\/span> mh =<\/span> mhs[<\/span>j]<\/span> ==<\/span> null<\/span> ?<\/span> 7<\/span> :<\/span> mhs[<\/span>j]<\/span>;<\/span>
\n var<\/span> handX =<\/span> 60<\/span> +<\/span> Math.<\/span>max<\/span>(<\/span>2.5<\/span>,<\/span> 0.4<\/span> *<\/span> mh)<\/span>;<\/span>
\n var<\/span> handY =<\/span> 208<\/span> +<\/span> Math.<\/span>max<\/span>(<\/span>0<\/span>,<\/span> mh –<\/span> 0.5<\/span>)<\/span>;<\/span>
\n var<\/span> okX =<\/span> Math.<\/span>abs<\/span>(<\/span>track.<\/span>\u6cbf\u8f74[<\/span>0<\/span>]<\/span> –<\/span> handX)<\/span> <<\/span> 0.011<\/span>;<\/span>
\n var<\/span> okY =<\/span> Math.<\/span>abs<\/span>(<\/span>track.<\/span>\u539a\u5ea6[<\/span>0<\/span>]<\/span> –<\/span> handY)<\/span> <<\/span> 0.011<\/span>;<\/span>
\n if<\/span> (<\/span>!<\/span>okX)<\/span> bad2++<\/span>;<\/span>
\n if<\/span> (<\/span>!<\/span>okY)<\/span> bad1++<\/span>;<\/span>
\n out.<\/span>push<\/span>(<\/span>' moveHandleSize='<\/span> +<\/span> JSON<\/span>.<\/span>stringify<\/span>(<\/span>mhs[<\/span>j]<\/span>)<\/span> +<\/span> ' \u8f68\u9053\u6cbf\u8f74='<\/span> +<\/span> frs<\/span>(<\/span>track.<\/span>\u6cbf\u8f74)<\/span> +<\/span>
\n ' \u539a\u5ea6='<\/span> +<\/span> frs<\/span>(<\/span>track.<\/span>\u539a\u5ea6)<\/span> +<\/span> ' \u624b\u7b97\u8d77x='<\/span> +<\/span> r2<\/span>(<\/span>handX)<\/span> +<\/span> ' '<\/span> +<\/span> (<\/span>okX ?<\/span> '\u2713'<\/span> :<\/span> '\u2717'<\/span>)<\/span> +<\/span>
\n ' \u624b\u7b97\u4e0a\u6cbf='<\/span> +<\/span> r2<\/span>(<\/span>handY)<\/span> +<\/span> ' '<\/span> +<\/span> (<\/span>okY ?<\/span> '\u2713'<\/span> :<\/span> '\u2717'<\/span>)<\/span> +<\/span>
\n ' \u62d6\u52a8\u6761='<\/span> +<\/span> (<\/span>moveHandleBox<\/span>(<\/span>svg2)<\/span> ?<\/span> '\u5728'<\/span> :<\/span> '\u4e0d\u5728'<\/span>)<\/span> +<\/span> ' \u5b57\u8282='<\/span> +<\/span> svg2.<\/span>length)<\/span>;<\/span>
\n }<\/span>
\n out.<\/span>push<\/span>(<\/span>' \u21d2 '<\/span> +<\/span> mhs.<\/span>length +<\/span> ' \u6863：\u7eb5\u5411\u4e0d\u7b26 '<\/span> +<\/span> bad1 +<\/span> ' \u6863，\u6a2a\u5411\u4e0d\u7b26 '<\/span> +<\/span> bad2 +<\/span> ' \u6863'<\/span>
\n +<\/span> '（null \u90a3\u4e00\u6863\u5c31\u662f\u300c\u4e0d\u5199\u8fd9\u4e2a\u952e\u300d，\u5e93\u91cc\u90a3\u4efd defaultOption \u5199\u7684\u662f 7）'<\/span>)<\/span>;<\/span>
\n }<\/span> catch<\/span> (<\/span>e)<\/span> {<\/span>
\n out.<\/span>push<\/span>(<\/span>' \u21d2 \u626b\u63cf\u4e2d\u9014\u629b\u9519：'<\/span> +<\/span> e.<\/span>message)<\/span>;<\/span>
\n }<\/span> finally<\/span> {<\/span> try<\/span> {<\/span> inst.<\/span>dispose<\/span>(<\/span>)<\/span>;<\/span> }<\/span> catch<\/span> (<\/span>e2)<\/span> {<\/span> }<\/span> }<\/span>
\n return<\/span> out;<\/span>
\n }<\/span>)<\/span>;<\/span>
\n }<\/span>)<\/span>;<\/span>
\n p.<\/span>run<\/span>(<\/span>V<\/span>[<\/span>0<\/span>]<\/span>[<\/span>0<\/span>]<\/span>,<\/span> V<\/span>[<\/span>0<\/span>]<\/span>[<\/span>1<\/span>]<\/span>,<\/span> std)<\/span>;<\/span>
\n}<\/span>
\n\/* ===== \u9762\u677f\u4e5d：\u624b\u67c4\u5341\u6863\u3001\u56fe\u6807\u3001\u4e09\u4e2a\u586b\u5145\u8272\u3001SSR \u8bfb\u4e0d\u5230\u7684 cursor（\u7b2c\u5341\u4e94\u8282） ===== *\/<\/span><\/p>\n

\/\/ \u6a21\u578b\u91cc\u7684 handleIcon \u539f\u4e32（\u9ec4\u6846\u8981\u5370\u5b83，\u522b\u9760\u8bb0\u5fc6）<\/span>
\nfunction<\/span> handleStyleRow<\/span>(<\/span>c<\/span>)<\/span> {<\/span>
\n var<\/span> m =<\/span> modelOf<\/span>(<\/span>c)<\/span>,<\/span> out =<\/span> [<\/span>]<\/span>;<\/span>
\n if<\/span> (<\/span>!<\/span>m)<\/span> return<\/span> ' \u624b\u67c4\u914d\u7f6e = '<\/span> +<\/span> NO_MODEL<\/span>;<\/span>
\n for<\/span> (<\/span>var<\/span> i =<\/span> 0<\/span>;<\/span> i <<\/span> 4<\/span>;<\/span> i++<\/span>)<\/span> {<\/span>
\n var<\/span> zm =<\/span> null<\/span>;<\/span>
\n try<\/span> {<\/span> zm =<\/span> m.<\/span>getComponent<\/span>(<\/span>'dataZoom'<\/span>,<\/span> i)<\/span>;<\/span> }<\/span> catch<\/span> (<\/span>e)<\/span> {<\/span> break<\/span>;<\/span> }<\/span>
\n if<\/span> (<\/span>!<\/span>zm)<\/span> break<\/span>;<\/span>
\n var<\/span> g<\/span> =<\/span> function<\/span> (<\/span>k<\/span>)<\/span> {<\/span> try<\/span> {<\/span> return<\/span> zm.<\/span>get<\/span>(<\/span>k)<\/span>;<\/span> }<\/span> catch<\/span> (<\/span>e)<\/span> {<\/span> return<\/span> '\u8bfb\u4e0d\u5230'<\/span>;<\/span> }<\/span> }<\/span>;<\/span>
\n out.<\/span>push<\/span>(<\/span>' dz'<\/span> +<\/span> i +<\/span> ' handleIcon='<\/span> +<\/span> dash<\/span>(<\/span>g<\/span>(<\/span>'handleIcon'<\/span>)<\/span>)<\/span> +<\/span> '\\\\n moveHandleIcon='<\/span> +<\/span> dash<\/span>(<\/span>g<\/span>(<\/span>'moveHandleIcon'<\/span>)<\/span>)<\/span> +<\/span>
\n ' handleSize='<\/span> +<\/span> JSON<\/span>.<\/span>stringify<\/span>(<\/span>g<\/span>(<\/span>'handleSize'<\/span>)<\/span>)<\/span> +<\/span> ' showDetail='<\/span> +<\/span> JSON<\/span>.<\/span>stringify<\/span>(<\/span>g<\/span>(<\/span>'showDetail'<\/span>)<\/span>)<\/span> +<\/span>
\n ' labelPrecision='<\/span> +<\/span> JSON<\/span>.<\/span>stringify<\/span>(<\/span>g<\/span>(<\/span>'labelPrecision'<\/span>)<\/span>)<\/span> +<\/span> ' labelFormatter='<\/span> +<\/span> JSON<\/span>.<\/span>stringify<\/span>(<\/span>g<\/span>(<\/span>'labelFormatter'<\/span>)<\/span>)<\/span> +<\/span>
\n '\\\\n backgroundColor='<\/span> +<\/span> dash<\/span>(<\/span>g<\/span>(<\/span>'backgroundColor'<\/span>)<\/span>)<\/span> +<\/span> ' fillerColor='<\/span> +<\/span> dash<\/span>(<\/span>g<\/span>(<\/span>'fillerColor'<\/span>)<\/span>)<\/span> +<\/span>
\n ' borderColor='<\/span> +<\/span> dash<\/span>(<\/span>g<\/span>(<\/span>'borderColor'<\/span>)<\/span>)<\/span> +<\/span> ' brushStyle='<\/span> +<\/span> JSON<\/span>.<\/span>stringify<\/span>(<\/span>g<\/span>(<\/span>'brushStyle'<\/span>)<\/span>)<\/span>)<\/span>;<\/span>
\n }<\/span>
\n return<\/span> out.<\/span>join<\/span>(<\/span>'\\\\n'<\/span>)<\/span> ||<\/span> ' （\u6ca1\u6709 dataZoom \u7ec4\u4ef6）'<\/span>;<\/span>
\n}<\/span>
\n\/\/ cursor \u53ea\u6d3b\u5728 zrender \u7684\u663e\u793a\u5217\u8868\u91cc：SVG \u4e32\u4e00\u4e2a\u5b57\u7b26\u90fd\u4e0d\u5199（\u9762\u677f\u4e5d \u2466）<\/span>
\nfunction<\/span> cursorRow<\/span>(<\/span>chart<\/span>)<\/span> {<\/span>
\n var<\/span> out =<\/span> [<\/span>]<\/span>,<\/span> by =<\/span> {<\/span>}<\/span>;<\/span>
\n try<\/span> {<\/span>
\n var<\/span> list =<\/span> chart.<\/span>getZr<\/span>(<\/span>)<\/span>.<\/span>storage.<\/span>getDisplayList<\/span>(<\/span>true<\/span>)<\/span> ||<\/span> [<\/span>]<\/span>;<\/span>
\n out.<\/span>push<\/span>(<\/span>' \u663e\u793a\u5217\u8868\u56fe\u5143='<\/span> +<\/span> list.<\/span>length +<\/span> ' \u4e2a'<\/span>)<\/span>;<\/span>
\n for<\/span> (<\/span>var<\/span> i =<\/span> 0<\/span>;<\/span> i <<\/span> list.<\/span>length;<\/span> i++<\/span>)<\/span> {<\/span>
\n var<\/span> el =<\/span> list[<\/span>i]<\/span>,<\/span> cur =<\/span> el.<\/span>cursor;<\/span>
\n if<\/span> (<\/span>cur ==<\/span> null<\/span> ||<\/span> cur ===<\/span> 'pointer'<\/span>)<\/span> continue<\/span>;<\/span>
\n var<\/span> lb =<\/span> null<\/span>;<\/span>
\n try<\/span> {<\/span> lb =<\/span> el.<\/span>getBoundingRect<\/span>(<\/span>)<\/span>;<\/span> }<\/span> catch<\/span> (<\/span>e)<\/span> {<\/span> }<\/span>
\n by[<\/span>cur]<\/span> =<\/span> (<\/span>by[<\/span>cur]<\/span> ||<\/span> 0<\/span>)<\/span> +<\/span> 1<\/span>;<\/span>
\n if<\/span> (<\/span>(<\/span>by[<\/span>cur]<\/span> ||<\/span> 0<\/span>)<\/span> <=<\/span> 3<\/span>)<\/span> {<\/span>
\n out.<\/span>push<\/span>(<\/span>' cursor='<\/span> +<\/span> cur +<\/span> ' \u7c7b\u578b='<\/span> +<\/span> (<\/span>el.<\/span>type ||<\/span> el.<\/span>constructor.<\/span>name)<\/span> +<\/span>
\n (<\/span>lb ?<\/span> ' \u5c40\u90e8='<\/span> +<\/span> [<\/span>r2<\/span>(<\/span>lb.<\/span>x)<\/span>,<\/span> r2<\/span>(<\/span>lb.<\/span>y)<\/span>,<\/span> r2<\/span>(<\/span>lb.<\/span>width)<\/span>,<\/span> r2<\/span>(<\/span>lb.<\/span>height)<\/span>]<\/span>.<\/span>join<\/span>(<\/span>','<\/span>)<\/span> :<\/span> ''<\/span>)<\/span>)<\/span>;<\/span>
\n }<\/span>
\n }<\/span>
\n }<\/span> catch<\/span> (<\/span>e)<\/span> {<\/span> out.<\/span>push<\/span>(<\/span>' \u663e\u793a\u5217\u8868\u8bfb\u4e0d\u5230：'<\/span> +<\/span> e.<\/span>message)<\/span>;<\/span> }<\/span>
\n out.<\/span>push<\/span>(<\/span>' \u8ba1\u6570='<\/span> +<\/span> JSON<\/span>.<\/span>stringify<\/span>(<\/span>by)<\/span>)<\/span>;<\/span>
\n out.<\/span>push<\/span>(<\/span>' \u21d2 \u5bf9\u7167\u6e90\u7801：\u624b\u67c4 cursor=getCursor(orient)（SliderZoomView.js:860，\u6a2a ew-resize \/ \u7ad6 ns-resize）\u3001'<\/span>
\n +<\/span> '\u62d6\u52a8\u6761 cursor:"grab"(:527)\u3001\u62d6\u52a8\u4e2d\u6539 "grabbing"(:686)\u3001\u70b9\u51fb\u9762\u677f "crosshair"(:247)\u3002'<\/span>)<\/span>;<\/span>
\n out.<\/span>push<\/span>(<\/span>' \u21d2 inside \u90a3\u4e24\u6839：roams.js:156-157 \u5148\u58f0\u660e\u6210 undefined，:169-170 \u7528 retrieve2 \u9010\u6839\u8986\u76d6 \u21d2 '<\/span>
\n +<\/span> '\u540c\u4e00\u6839\u8f74\u88ab\u591a\u6839 dataZoom \u76d6\u4f4f\u65f6\u751f\u6548\u7684\u662f**\u6700\u540e\u58f0\u660e**\u7684\u90a3\u4e00\u6839（:167-168 \u7684\u6ce8\u91ca\u539f\u8bdd）\u2014\u2014\u8ddf hostedBy \u7684\u300c\u5148\u6765\u8005\u79f0\u738b\u300d\u76f8\u53cd；'<\/span>
\n +<\/span> '\u4e24\u6839\u90fd\u4e0d\u5199\u65f6\u7531 component\/helper\/RoamController.js:105-106 \u515c\u5e95\u6210 grab \/ grabbing\u3002'<\/span>)<\/span>;<\/span>
\n out.<\/span>push<\/span>(<\/span>' \u21d2 \u5149\u6807\u4e0d\u843d\u76d8\u7684\u673a\u5236：zrender\/lib\/Handler.js:95 \u53ea\u5728\u9f20\u6807\u79fb\u52a8\u90a3\u4e00\u523b\u628a hoveredTarget.cursor \u4ea4\u7ed9 '<\/span>
\n +<\/span> 'zrender\/lib\/dom\/HandlerProxy.js:277，\u90a3\u53e5\u662f dom.style.cursor = \u2026 \u21d2 \u5b83\u6539\u7684\u662f\u753b\u5e03 DOM \u7684\u884c\u5185\u6837\u5f0f，'<\/span>
\n +<\/span> 'SVG \u4e32\u91cc\u6ca1\u6709\u9f20\u6807，\u6240\u4ee5\u4e00\u4e2a\u5149\u6807\u5c5e\u6027\u90fd\u5199\u4e0d\u8fdb\u53bb\u3002'<\/span>)<\/span>;<\/span>
\n return<\/span> out.<\/span>join<\/span>(<\/span>'\\\\n'<\/span>)<\/span>;<\/span>
\n}<\/span>
\n\/\/ \u4e24\u5c42\u5f71\u5b50\u7684\u843d\u76d8\u7b14\u8272：polyline \/ polygon \u7684 stroke \u4e0e fill<\/span>
\nfunction<\/span> shadowColorRow<\/span>(<\/span>svg<\/span>)<\/span> {<\/span>
\n var<\/span> b =<\/span> bodyOf<\/span>(<\/span>svg)<\/span>,<\/span> out =<\/span> [<\/span>]<\/span>;<\/span>
\n var<\/span> re =<\/span> \/<\/span><(polyline|polygon) points="[^"]*"[^>]*<\/span>\/<\/span>g<\/span><\/span>,<\/span> m;<\/span>
\n while<\/span> (<\/span>(<\/span>m =<\/span> re.<\/span>exec<\/span>(<\/span>b)<\/span>)<\/span>)<\/span> {<\/span>
\n var<\/span> a =<\/span> attrOf<\/span>(<\/span>m[<\/span>0<\/span>]<\/span>)<\/span>;<\/span>
\n out.<\/span>push<\/span>(<\/span>' '<\/span> +<\/span> m[<\/span>1<\/span>]<\/span> +<\/span> ' stroke='<\/span> +<\/span> dash<\/span>(<\/span>a.<\/span>stroke)<\/span> +<\/span> ' fill='<\/span> +<\/span> dash<\/span>(<\/span>a.<\/span>fill)<\/span> +<\/span>
\n ' width='<\/span> +<\/span> dash<\/span>(<\/span>a[<\/span>'stroke-width'<\/span>]<\/span>)<\/span> +<\/span> ' opacity='<\/span> +<\/span> dash<\/span>(<\/span>a[<\/span>'fill-opacity'<\/span>]<\/span>)<\/span>)<\/span>;<\/span>
\n }<\/span>
\n return<\/span> ' \u5f71\u5b50\u7b14\u8272（\u9ed8\u8ba4：\u672a\u9009\u5c42\u7ebf #a1aed9 \/ 0.5\u3001\u9762 #c0c9e6；\u9009\u4e2d\u5c42\u7ebf #8292cc）\\\\n'<\/span> +<\/span>
\n (<\/span>out.<\/span>length ?<\/span> out.<\/span>join<\/span>(<\/span>'\\\\n'<\/span>)<\/span> :<\/span> ' （\u4e00\u6761\u5f71\u5b50\u90fd\u4e0d\u753b）'<\/span>)<\/span>;<\/span>
\n}<\/span><\/p>\n

function<\/span> initPanel9<\/span>(<\/span>)<\/span> {<\/span>
\n var<\/span> p =<\/span> makePanel<\/span>(<\/span>'p9'<\/span>)<\/span>;<\/span>
\n var<\/span> firstSvg =<\/span> ''<\/span>;<\/span>
\n \/** @type {any[][]} *\/<\/span>
\n var<\/span> V<\/span> =<\/span> [<\/span>
\n [<\/span>'\u2460 \u9ed8\u8ba4：\u4e24\u624b\u67c4 + \u62d6\u52a8\u6761 + \u4e24\u5c42\u5f71\u5b50'<\/span>,<\/span> baseOpt<\/span>(<\/span>)<\/span>]<\/span>,<\/span>
\n [<\/span>'\u2461 handleIcon:"circle"'<\/span>,<\/span> dzOpt<\/span>(<\/span>[<\/span>slider<\/span>(<\/span>25<\/span>,<\/span> 75<\/span>,<\/span> {<\/span> handleIcon<\/span>:<\/span> 'circle'<\/span> }<\/span>)<\/span>]<\/span>)<\/span>]<\/span>,<\/span>
\n [<\/span>'\u2462 handleIcon \u81ea\u7ed8\u4e00\u6761 path'<\/span>,<\/span> dzOpt<\/span>(<\/span>[<\/span>slider<\/span>(<\/span>25<\/span>,<\/span> 75<\/span>,<\/span> {<\/span>
\n handleIcon<\/span>:<\/span> 'path:\/\/M0,0 L2,0 L2,2 L0,2 Z'<\/span>,<\/span>
\n handleStyle<\/span>:<\/span> {<\/span> color<\/span>:<\/span> '#ffde99'<\/span>,<\/span> borderColor<\/span>:<\/span> '#d29906'<\/span>,<\/span> borderWidth<\/span>:<\/span> 1<\/span> }<\/span>
\n }<\/span>)<\/span>]<\/span>)<\/span>]<\/span>,<\/span>
\n [<\/span>'\u2463 fillerColor \/ borderColor \/ backgroundColor \u4e09\u4ef6\u5957'<\/span>,<\/span> dzOpt<\/span>(<\/span>[<\/span>slider<\/span>(<\/span>25<\/span>,<\/span> 75<\/span>,<\/span> {<\/span>
\n fillerColor<\/span>:<\/span> 'rgba(0,120,255,0.35)'<\/span>,<\/span> borderColor<\/span>:<\/span> '#ff0000'<\/span>,<\/span> backgroundColor<\/span>:<\/span> '#eeeeee'<\/span>
\n }<\/span>)<\/span>]<\/span>)<\/span>]<\/span>,<\/span>
\n [<\/span>'\u2464 handleSize \u5341\u6863\u626b\u63cf'<\/span>,<\/span> baseOpt<\/span>(<\/span>)<\/span>]<\/span>,<\/span>
\n [<\/span>'\u2465 showDetail + labelPrecision + labelFormatter \u21d2 \u9010\u5b57\u4e0d\u53d8'<\/span>,<\/span> dzOpt<\/span>(<\/span>[<\/span>slider<\/span>(<\/span>25<\/span>,<\/span> 75<\/span>,<\/span> {<\/span>
\n showDetail<\/span>:<\/span> true<\/span>,<\/span> labelPrecision<\/span>:<\/span> 2<\/span>,<\/span> labelFormatter<\/span>:<\/span> '{value}'<\/span>
\n }<\/span>)<\/span>]<\/span>)<\/span>]<\/span>,<\/span>
\n [<\/span>'\u2466 cursor \u65cf（\u6d4f\u89c8\u5668\u91cc\u624d\u8bfb\u5f97\u5230）'<\/span>,<\/span> dzOpt<\/span>(<\/span>[<\/span>slider<\/span>(<\/span>25<\/span>,<\/span> 75<\/span>,<\/span> {<\/span>
\n brushSelect<\/span>:<\/span> true<\/span>,<\/span> handleIcon<\/span>:<\/span> 'rect'<\/span>
\n }<\/span>)<\/span>]<\/span>)<\/span>]<\/span>,<\/span>
\n [<\/span>'\u2467 dataBackground \/ selectedDataBackground \u4e24\u5c42\u7ebf\u8272'<\/span>,<\/span> dzOpt<\/span>(<\/span>[<\/span>slider<\/span>(<\/span>25<\/span>,<\/span> 75<\/span>,<\/span> {<\/span>
\n dataBackground<\/span>:<\/span> {<\/span> lineStyle<\/span>:<\/span> {<\/span> color<\/span>:<\/span> '#ff0000'<\/span>,<\/span> width<\/span>:<\/span> 3<\/span> }<\/span>,<\/span> areaStyle<\/span>:<\/span> {<\/span> color<\/span>:<\/span> 'rgba(0,255,0,0.5)'<\/span> }<\/span> }<\/span>,<\/span>
\n selectedDataBackground<\/span>:<\/span> {<\/span> lineStyle<\/span>:<\/span> {<\/span> color<\/span>:<\/span> '#0000ff'<\/span> }<\/span>,<\/span> areaStyle<\/span>:<\/span> {<\/span> color<\/span>:<\/span> '#ffff00'<\/span> }<\/span> }<\/span>
\n }<\/span>)<\/span>]<\/span>)<\/span>]<\/span>
\n ]<\/span>;<\/span>
\n function<\/span> std<\/span>(<\/span>svg,<\/span> c<\/span>)<\/span> {<\/span>
\n return<\/span> [<\/span>sliderPartsRow<\/span>(<\/span>svg)<\/span>,<\/span> geometryRow<\/span>(<\/span>svg)<\/span>,<\/span> shadowColorRow<\/span>(<\/span>svg)<\/span>,<\/span> handleStyleRow<\/span>(<\/span>c)<\/span>,<\/span> dzRow<\/span>(<\/span>c,<\/span> 0<\/span>)<\/span>]<\/span>;<\/span>
\n }<\/span>
\n for<\/span> (<\/span>var<\/span> i =<\/span> 0<\/span>;<\/span> i <<\/span> V<\/span>.<\/span>length;<\/span> i++<\/span>)<\/span> {<\/span>
\n (<\/span>function<\/span> (<\/span>idx<\/span>)<\/span> {<\/span>
\n bind<\/span>(<\/span>'b9'<\/span> +<\/span> String.<\/span>fromCharCode<\/span>(<\/span>97<\/span> +<\/span> idx)<\/span>,<\/span> function<\/span> (<\/span>)<\/span> {<\/span>
\n if<\/span> (<\/span>idx ===<\/span> 4<\/span>)<\/span> {<\/span> \/\/ \u2464 \u5341\u6863\u626b\u63cf<\/span>
\n p.<\/span>run<\/span>(<\/span>V<\/span>[<\/span>idx]<\/span>[<\/span>0<\/span>]<\/span>,<\/span> baseOpt<\/span>(<\/span>)<\/span>,<\/span> function<\/span> (<\/span>)<\/span> {<\/span>
\n var<\/span> out =<\/span> [<\/span>' \u5b9a\u5f8b\u4e00：\u843d\u76d8 matrix \u7684\u7f29\u653e\u5206\u91cf = \u624b\u67c4\u9ad8 \u00f7 2；\u624b\u67c4\u9ad8 = handleSize \u7684\u6570，\u767e\u5206\u6570\u6309\u8f68\u9053\u539a 30 \u6298\u7b97'<\/span>,<\/span>
\n ' \u5b9a\u5f8b\u4e8c：\u624b\u67c4\u90a3\u4e00\u6761\u7684\u6cbf\u8f74 x（138.8 \/ 286.8）\u4e00\u52a8\u4e0d\u52a8，\u6539\u7684\u53ea\u662f\u5782\u76f4\u4e8e\u8f68\u9053\u7684\u65b9\u5411；'<\/span>
\n +<\/span> '\u4e2d\u5fc3 y = \u8f68\u9053\u4e0b\u6cbf 244.5 +（\u624b\u67c4\u9ad8 \u00f7 2 \u2212 15）'<\/span>,<\/span>
\n ' \u624b\u67c4\u56fe\u6807\u81ea\u5df1\u7684\u76d2\u5b50\u662f 2\u00d72，\u6240\u4ee5\u5c4f\u5e55\u4e0a\u9ad8 = 2 \u00d7 \u7f29\u653e\u5206\u91cf'<\/span>]<\/span>,<\/span> hs =<\/span> [<\/span>undefined<\/span>,<\/span> 10<\/span>,<\/span> 15<\/span>,<\/span> 18<\/span>,<\/span> 30<\/span>,<\/span> '50%'<\/span>,<\/span> '100%'<\/span>,<\/span> '120%'<\/span>,<\/span> 60<\/span>,<\/span> 120<\/span>]<\/span>;<\/span>
\n var<\/span> inst =<\/span> echarts.<\/span>init<\/span>(<\/span>null<\/span>,<\/span> null<\/span>,<\/span> {<\/span> renderer<\/span>:<\/span> 'svg'<\/span>,<\/span> ssr<\/span>:<\/span> true<\/span>,<\/span> width<\/span>:<\/span> 400<\/span>,<\/span> height<\/span>:<\/span> 260<\/span> }<\/span>)<\/span>;<\/span>
\n try<\/span> {<\/span>
\n for<\/span> (<\/span>var<\/span> k =<\/span> 0<\/span>;<\/span> k <<\/span> hs.<\/span>length;<\/span> k++<\/span>)<\/span> {<\/span>
\n var<\/span> hk =<\/span> \/** @type {any} *\/<\/span> (<\/span>hs[<\/span>k]<\/span>)<\/span>;<\/span>
\n inst.<\/span>setOption<\/span>(<\/span>\/** @type {any} *\/<\/span>(<\/span>dzOpt<\/span>(<\/span>[<\/span>slider<\/span>(<\/span>25<\/span>,<\/span> 75<\/span>,<\/span> hk ===<\/span> undefined<\/span> ?<\/span> {<\/span>}<\/span> :<\/span> {<\/span> handleSize<\/span>:<\/span> hk }<\/span>)<\/span>]<\/span>)<\/span>)<\/span>,<\/span> true<\/span>)<\/span>;<\/span>
\n var<\/span> h =<\/span> handleShapes<\/span>(<\/span>svgOf<\/span>(<\/span>inst)<\/span>)<\/span>;<\/span>
\n var<\/span> want =<\/span> typeof<\/span> hk ===<\/span> 'number'<\/span> ?<\/span> hk
\n :<\/span> hk ===<\/span> undefined<\/span> ?<\/span> 30<\/span> :<\/span> 30<\/span> *<\/span> parseFloat<\/span>(<\/span>hk)<\/span> \/<\/span> 100<\/span>;<\/span>
\n out.<\/span>push<\/span>(<\/span>' handleSize='<\/span> +<\/span> JSON<\/span>.<\/span>stringify<\/span>(<\/span>hk)<\/span> +<\/span> ' \u7f29\u653e='<\/span> +<\/span> (<\/span>h.<\/span>length ?<\/span> JSON<\/span>.<\/span>stringify<\/span>(<\/span>h.<\/span>map<\/span>(<\/span>function<\/span> (<\/span>q<\/span>)<\/span> {<\/span> return<\/span> q.<\/span>\u7f29\u653e;<\/span> }<\/span>)<\/span>)<\/span> :<\/span> '（\u8bfb\u4e0d\u5230）'<\/span>)<\/span> +<\/span>
\n ' \u5c4f\u5e55y='<\/span> +<\/span> (<\/span>h.<\/span>length ?<\/span> h.<\/span>map<\/span>(<\/span>function<\/span> (<\/span>q<\/span>)<\/span> {<\/span> return<\/span> (<\/span>q.<\/span>\u4f4d\u7f6e[<\/span>1<\/span>]<\/span> –<\/span> q.<\/span>\u7f29\u653e *<\/span> 2<\/span>)<\/span> +<\/span> '..'<\/span> +<\/span> q.<\/span>\u4f4d\u7f6e[<\/span>1<\/span>]<\/span>;<\/span> }<\/span>)<\/span>.<\/span>join<\/span>(<\/span>' | '<\/span>)<\/span> :<\/span> '-'<\/span>)<\/span> +<\/span>
\n ' \u6cbf\u8f74x='<\/span> +<\/span> (<\/span>h.<\/span>length ?<\/span> JSON<\/span>.<\/span>stringify<\/span>(<\/span>h.<\/span>map<\/span>(<\/span>function<\/span> (<\/span>q<\/span>)<\/span> {<\/span> return<\/span> q.<\/span>\u4f4d\u7f6e[<\/span>0<\/span>]<\/span>;<\/span> }<\/span>)<\/span>)<\/span> :<\/span> '-'<\/span>)<\/span> +<\/span>
\n ' \u624b\u7b97\u9ad8='<\/span> +<\/span> fr<\/span>(<\/span>want)<\/span> +<\/span> ' '<\/span> +<\/span> (<\/span>h.<\/span>length &&<\/span> Math.<\/span>abs<\/span>(<\/span>2<\/span> *<\/span> h[<\/span>0<\/span>]<\/span>.<\/span>\u7f29\u653e –<\/span> want)<\/span> <<\/span> 1e-9<\/span> ?<\/span> '\u2713'<\/span> :<\/span> '\u2717'<\/span>)<\/span> +<\/span>
\n ' \u624b\u7b97\u4e2d\u5fc3y='<\/span> +<\/span> fr<\/span>(<\/span>229.5<\/span> +<\/span> want \/<\/span> 2<\/span>)<\/span> +<\/span> ' '<\/span> +<\/span> (<\/span>h.<\/span>length &&<\/span> Math.<\/span>abs<\/span>(<\/span>h[<\/span>0<\/span>]<\/span>.<\/span>\u4f4d\u7f6e[<\/span>1<\/span>]<\/span> –<\/span> (<\/span>229.5<\/span> +<\/span> want \/<\/span> 2<\/span>)<\/span>)<\/span> <<\/span> 1e-9<\/span> ?<\/span> '\u2713'<\/span> :<\/span> '\u2717'<\/span>)<\/span> +<\/span>
\n ' \u5b57\u8282='<\/span> +<\/span> svgOf<\/span>(<\/span>inst)<\/span>.<\/span>length)<\/span>;<\/span>
\n }<\/span>
\n out.<\/span>push<\/span>(<\/span>' \u21d2 120 \u90a3\u4e00\u6863：\u624b\u67c4\u4ece 169.5 \u753b\u5230 289.5，\u753b\u5e03\u53ea\u6709 260 \u9ad8 \u21d2 \u8d8a\u8fc7\u4e0b\u6cbf，\u5c4f\u5e55\u4e0a\u88ab\u5207\u6389'<\/span>)<\/span>;<\/span>
\n }<\/span> catch<\/span> (<\/span>e)<\/span> {<\/span> out.<\/span>push<\/span>(<\/span>' \u21d2 \u626b\u63cf\u629b\u9519：'<\/span> +<\/span> e.<\/span>message)<\/span>;<\/span> }<\/span>
\n finally<\/span> {<\/span> try<\/span> {<\/span> inst.<\/span>dispose<\/span>(<\/span>)<\/span>;<\/span> }<\/span> catch<\/span> (<\/span>e2)<\/span> {<\/span> }<\/span> }<\/span>
\n return<\/span> out;<\/span>
\n }<\/span>)<\/span>;<\/span>
\n return<\/span>;<\/span>
\n }<\/span>
\n if<\/span> (<\/span>idx ===<\/span> 5<\/span>)<\/span> {<\/span> \/\/ \u2465 \u4e0e\u2460\u9010\u5b57\u6bd4<\/span>
\n p.<\/span>runMany<\/span>(<\/span>[<\/span>
\n {<\/span> label<\/span>:<\/span> '\u2465-a \u57fa\u51c6（\u4e0d\u5199\u8fd9\u4e09\u952e）'<\/span>,<\/span> o<\/span>:<\/span> baseOpt<\/span>(<\/span>)<\/span>,<\/span> build<\/span>:<\/span> function<\/span> (<\/span>svg<\/span>)<\/span> {<\/span> firstSvg =<\/span> svg;<\/span> return<\/span> [<\/span>' \u5df2\u5b58\u4e0b\u57fa\u51c6\u4e32，\u957f\u5ea6='<\/span> +<\/span> svg.<\/span>length]<\/span>;<\/span> }<\/span> }<\/span>,<\/span>
\n {<\/span>
\n label<\/span>:<\/span> '\u2465-b showDetail:true + labelPrecision:2 + labelFormatter:"{value}"'<\/span>,<\/span> o<\/span>:<\/span> V<\/span>[<\/span>5<\/span>]<\/span>[<\/span>1<\/span>]<\/span>,<\/span>
\n build<\/span>:<\/span> function<\/span> (<\/span>svg<\/span>)<\/span> {<\/span>
\n var<\/span> same1 =<\/span> bare<\/span>(<\/span>svg)<\/span> ===<\/span> bare<\/span>(<\/span>firstSvg)<\/span>,<\/span> same2 =<\/span> bare2<\/span>(<\/span>svg)<\/span> ===<\/span> bare2<\/span>(<\/span>firstSvg)<\/span>;<\/span>
\n var<\/span> out =<\/span> [<\/span>' \u53ea\u5265\u7c7b\u540d zrN-cls-K \u21d2 '<\/span> +<\/span> (<\/span>same1 ?<\/span> '\u9010\u5b57\u76f8\u540c'<\/span> :<\/span> '\u4ecd\u4e0d\u540c'<\/span>)<\/span> +<\/span>
\n '；\u518d\u628a\u6bcf\u6e32\u67d3\u91cd\u7f16\u7684\u88c1\u526a\u677f id zrN-cK \u4e00\u8d77\u5f52\u96f6 \u21d2 '<\/span> +<\/span> (<\/span>same2 ?<\/span> '\u9010\u5b57\u76f8\u540c \u21d2 \u8fd9\u4e09\u952e\u5728\u9759\u6001\u56fe\u91cc\u4e00\u4e2a\u5b57\u8282\u90fd\u4e0d\u6539'<\/span> :<\/span> '\u4ecd\u4e0d\u540c \u21d2 \u4e0b\u9762\u8fd9\u884c\u6307\u51fa\u5dee\u5728\u54ea'<\/span>)<\/span>,<\/span>
\n ' \u539f\u59cb\u5b57\u8282\u5dee='<\/span> +<\/span> (<\/span>svg.<\/span>length –<\/span> firstSvg.<\/span>length)<\/span> +<\/span> (<\/span>svg.<\/span>length ===<\/span> firstSvg.<\/span>length
\n ?<\/span> '（\u8fde\u957f\u5ea6\u90fd\u6ca1\u53d8 \u21d2 \u300c\u4ecd\u4e0d\u540c\u300d\u53ea\u662f zr0\/zr1 \u8fd9\u79cd\u5e8f\u53f7\u6362\u4e86\u4e00\u8f6e）'<\/span>
\n :<\/span> '（\u6b63\u7684\u662f\u540e\u4e00\u672c\u957f \u21d2 \u957f\u51fa\u6765\u7684\u53ea\u662f id \u5e8f\u53f7\u7684\u4f4d\u6570）'<\/span>)<\/span>]<\/span>;<\/span>
\n if<\/span> (<\/span>!<\/span>same2)<\/span> {<\/span>
\n var<\/span> a =<\/span> bare2<\/span>(<\/span>svg)<\/span>,<\/span> b =<\/span> bare2<\/span>(<\/span>firstSvg)<\/span>,<\/span> k =<\/span> 0<\/span>;<\/span>
\n while<\/span> (<\/span>k <<\/span> Math.<\/span>min<\/span>(<\/span>a.<\/span>length,<\/span> b.<\/span>length)<\/span> &&<\/span> a.<\/span>charAt<\/span>(<\/span>k)<\/span> ===<\/span> b.<\/span>charAt<\/span>(<\/span>k)<\/span>)<\/span> {<\/span> k++<\/span>;<\/span> }<\/span>
\n out.<\/span>push<\/span>(<\/span>' \u7b2c\u4e00\u5904\u4e0d\u540c @'<\/span> +<\/span> k +<\/span> '：\u672c\u6863 '<\/span> +<\/span> JSON<\/span>.<\/span>stringify<\/span>(<\/span>a.<\/span>slice<\/span>(<\/span>k,<\/span> k +<\/span> 60<\/span>)<\/span>)<\/span> +<\/span>
\n ' \/ \u57fa\u51c6 '<\/span> +<\/span> JSON<\/span>.<\/span>stringify<\/span>(<\/span>b.<\/span>slice<\/span>(<\/span>k,<\/span> k +<\/span> 60<\/span>)<\/span>)<\/span>)<\/span>;<\/span>
\n }<\/span>
\n out.<\/span>push<\/span>(<\/span>' \u21d2 \u6570\u5b57\u90a3\u4e24\u53ea Text \u5efa\u51fa\u6765\u5c31\u5e26 invisible:!handleLabelShow（SliderZoomView.js:473-477），'<\/span>
\n +<\/span> '\u800c\u9ed8\u8ba4\u53ea\u6709 emphasis.handleLabel.show \u4e3a\u771f（SliderZoomModel.js:117-120）；'<\/span>
\n +<\/span> '_showDataInfo(:667-676) \u5224 toShow = \u60ac\u505c\u6216\u62d6\u52a8\u4e2d ? emphasisShow : normalShow，'<\/span>
\n +<\/span> '\u9759\u6001\u56fe\u91cc\u4e24\u6837\u90fd\u6ca1\u53d1\u751f \u21d2 \u4e00\u76f4 invisible \u21d2 \u6539\u4e86\u7b49\u4e8e\u6ca1\u6539'<\/span>)<\/span>;<\/span>
\n out.<\/span>push<\/span>(<\/span>shadowRow<\/span>(<\/span>svg)<\/span>)<\/span>;<\/span>
\n return<\/span> out;<\/span>
\n }<\/span>
\n }<\/span>
\n ]<\/span>)<\/span>;<\/span>
\n return<\/span>;<\/span>
\n }<\/span>
\n if<\/span> (<\/span>idx ===<\/span> 6<\/span>)<\/span> {<\/span> \/\/ \u2466 cursor<\/span>
\n p.<\/span>run<\/span>(<\/span>V<\/span>[<\/span>idx]<\/span>[<\/span>0<\/span>]<\/span>,<\/span> V<\/span>[<\/span>idx]<\/span>[<\/span>1<\/span>]<\/span>,<\/span> function<\/span> (<\/span>svg,<\/span> c<\/span>)<\/span> {<\/span>
\n var<\/span> css =<\/span> (<\/span>svg.<\/span>match<\/span>(<\/span>\/<\/span><style[^>]*>([\\\\s\\\\S]*?)<\\\\\/style><\/span>\/<\/span><\/span>)<\/span> ||<\/span> [<\/span>''<\/span>,<\/span> ''<\/span>]<\/span>)<\/span>[<\/span>1<\/span>]<\/span>;<\/span>
\n var<\/span> total =<\/span> (<\/span>svg.<\/span>match<\/span>(<\/span>\/<\/span>cursor<\/span>\/<\/span>g<\/span><\/span>)<\/span> ||<\/span> [<\/span>]<\/span>)<\/span>.<\/span>length,<\/span> inCss =<\/span> (<\/span>css.<\/span>match<\/span>(<\/span>\/<\/span>cursor<\/span>\/<\/span>g<\/span><\/span>)<\/span> ||<\/span> [<\/span>]<\/span>)<\/span>.<\/span>length;<\/span>
\n var<\/span> vals =<\/span> [<\/span>]<\/span>,<\/span> rx =<\/span> \/<\/span>cursor:([^;}]+)<\/span>\/<\/span>g<\/span><\/span>,<\/span> m2;<\/span>
\n while<\/span> (<\/span>(<\/span>m2 =<\/span> rx.<\/span>exec<\/span>(<\/span>css)<\/span>)<\/span>)<\/span> {<\/span> vals.<\/span>push<\/span>(<\/span>m2[<\/span>1<\/span>]<\/span>.<\/span>trim<\/span>(<\/span>)<\/span>)<\/span>;<\/span> }<\/span>
\n return<\/span> [<\/span>cursorRow<\/span>(<\/span>p.<\/span>chart)<\/span>,<\/span>
\n ' \u4e32\u91cc cursor \u5b57\u6837='<\/span> +<\/span> total +<\/span> ' \u6b21：\u5176\u4e2d <style> \u5757\u91cc '<\/span> +<\/span> inCss +<\/span> ' \u6b21\u3001\u5757\u5916 '<\/span> +<\/span> (<\/span>total –<\/span> inCss)<\/span> +<\/span> ' \u6b21'<\/span>
\n +<\/span> '（\u5757\u5916\u5fc5\u987b\u662f 0 \u21d2 \u56fe\u5143\u8eab\u4e0a\u4e00\u4e2a\u5149\u6807\u5c5e\u6027\u90fd\u4e0d\u5199）'<\/span>,<\/span>
\n ' <style> \u91cc\u7684\u5149\u6807\u7684\u503c='<\/span> +<\/span> JSON<\/span>.<\/span>stringify<\/span>(<\/span>vals)<\/span> +<\/span>
\n ' \u21d2 \u5168\u662f :hover \u9009\u4e2d\u5c42\u7684 cursor:pointer（zrender\/lib\/svg\/cssEmphasis.js:35-37），'<\/span>
\n +<\/span> '\u8ddf\u6ed1\u5757\u7684 grab \/ ew-resize \/ crosshair \u6ca1\u6709\u4e00\u4e2a\u662f\u540c\u4e00\u5904\u5199\u7684'<\/span>,<\/span>
\n handleStyleRow<\/span>(<\/span>c)<\/span>]<\/span>;<\/span>
\n }<\/span>)<\/span>;<\/span>
\n return<\/span>;<\/span>
\n }<\/span>
\n p.<\/span>run<\/span>(<\/span>V<\/span>[<\/span>idx]<\/span>[<\/span>0<\/span>]<\/span>,<\/span> V<\/span>[<\/span>idx]<\/span>[<\/span>1<\/span>]<\/span>,<\/span> std)<\/span>;<\/span>
\n }<\/span>)<\/span>;<\/span>
\n }<\/span>)<\/span>(<\/span>i)<\/span>;<\/span>
\n }<\/span>
\n p.<\/span>run<\/span>(<\/span>V<\/span>[<\/span>0<\/span>]<\/span>[<\/span>0<\/span>]<\/span>,<\/span> V<\/span>[<\/span>0<\/span>]<\/span>[<\/span>1<\/span>]<\/span>,<\/span> std)<\/span>;<\/span>
\n}<\/span><\/p>\n

\/* ===== \u9762\u677f\u5341：\u7f29\u7565\u56fe（dataShadow）\u7684\u56db\u6761\u5b9a\u5f8b\u4e0e\u4e00\u5904\u629b\u9519（\u7b2c\u5341\u516d\u8282） ===== *\/<\/span><\/p>\n

function<\/span> seqData<\/span>(<\/span>n<\/span>)<\/span> {<\/span> var<\/span> a =<\/span> [<\/span>]<\/span>;<\/span> for<\/span> (<\/span>var<\/span> i =<\/span> 0<\/span>;<\/span> i <<\/span> n;<\/span> i++<\/span>)<\/span> a.<\/span>push<\/span>(<\/span>10<\/span> +<\/span> 40<\/span> *<\/span> Math.<\/span>abs<\/span>(<\/span>Math.<\/span>sin<\/span>(<\/span>i *<\/span> 0.37<\/span>)<\/span>)<\/span>)<\/span>;<\/span> return<\/span> a;<\/span> }<\/span>
\nfunction<\/span> catNames<\/span>(<\/span>n<\/span>)<\/span> {<\/span> var<\/span> a =<\/span> [<\/span>]<\/span>;<\/span> for<\/span> (<\/span>var<\/span> i =<\/span> 0<\/span>;<\/span> i <<\/span> n;<\/span> i++<\/span>)<\/span> a.<\/span>push<\/span>(<\/span>'d'<\/span> +<\/span> i)<\/span>;<\/span> return<\/span> a;<\/span> }<\/span>
\nfunction<\/span> shadowOpt<\/span>(<\/span>n,<\/span> dz<\/span>)<\/span> {<\/span>
\n return<\/span> \/** @type {any} *\/<\/span>(<\/span>{<\/span>
\n animation<\/span>:<\/span> false<\/span>,<\/span>
\n xAxis<\/span>:<\/span> {<\/span> type<\/span>:<\/span> 'category'<\/span>,<\/span> data<\/span>:<\/span> catNames<\/span>(<\/span>n)<\/span> }<\/span>,<\/span> yAxis<\/span>:<\/span> {<\/span>}<\/span>,<\/span>
\n series<\/span>:<\/span> [<\/span>{<\/span> type<\/span>:<\/span> 'line'<\/span>,<\/span> data<\/span>:<\/span> seqData<\/span>(<\/span>n)<\/span>,<\/span> showSymbol<\/span>:<\/span> false<\/span> }<\/span>]<\/span>,<\/span>
\n dataZoom<\/span>:<\/span> [<\/span>mix<\/span>(<\/span>{<\/span> type<\/span>:<\/span> 'slider'<\/span>,<\/span> xAxisIndex<\/span>:<\/span> 0<\/span>,<\/span> start<\/span>:<\/span> 0<\/span>,<\/span> end<\/span>:<\/span> 100<\/span> }<\/span>,<\/span> dz ||<\/span> {<\/span>}<\/span>)<\/span>]<\/span>
\n }<\/span>)<\/span>;<\/span>
\n}<\/span>
\n\/\/ \u4e00\u6279 option \u5404\u81ea\u6e32\u67d3\u4e00\u6b21，\u4ea4\u7ed9\u540c\u4e00\u4e2a\u8bfb\u6570\u51fd\u6570\u2014\u2014\u6bd4\u5728\u540c\u4e00\u4e2a\u5bb9\u5668\u91cc\u8fde\u6309\u56db\u6b21\u66f4\u4e0d\u5bb9\u6613\u770b\u9519<\/span>
\nfunction<\/span> ssrSweep<\/span>(<\/span>cases,<\/span> mkOpt,<\/span> read,<\/span> w,<\/span> h<\/span>)<\/span> {<\/span>
\n var<\/span> out =<\/span> [<\/span>]<\/span>,<\/span> inst =<\/span> echarts.<\/span>init<\/span>(<\/span>null<\/span>,<\/span> null<\/span>,<\/span> {<\/span>
\n renderer<\/span>:<\/span> 'svg'<\/span>,<\/span> ssr<\/span>:<\/span> true<\/span>,<\/span> width<\/span>:<\/span> w ||<\/span> 400<\/span>,<\/span> height<\/span>:<\/span> h ||<\/span> 260<\/span>
\n }<\/span>)<\/span>;<\/span>
\n try<\/span> {<\/span>
\n for<\/span> (<\/span>var<\/span> i =<\/span> 0<\/span>;<\/span> i <<\/span> cases.<\/span>length;<\/span> i++<\/span>)<\/span> {<\/span>
\n inst.<\/span>setOption<\/span>(<\/span>\/** @type {any} *\/<\/span>(<\/span>mkOpt<\/span>(<\/span>cases[<\/span>i]<\/span>)<\/span>)<\/span>,<\/span> true<\/span>)<\/span>;<\/span>
\n out =<\/span> out.<\/span>concat<\/span>(<\/span>flat<\/span>(<\/span>read<\/span>(<\/span>cases[<\/span>i]<\/span>,<\/span> svgOf<\/span>(<\/span>inst)<\/span>,<\/span> i)<\/span>)<\/span>)<\/span>;<\/span>
\n }<\/span>
\n }<\/span> catch<\/span> (<\/span>e)<\/span> {<\/span> out.<\/span>push<\/span>(<\/span>' \u21d2 \u626b\u63cf\u629b\u9519：'<\/span> +<\/span> e.<\/span>message)<\/span>;<\/span> }<\/span>
\n finally<\/span> {<\/span> try<\/span> {<\/span> inst.<\/span>dispose<\/span>(<\/span>)<\/span>;<\/span> }<\/span> catch<\/span> (<\/span>e2)<\/span> {<\/span> }<\/span> }<\/span>
\n return<\/span> out;<\/span>
\n}<\/span><\/p>\n

function<\/span> initPanel10<\/span>(<\/span>)<\/span> {<\/span>
\n var<\/span> p =<\/span> makePanel<\/span>(<\/span>'p10'<\/span>)<\/span>;<\/span>
\n \/** @type {any[][]} *\/<\/span>
\n var<\/span> V<\/span> =<\/span> [<\/span>
\n [<\/span>'\u2460 12 \u4e2a\u7c7b\u76ee（\u9876\u70b9 12）'<\/span>,<\/span> baseOpt<\/span>(<\/span>)<\/span>]<\/span>,<\/span>
\n [<\/span>'\u2461 1096 \u5929（stride=4 \u21d2 \u4fdd\u7559 274 \u4e2a\u4e0b\u6807，\u843d\u76d8 275 \u4e2a\u9876\u70b9）'<\/span>,<\/span> dailyOpt<\/span>(<\/span>[<\/span>{<\/span> type<\/span>:<\/span> 'slider'<\/span>,<\/span> xAxisIndex<\/span>:<\/span> 0<\/span>,<\/span> start<\/span>:<\/span> 0<\/span>,<\/span> end<\/span>:<\/span> 100<\/span> }<\/span>]<\/span>)<\/span>]<\/span>,<\/span>
\n [<\/span>'\u2462 149 \/ 150 \u5929'<\/span>,<\/span> baseOpt<\/span>(<\/span>)<\/span>]<\/span>,<\/span>
\n [<\/span>'\u2463 449 \/ 450 \/ 451 \u5929'<\/span>,<\/span> baseOpt<\/span>(<\/span>)<\/span>]<\/span>,<\/span>
\n [<\/span>'\u2464 \u5f71\u5b50\u5403\u4e0d\u5403\u7a97\u53e3？\u4e09\u6863 + \u56db\u79cd filterMode'<\/span>,<\/span> baseOpt<\/span>(<\/span>)<\/span>]<\/span>,<\/span>
\n [<\/span>'\u2465 \u7f3a\u5931\u65e5\u7a97\u53e3：\u65ad\u53e3\u8865 0'<\/span>,<\/span> baseOpt<\/span>(<\/span>)<\/span>]<\/span>,<\/span>
\n [<\/span>'\u2466 \u5bb9\u5668\u5bbd 200\/400\/600\/800'<\/span>,<\/span> baseOpt<\/span>(<\/span>)<\/span>]<\/span>,<\/span>
\n [<\/span>'\u2467 \u767d\u540d\u5355：11 \u79cd\u7cfb\u5217\u8c01\u6709\u5f71\u5b50，\u518d\u5f3a\u5236 showDataShadow:true \u53cd\u8bc1'<\/span>,<\/span> baseOpt<\/span>(<\/span>)<\/span>]<\/span>,<\/span>
\n [<\/span>'\u2468 themeRiver：\u5148\u5f52\u56e0\u629b\u9519，\u518d\u770b singleAxis \u4e0b\u6302 slider'<\/span>,<\/span> \/** @type {any} *\/<\/span>(<\/span>{<\/span>
\n animation<\/span>:<\/span> false<\/span>,<\/span>
\n singleAxis<\/span>:<\/span> {<\/span> type<\/span>:<\/span> 'category'<\/span> }<\/span>,<\/span>
\n series<\/span>:<\/span> [<\/span>{<\/span> type<\/span>:<\/span> 'themeRiver'<\/span>,<\/span> data<\/span>:<\/span> [<\/span>[<\/span>0<\/span>,<\/span> 'a'<\/span>,<\/span> 12<\/span>]<\/span>,<\/span> [<\/span>1<\/span>,<\/span> 'a'<\/span>,<\/span> 31<\/span>]<\/span>,<\/span> [<\/span>2<\/span>,<\/span> 'b'<\/span>,<\/span> 22<\/span>]<\/span>,<\/span> [<\/span>3<\/span>,<\/span> 'a'<\/span>,<\/span> 40<\/span>]<\/span>]<\/span> }<\/span>]<\/span>,<\/span>
\n dataZoom<\/span>:<\/span> [<\/span>{<\/span> type<\/span>:<\/span> 'slider'<\/span>,<\/span> start<\/span>:<\/span> 0<\/span>,<\/span> end<\/span>:<\/span> 100<\/span> }<\/span>]<\/span>
\n }<\/span>)<\/span>]<\/span>
\n ]<\/span>;<\/span>
\n function<\/span> strideRead<\/span>(<\/span>c,<\/span> svg<\/span>)<\/span> {<\/span>
\n var<\/span> s =<\/span> shadowShape<\/span>(<\/span>svg)<\/span>,<\/span> stride =<\/span> Math.<\/span>round<\/span>(<\/span>c \/<\/span> 300<\/span>)<\/span>;<\/span>
\n var<\/span> pred =<\/span> stride ><\/span> 0<\/span> ?<\/span> Math.<\/span>ceil<\/span>(<\/span>c \/<\/span> stride)<\/span> :<\/span> c;<\/span>
\n return<\/span> [<\/span>' n='<\/span> +<\/span> c +<\/span> ' stride=Math.round('<\/span> +<\/span> c +<\/span> '\/300)='<\/span> +<\/span> stride +<\/span> ' \u9884\u6d4b\u9876\u70b9='<\/span> +<\/span> pred +<\/span>
\n ' \u5b9e\u6d4b='<\/span> +<\/span> s.<\/span>\u9876\u70b9 +<\/span> ' '<\/span> +<\/span> (<\/span>pred ===<\/span> s.<\/span>\u9876\u70b9 ?<\/span> '\u2713'<\/span> :<\/span> '\u2717'<\/span>)<\/span> +<\/span> ' \u6b65\u957f='<\/span> +<\/span> fr<\/span>(<\/span>s.<\/span>\u6b65\u957f)<\/span> +<\/span>
\n ' y\u4e0a\u4e0b='<\/span> +<\/span> frs<\/span>(<\/span>s.<\/span>y)<\/span> +<\/span> ' \u672b\u70b9='<\/span> +<\/span> JSON<\/span>.<\/span>stringify<\/span>(<\/span>s.<\/span>\u672b\u70b9)<\/span> +<\/span> ' \u5b57\u8282='<\/span> +<\/span> svg.<\/span>length]<\/span>;<\/span>
\n }<\/span>
\n for<\/span> (<\/span>var<\/span> i =<\/span> 0<\/span>;<\/span> i <<\/span> V<\/span>.<\/span>length;<\/span> i++<\/span>)<\/span> {<\/span>
\n (<\/span>function<\/span> (<\/span>idx<\/span>)<\/span> {<\/span>
\n bind<\/span>(<\/span>'b10'<\/span> +<\/span> String.<\/span>fromCharCode<\/span>(<\/span>97<\/span> +<\/span> idx)<\/span>,<\/span> function<\/span> (<\/span>)<\/span> {<\/span>
\n if<\/span> (<\/span>idx ===<\/span> 1<\/span>)<\/span> {<\/span>
\n p.<\/span>run<\/span>(<\/span>V<\/span>[<\/span>idx]<\/span>[<\/span>0<\/span>]<\/span>,<\/span> V<\/span>[<\/span>idx]<\/span>[<\/span>1<\/span>]<\/span>,<\/span> function<\/span> (<\/span>svg,<\/span> c<\/span>)<\/span> {<\/span>
\n var<\/span> sv =<\/span> shadowShape<\/span>(<\/span>svg)<\/span>,<\/span> n =<\/span> DAILY<\/span>.<\/span>length,<\/span> stride =<\/span> Math.<\/span>round<\/span>(<\/span>n \/<\/span> 300<\/span>)<\/span>;<\/span>
\n var<\/span> kept =<\/span> 0<\/span>,<\/span> nullKept =<\/span> [<\/span>]<\/span>;<\/span>
\n for<\/span> (<\/span>var<\/span> k =<\/span> 0<\/span>;<\/span> k <<\/span> n;<\/span> k +=<\/span> stride)<\/span> {<\/span> kept++<\/span>;<\/span> if<\/span> (<\/span>DAILY<\/span>[<\/span>k]<\/span>.<\/span>sales ==<\/span> null<\/span>)<\/span> {<\/span> nullKept.<\/span>push<\/span>(<\/span>k)<\/span>;<\/span> }<\/span> }<\/span>
\n var<\/span> allNull =<\/span> [<\/span>]<\/span>;<\/span>
\n for<\/span> (<\/span>var<\/span> m =<\/span> 0<\/span>;<\/span> m <<\/span> n;<\/span> m++<\/span>)<\/span> {<\/span> if<\/span> (<\/span>DAILY<\/span>[<\/span>m]<\/span>.<\/span>sales ==<\/span> null<\/span>)<\/span> {<\/span> allNull.<\/span>push<\/span>(<\/span>m)<\/span>;<\/span> }<\/span> }<\/span>
\n var<\/span> want =<\/span> kept –<\/span> nullKept.<\/span>length +<\/span> 2<\/span> *<\/span> nullKept.<\/span>length;<\/span>
\n return<\/span> [<\/span>shadowRow<\/span>(<\/span>svg)<\/span>,<\/span>
\n ' \u62bd\u7a00\u8d26：n='<\/span> +<\/span> n +<\/span> '，\u5f71\u5b50\u5bbd（=\u8f68\u9053\u957f）=300 \u21d2 stride=Math.round('<\/span> +<\/span> n +<\/span> '\/300)='<\/span> +<\/span> stride +<\/span>
\n ' \u21d2 \u53ea\u7559 k % '<\/span> +<\/span> stride +<\/span> ' === 0 \u7684\u4e0b\u6807，\u5171 '<\/span> +<\/span> kept +<\/span> ' \u4e2a'<\/span>,<\/span>
\n ' \u5168\u8868 sales \u4e3a null \u7684\u4e0b\u6807='<\/span> +<\/span> JSON<\/span>.<\/span>stringify<\/span>(<\/span>allNull)<\/span> +<\/span> '，\u5176\u4e2d\u843d\u5728\u4fdd\u7559\u4e0b\u6807\u91cc\u7684='<\/span> +<\/span>
\n JSON<\/span>.<\/span>stringify<\/span>(<\/span>nullKept)<\/span> +<\/span> '（\u53e6 '<\/span> +<\/span> (<\/span>allNull.<\/span>length –<\/span> nullKept.<\/span>length)<\/span> +<\/span>
\n ' \u4e2a\u6b63\u597d\u88ab\u62bd\u7a00\u8df3\u8fc7\u4e86，\u4e00\u6b21\u65ad\u53e3\u90fd\u4e0d\u89e6\u53d1）'<\/span>,<\/span>
\n ' \u21d2 \u9876\u70b9 = \u4fdd\u7559 '<\/span> +<\/span> kept +<\/span> ' \u2212 \u7a7a\u503c\u4e0d\u5199\u771f\u70b9 '<\/span> +<\/span> nullKept.<\/span>length +<\/span> ' + \u6bcf\u5904\u65ad\u53e3\u8fdb\u51fa\u5404\u8865\u4e00\u4e2a 0 \u70b9 '<\/span>
\n +<\/span> 2<\/span> *<\/span> nullKept.<\/span>length +<\/span> ' = '<\/span> +<\/span> want +<\/span> '，\u5b9e\u6d4b '<\/span> +<\/span> sv.<\/span>\u9876\u70b9 +<\/span> (<\/span>want ===<\/span> sv.<\/span>\u9876\u70b9 ?<\/span> ' \u2713'<\/span> :<\/span> ' \u2717'<\/span>)<\/span>,<\/span>
\n ' \u843d\u5728 0 \u7ebf\u4e0a\u7684 x='<\/span> +<\/span> JSON<\/span>.<\/span>stringify<\/span>(<\/span>sv.<\/span>\u96f6\u503c\u70b9)<\/span> +<\/span> '（\u5c31\u662f\u4e0b\u6807 804 \u90a3\u4e00\u5904\u65ad\u53e3\u7684\u4e24\u4fa7；'<\/span>
\n +<\/span> '\u8df3\u8fc7\u7684\u884c\u4e5f\u7167\u52a0 step，\u6240\u4ee5\u8865\u70b9\u4ecd\u843d\u5728 804 \u524d\u540e\u5404\u4e00\u683c\u7684\u95f4\u8ddd\u4e0a）'<\/span>,<\/span>
\n geometryRow<\/span>(<\/span>svg)<\/span>,<\/span> dzRow<\/span>(<\/span>c,<\/span> 0<\/span>)<\/span>]<\/span>;<\/span>
\n }<\/span>)<\/span>;<\/span>
\n return<\/span>;<\/span>
\n }<\/span>
\n if<\/span> (<\/span>idx ===<\/span> 2<\/span>)<\/span> {<\/span>
\n p.<\/span>run<\/span>(<\/span>V<\/span>[<\/span>idx]<\/span>[<\/span>0<\/span>]<\/span>,<\/span> baseOpt<\/span>(<\/span>)<\/span>,<\/span> function<\/span> (<\/span>)<\/span> {<\/span>
\n return<\/span> [<\/span>' \u5b9a\u5f8b\u4e00：stride = Math.round(\u6761\u6570 \u00f7 \u5f71\u5b50\u5bbdpx)，\u8df3\u8fc7\u6761\u4ef6\u662f index % stride（SliderZoomView.js:290-293）'<\/span>,<\/span>
\n ' \u21d2 stride \u4e3a 0 \u4e0e 1 \u90fd\u4e0d\u8df3\u70b9：149 \u5929 stride 0\u3001150 \u5929 stride 1，\u4e24\u6863\u9876\u70b9\u6570\u90fd\u7b49\u4e8e\u5929\u6570\u672c\u8eab'<\/span>]<\/span>
\n .<\/span>concat<\/span>(<\/span>ssrSweep<\/span>(<\/span>[<\/span>148<\/span>,<\/span> 149<\/span>,<\/span> 150<\/span>,<\/span> 151<\/span>,<\/span> 299<\/span>,<\/span> 300<\/span>]<\/span>,<\/span> function<\/span> (<\/span>n<\/span>)<\/span> {<\/span> return<\/span> shadowOpt<\/span>(<\/span>n)<\/span>;<\/span> }<\/span>,<\/span> strideRead)<\/span>)<\/span>;<\/span>
\n }<\/span>)<\/span>;<\/span>
\n return<\/span>;<\/span>
\n }<\/span>
\n if<\/span> (<\/span>idx ===<\/span> 3<\/span>)<\/span> {<\/span>
\n p.<\/span>run<\/span>(<\/span>V<\/span>[<\/span>idx]<\/span>[<\/span>0<\/span>]<\/span>,<\/span> baseOpt<\/span>(<\/span>)<\/span>,<\/span> function<\/span> (<\/span>)<\/span> {<\/span>
\n return<\/span> [<\/span>' \u771f\u6b63\u7684\u5206\u754c\u5728 stride \u4ece 1 \u6da8\u5230 2 \u7684\u90a3\u4e00\u6863：n=450（Math.round(450\/300)=2）'<\/span>]<\/span>
\n .<\/span>concat<\/span>(<\/span>ssrSweep<\/span>(<\/span>[<\/span>400<\/span>,<\/span> 449<\/span>,<\/span> 450<\/span>,<\/span> 451<\/span>,<\/span> 601<\/span>,<\/span> 900<\/span>,<\/span> 1096<\/span>]<\/span>,<\/span> function<\/span> (<\/span>n<\/span>)<\/span> {<\/span> return<\/span> shadowOpt<\/span>(<\/span>n)<\/span>;<\/span> }<\/span>,<\/span> strideRead)<\/span>)<\/span>;<\/span>
\n }<\/span>)<\/span>;<\/span>
\n return<\/span>;<\/span>
\n }<\/span>
\n if<\/span> (<\/span>idx ===<\/span> 4<\/span>)<\/span> {<\/span>
\n p.<\/span>run<\/span>(<\/span>V<\/span>[<\/span>idx]<\/span>[<\/span>0<\/span>]<\/span>,<\/span> baseOpt<\/span>(<\/span>)<\/span>,<\/span> function<\/span> (<\/span>)<\/span> {<\/span>
\n var<\/span> out =<\/span> [<\/span>' \u5b9a\u5f8b\u4e09：\u5f71\u5b50\u6052\u7528\u5168\u91cf\u3002\u4e09\u6863\u7a97\u53e3\u7684 <polyline points> \u5e94\u5f53\u9010\u5b57\u7b26\u76f8\u540c'<\/span>]<\/span>,<\/span> last =<\/span> ''<\/span>;<\/span>
\n out =<\/span> out.<\/span>concat<\/span>(<\/span>ssrSweep<\/span>(<\/span>[<\/span>[<\/span>0<\/span>,<\/span> 100<\/span>]<\/span>,<\/span> [<\/span>25<\/span>,<\/span> 75<\/span>]<\/span>,<\/span> [<\/span>50<\/span>,<\/span> 100<\/span>]<\/span>]<\/span>,<\/span> function<\/span> (<\/span>we<\/span>)<\/span> {<\/span>
\n return<\/span> shadowOpt<\/span>(<\/span>12<\/span>,<\/span> {<\/span> start<\/span>:<\/span> we[<\/span>0<\/span>]<\/span>,<\/span> end<\/span>:<\/span> we[<\/span>1<\/span>]<\/span> }<\/span>)<\/span>;<\/span>
\n }<\/span>,<\/span> function<\/span> (<\/span>we,<\/span> svg<\/span>)<\/span> {<\/span>
\n var<\/span> s =<\/span> shadowShape<\/span>(<\/span>svg)<\/span>,<\/span> same =<\/span> (<\/span>last ===<\/span> s.<\/span>points)<\/span>;<\/span>
\n var<\/span> r =<\/span> [<\/span>' '<\/span> +<\/span> we[<\/span>0<\/span>]<\/span> +<\/span> '~'<\/span> +<\/span> we[<\/span>1<\/span>]<\/span> +<\/span> ' \u9876\u70b9='<\/span> +<\/span> s.<\/span>\u9876\u70b9 +<\/span> ' \u9996\u70b9='<\/span> +<\/span> JSON<\/span>.<\/span>stringify<\/span>(<\/span>s.<\/span>\u9996\u70b9)<\/span> +<\/span>
\n ' \u672b\u70b9='<\/span> +<\/span> JSON<\/span>.<\/span>stringify<\/span>(<\/span>s.<\/span>\u672b\u70b9)<\/span> +<\/span> (<\/span>last ?<\/span> ' \u4e0e\u4e0a\u4e00\u6863'<\/span> +<\/span> (<\/span>same ?<\/span> '\u9010\u5b57\u76f8\u540c \u2713'<\/span> :<\/span> '\u4e0d\u540c \u2717'<\/span>)<\/span> :<\/span> ''<\/span>)<\/span>]<\/span>;<\/span>
\n last =<\/span> s.<\/span>points;<\/span>
\n return<\/span> r;<\/span>
\n }<\/span>)<\/span>)<\/span>;<\/span>
\n out.<\/span>push<\/span>(<\/span>' filterMode \u56db\u79cd\u5404\u8bd5（\u6bcf\u79cd\u7684\u4e09\u6863\u76f8\u540c\u5224\u5b9a）'<\/span>)<\/span>;<\/span>
\n var<\/span> modes =<\/span> [<\/span>'filter'<\/span>,<\/span> 'weakFilter'<\/span>,<\/span> 'empty'<\/span>,<\/span> 'none'<\/span>]<\/span>;<\/span>
\n for<\/span> (<\/span>var<\/span> k =<\/span> 0<\/span>;<\/span> k <<\/span> modes.<\/span>length;<\/span> k++<\/span>)<\/span> {<\/span>
\n (<\/span>function<\/span> (<\/span>fm<\/span>)<\/span> {<\/span>
\n var<\/span> ps =<\/span> [<\/span>]<\/span>;<\/span>
\n ssrSweep<\/span>(<\/span>[<\/span>[<\/span>0<\/span>,<\/span> 100<\/span>]<\/span>,<\/span> [<\/span>25<\/span>,<\/span> 75<\/span>]<\/span>,<\/span> [<\/span>50<\/span>,<\/span> 100<\/span>]<\/span>]<\/span>,<\/span> function<\/span> (<\/span>we<\/span>)<\/span> {<\/span>
\n return<\/span> shadowOpt<\/span>(<\/span>12<\/span>,<\/span> {<\/span> start<\/span>:<\/span> we[<\/span>0<\/span>]<\/span>,<\/span> end<\/span>:<\/span> we[<\/span>1<\/span>]<\/span>,<\/span> filterMode<\/span>:<\/span> fm }<\/span>)<\/span>;<\/span>
\n }<\/span>,<\/span> function<\/span> (<\/span>we,<\/span> svg<\/span>)<\/span> {<\/span> ps.<\/span>push<\/span>(<\/span>(<\/span>shadowShape<\/span>(<\/span>svg)<\/span>.<\/span>points ||<\/span> ''<\/span>)<\/span>.<\/span>slice<\/span>(<\/span>0<\/span>,<\/span> 60<\/span>)<\/span>)<\/span>;<\/span> }<\/span>)<\/span>;<\/span>
\n out.<\/span>push<\/span>(<\/span>' filterMode='<\/span> +<\/span> fm +<\/span> ' \u4e09\u6863'<\/span> +<\/span> (<\/span>ps[<\/span>0<\/span>]<\/span> ===<\/span> ps[<\/span>1<\/span>]<\/span> &&<\/span> ps[<\/span>1<\/span>]<\/span> ===<\/span> ps[<\/span>2<\/span>]<\/span> ?<\/span> '\u76f8\u540c \u2713'<\/span> :<\/span> '\u4e0d\u540c \u2717'<\/span>)<\/span> +<\/span>
\n '（\u753b\u9762\u4e0a\u6761\u6570\u7167\u6837\u88ab\u88c1，\u53ea\u662f\u5f71\u5b50\u4e0d\u88c1）'<\/span>)<\/span>;<\/span>
\n }<\/span>)<\/span>(<\/span>modes[<\/span>k]<\/span>)<\/span>;<\/span>
\n }<\/span>
\n return<\/span> out;<\/span>
\n }<\/span>)<\/span>;<\/span>
\n return<\/span>;<\/span>
\n }<\/span>
\n if<\/span> (<\/span>idx ===<\/span> 5<\/span>)<\/span> {<\/span>
\n p.<\/span>run<\/span>(<\/span>V<\/span>[<\/span>idx]<\/span>[<\/span>0<\/span>]<\/span>,<\/span> baseOpt<\/span>(<\/span>)<\/span>,<\/span> function<\/span> (<\/span>)<\/span> {<\/span>
\n var<\/span> miss =<\/span> {<\/span> '2025-03-14'<\/span>:<\/span> 1<\/span>,<\/span> '2025-03-15'<\/span>:<\/span> 1<\/span>,<\/span> '2025-07-22'<\/span>:<\/span> 1<\/span>,<\/span> '2025-11-03'<\/span>:<\/span> 1<\/span> }<\/span>;<\/span>
\n var<\/span> centers =<\/span> [<\/span>933<\/span>,<\/span> 803<\/span>,<\/span> 1037<\/span>]<\/span>;<\/span>
\n return<\/span> [<\/span>' \u5b9a\u5f8b\u56db：\u7a7a\u503c\u6309 0 \u843d\u5e95，\u4e14\u53ea\u5728\u300c\u8fdb\u65ad\u53e3 \/ \u51fa\u65ad\u53e3\u300d\u5404\u8865\u4e00\u4e2a\u70b9（:305-310）'<\/span>]<\/span>
\n .<\/span>concat<\/span>(<\/span>ssrSweep<\/span>(<\/span>centers,<\/span> function<\/span> (<\/span>ct<\/span>)<\/span> {<\/span>
\n var<\/span> rows =<\/span> DAILY<\/span>.<\/span>slice<\/span>(<\/span>ct –<\/span> 6<\/span>,<\/span> ct +<\/span> 7<\/span>)<\/span>;<\/span>
\n return<\/span> \/** @type {any} *\/<\/span>(<\/span>{<\/span>
\n animation<\/span>:<\/span> false<\/span>,<\/span>
\n xAxis<\/span>:<\/span> {<\/span> type<\/span>:<\/span> 'category'<\/span>,<\/span> data<\/span>:<\/span> rows.<\/span>map<\/span>(<\/span>function<\/span> (<\/span>r<\/span>)<\/span> {<\/span> return<\/span> r.<\/span>date;<\/span> }<\/span>)<\/span> }<\/span>,<\/span> yAxis<\/span>:<\/span> {<\/span>}<\/span>,<\/span>
\n series<\/span>:<\/span> [<\/span>{<\/span>
\n type<\/span>:<\/span> 'line'<\/span>,<\/span> showSymbol<\/span>:<\/span> false<\/span>,<\/span>
\n data<\/span>:<\/span> rows.<\/span>map<\/span>(<\/span>function<\/span> (<\/span>r<\/span>)<\/span> {<\/span> return<\/span> miss[<\/span>r.<\/span>date]<\/span> ?<\/span> null<\/span> :<\/span> r.<\/span>sales;<\/span> }<\/span>)<\/span>
\n }<\/span>]<\/span>,<\/span>
\n dataZoom<\/span>:<\/span> [<\/span>{<\/span> type<\/span>:<\/span> 'slider'<\/span>,<\/span> xAxisIndex<\/span>:<\/span> 0<\/span>,<\/span> start<\/span>:<\/span> 0<\/span>,<\/span> end<\/span>:<\/span> 100<\/span> }<\/span>]<\/span>
\n }<\/span>)<\/span>;<\/span>
\n }<\/span>,<\/span> function<\/span> (<\/span>ct,<\/span> svg<\/span>)<\/span> {<\/span>
\n var<\/span> s =<\/span> shadowShape<\/span>(<\/span>svg)<\/span>,<\/span> rows =<\/span> DAILY<\/span>.<\/span>slice<\/span>(<\/span>ct –<\/span> 6<\/span>,<\/span> ct +<\/span> 7<\/span>)<\/span>;<\/span>
\n return<\/span> ' \u4e2d\u5fc3\u4e0b\u6807 '<\/span> +<\/span> ct +<\/span> ' \u5929\u6570='<\/span> +<\/span> rows.<\/span>length +<\/span>
\n ' \u7f3a\u7684\u65e5='<\/span> +<\/span> JSON<\/span>.<\/span>stringify<\/span>(<\/span>rows.<\/span>filter<\/span>(<\/span>function<\/span> (<\/span>r<\/span>)<\/span> {<\/span> return<\/span> miss[<\/span>r.<\/span>date]<\/span>;<\/span> }<\/span>)<\/span>.<\/span>map<\/span>(<\/span>function<\/span> (<\/span>r<\/span>)<\/span> {<\/span> return<\/span> r.<\/span>date;<\/span> }<\/span>)<\/span>)<\/span> +<\/span>
\n ' \u9876\u70b9='<\/span> +<\/span> s.<\/span>\u9876\u70b9 +<\/span> ' \u843d 0 \u7ebf\u7684 x='<\/span> +<\/span> JSON<\/span>.<\/span>stringify<\/span>(<\/span>s.<\/span>\u96f6\u503c\u70b9)<\/span> +<\/span> ' y\u4e0a\u4e0b='<\/span> +<\/span> frs<\/span>(<\/span>s.<\/span>y)<\/span>;<\/span>
\n }<\/span>)<\/span>)<\/span>
\n .<\/span>concat<\/span>(<\/span>[<\/span>' \u21d2 \u5355\u7f3a\u4e00\u5929 13\u219214 \u9876\u70b9；\u8fde\u7f3a\u4e24\u5929\u4ecd 13 \u9876\u70b9（\u4e2d\u95f4\u90a3\u6bb5\u4e0d\u8865）'<\/span>]<\/span>)<\/span>;<\/span>
\n }<\/span>)<\/span>;<\/span>
\n return<\/span>;<\/span>
\n }<\/span>
\n if<\/span> (<\/span>idx ===<\/span> 6<\/span>)<\/span> {<\/span>
\n p.<\/span>run<\/span>(<\/span>V<\/span>[<\/span>idx]<\/span>[<\/span>0<\/span>]<\/span>,<\/span> baseOpt<\/span>(<\/span>)<\/span>,<\/span> function<\/span> (<\/span>)<\/span> {<\/span>
\n var<\/span> widths =<\/span> [<\/span>200<\/span>,<\/span> 400<\/span>,<\/span> 600<\/span>,<\/span> 800<\/span>]<\/span>,<\/span> out =<\/span> [<\/span>
\n ' \u5206\u6bcd = \u5f71\u5b50\u5bbd = \u8f68\u9053\u957f，\u6240\u4ee5\u5b83\u968f\u5bb9\u5668\u5bbd\u5ea6\u642c：\u540c\u4e00\u4efd 1000 \u6761\u6570\u636e，\u56db\u79cd\u5bbd\u5ea6\u5404\u8d77\u4e00\u4e2a ssr \u5b9e\u4f8b'<\/span>]<\/span>,<\/span> bad =<\/span> 0<\/span>;<\/span>
\n for<\/span> (<\/span>var<\/span> k =<\/span> 0<\/span>;<\/span> k <<\/span> widths.<\/span>length;<\/span> k++<\/span>)<\/span> {<\/span>
\n var<\/span> inst =<\/span> echarts.<\/span>init<\/span>(<\/span>null<\/span>,<\/span> null<\/span>,<\/span> {<\/span> renderer<\/span>:<\/span> 'svg'<\/span>,<\/span> ssr<\/span>:<\/span> true<\/span>,<\/span> width<\/span>:<\/span> widths[<\/span>k]<\/span>,<\/span> height<\/span>:<\/span> 260<\/span> }<\/span>)<\/span>;<\/span>
\n try<\/span> {<\/span>
\n inst.<\/span>setOption<\/span>(<\/span>\/** @type {any} *\/<\/span>(<\/span>shadowOpt<\/span>(<\/span>1000<\/span>)<\/span>)<\/span>,<\/span> true<\/span>)<\/span>;<\/span>
\n var<\/span> s =<\/span> shadowShape<\/span>(<\/span>svgOf<\/span>(<\/span>inst)<\/span>)<\/span>;<\/span>
\n var<\/span> span =<\/span> s.<\/span>\u672b\u70b9 &&<\/span> s.<\/span>\u9996\u70b9 ?<\/span> +<\/span>(<\/span>s.<\/span>\u672b\u70b9[<\/span>0<\/span>]<\/span> –<\/span> s.<\/span>\u9996\u70b9[<\/span>0<\/span>]<\/span>)<\/span>.<\/span>toFixed<\/span>(<\/span>2<\/span>)<\/span> :<\/span> null<\/span>;<\/span>
\n var<\/span> st =<\/span> Math.<\/span>round<\/span>(<\/span>1000<\/span> \/<\/span> span)<\/span>,<\/span> want =<\/span> Math.<\/span>ceil<\/span>(<\/span>1000<\/span> \/<\/span> st)<\/span>;<\/span>
\n if<\/span> (<\/span>want !==<\/span> s.<\/span>\u9876\u70b9)<\/span> bad++<\/span>;<\/span>
\n out.<\/span>push<\/span>(<\/span>' \u5bb9\u5668\u5bbd='<\/span> +<\/span> widths[<\/span>k]<\/span> +<\/span> ' \u9876\u70b9='<\/span> +<\/span> s.<\/span>\u9876\u70b9 +<\/span> ' \u6b65\u957f='<\/span> +<\/span> fr<\/span>(<\/span>s.<\/span>\u6b65\u957f)<\/span> +<\/span>
\n ' x\u8de8\u5ea6='<\/span> +<\/span> fr<\/span>(<\/span>span)<\/span> +<\/span> ' \u53cd\u7b97stride='<\/span> +<\/span> (<\/span>s.<\/span>\u9876\u70b9 ?<\/span> Math.<\/span>round<\/span>(<\/span>1000<\/span> \/<\/span> s.<\/span>\u9876\u70b9)<\/span> :<\/span> '?'<\/span>)<\/span> +<\/span>
\n ' \u624b\u7b97stride=Math.round(1000\/'<\/span> +<\/span> fr<\/span>(<\/span>span)<\/span> +<\/span> ')='<\/span> +<\/span> st +<\/span>
\n ' \u624b\u7b97\u9876\u70b9=Math.ceil(1000\/'<\/span> +<\/span> st +<\/span> ')='<\/span> +<\/span> want +<\/span> (<\/span>want ===<\/span> s.<\/span>\u9876\u70b9 ?<\/span> ' \u2713'<\/span> :<\/span> ' \u2717'<\/span>)<\/span>)<\/span>;<\/span>
\n }<\/span> catch<\/span> (<\/span>e)<\/span> {<\/span> out.<\/span>push<\/span>(<\/span>' \u5bbd='<\/span> +<\/span> widths[<\/span>k]<\/span> +<\/span> ' \u629b\u9519：'<\/span> +<\/span> e.<\/span>message)<\/span>;<\/span> }<\/span>
\n finally<\/span> {<\/span> try<\/span> {<\/span> inst.<\/span>dispose<\/span>(<\/span>)<\/span>;<\/span> }<\/span> catch<\/span> (<\/span>e2)<\/span> {<\/span> }<\/span> }<\/span>
\n }<\/span>
\n return<\/span> out.<\/span>concat<\/span>(<\/span>[<\/span>' \u21d2 \u9876\u70b9\u6570 = ceil(\u6761\u6570 \u00f7 stride)，stride \u53c8\u7531\u5f71\u5b50\u5bbd（=\u8f68\u9053\u957f）\u5b9a \u21d2 '<\/span>
\n +<\/span> bad +<\/span> ' \u6863\u4e0e\u624b\u7b97\u9876\u70b9\u4e0d\u7b26；\u5bbd 600 \u4e0e 800 \u90fd\u662f stride 2，\u56e0\u4e3a Math.round(1000\/449.5)=Math.round(1000\/599.4)=2 \u21d2 \u5f71\u5b50\u7a00\u5230\u4e00\u5b9a\u7a0b\u5ea6\u5c31\u4e0d\u518d\u53d8\u7a00'<\/span>]<\/span>)<\/span>;<\/span>
\n }<\/span>)<\/span>;<\/span>
\n return<\/span>;<\/span>
\n }<\/span>
\n if<\/span> (<\/span>idx ===<\/span> 7<\/span>)<\/span> {<\/span>
\n var<\/span> mk<\/span> =<\/span> function<\/span> (<\/span>t<\/span>)<\/span> {<\/span>
\n var<\/span> o =<\/span> {<\/span>
\n animation<\/span>:<\/span> false<\/span>,<\/span>
\n xAxis<\/span>:<\/span> {<\/span> type<\/span>:<\/span> 'category'<\/span>,<\/span> data<\/span>:<\/span> CAT12<\/span>.<\/span>slice<\/span>(<\/span>)<\/span> }<\/span>,<\/span> yAxis<\/span>:<\/span> {<\/span>}<\/span>,<\/span>
\n series<\/span>:<\/span> null<\/span>,<\/span>
\n dataZoom<\/span>:<\/span> [<\/span>{<\/span> type<\/span>:<\/span> 'slider'<\/span>,<\/span> xAxisIndex<\/span>:<\/span> 0<\/span>,<\/span> start<\/span>:<\/span> 25<\/span>,<\/span> end<\/span>:<\/span> 75<\/span> }<\/span>]<\/span>
\n }<\/span>;<\/span>
\n var<\/span> d =<\/span> A12<\/span>.<\/span>slice<\/span>(<\/span>)<\/span>;<\/span>
\n switch<\/span> (<\/span>t)<\/span> {<\/span>
\n case<\/span> 'line'<\/span>:<\/span> o.<\/span>series =<\/span> [<\/span>{<\/span> type<\/span>:<\/span> 'line'<\/span>,<\/span> data<\/span>:<\/span> d,<\/span> showSymbol<\/span>:<\/span> false<\/span> }<\/span>]<\/span>;<\/span> break<\/span>;<\/span>
\n case<\/span> 'bar'<\/span>:<\/span> o.<\/span>series =<\/span> [<\/span>{<\/span> type<\/span>:<\/span> 'bar'<\/span>,<\/span> data<\/span>:<\/span> d }<\/span>]<\/span>;<\/span> break<\/span>;<\/span>
\n case<\/span> 'scatter'<\/span>:<\/span> o.<\/span>series =<\/span> [<\/span>{<\/span> type<\/span>:<\/span> 'scatter'<\/span>,<\/span> data<\/span>:<\/span> d.<\/span>map<\/span>(<\/span>function<\/span> (<\/span>v,<\/span> k<\/span>)<\/span> {<\/span> return<\/span> [<\/span>k,<\/span> v]<\/span>;<\/span> }<\/span>)<\/span> }<\/span>]<\/span>;<\/span> break<\/span>;<\/span>
\n case<\/span> 'effectScatter'<\/span>:<\/span> o.<\/span>series =<\/span> [<\/span>{<\/span> type<\/span>:<\/span> 'effectScatter'<\/span>,<\/span> data<\/span>:<\/span> d.<\/span>map<\/span>(<\/span>function<\/span> (<\/span>v,<\/span> k<\/span>)<\/span> {<\/span> return<\/span> [<\/span>k,<\/span> v]<\/span>;<\/span> }<\/span>)<\/span> }<\/span>]<\/span>;<\/span> break<\/span>;<\/span>
\n case<\/span> 'candlestick'<\/span>:<\/span> o.<\/span>series =<\/span> [<\/span>{<\/span> type<\/span>:<\/span> 'candlestick'<\/span>,<\/span> data<\/span>:<\/span> d.<\/span>map<\/span>(<\/span>function<\/span> (<\/span>v<\/span>)<\/span> {<\/span> return<\/span> [<\/span>v,<\/span> v +<\/span> 2<\/span>,<\/span> v –<\/span> 3<\/span>,<\/span> v +<\/span> 4<\/span>]<\/span>;<\/span> }<\/span>)<\/span> }<\/span>]<\/span>;<\/span> break<\/span>;<\/span>
\n case<\/span> 'boxplot'<\/span>:<\/span> o.<\/span>series =<\/span> [<\/span>{<\/span> type<\/span>:<\/span> 'boxplot'<\/span>,<\/span> data<\/span>:<\/span> d.<\/span>map<\/span>(<\/span>function<\/span> (<\/span>v<\/span>)<\/span> {<\/span> return<\/span> [<\/span>v –<\/span> 2<\/span>,<\/span> v –<\/span> 1<\/span>,<\/span> v,<\/span> v +<\/span> 1<\/span>,<\/span> v +<\/span> 2<\/span>]<\/span>;<\/span> }<\/span>)<\/span> }<\/span>]<\/span>;<\/span> break<\/span>;<\/span>
\n case<\/span> 'custom'<\/span>:<\/span> o.<\/span>series =<\/span> [<\/span>{<\/span>
\n type<\/span>:<\/span> 'custom'<\/span>,<\/span> renderItem<\/span>:<\/span> function<\/span> (<\/span>)<\/span> {<\/span> return<\/span> {<\/span> type<\/span>:<\/span> 'rect'<\/span>,<\/span> shape<\/span>:<\/span> {<\/span> x<\/span>:<\/span> 0<\/span>,<\/span> y<\/span>:<\/span> 0<\/span>,<\/span> width<\/span>:<\/span> 4<\/span>,<\/span> height<\/span>:<\/span> 4<\/span> }<\/span> }<\/span>;<\/span> }<\/span>,<\/span>
\n data<\/span>:<\/span> d
\n }<\/span>]<\/span>;<\/span> break<\/span>;<\/span>
\n case<\/span> 'area'<\/span>:<\/span> o.<\/span>series =<\/span> [<\/span>{<\/span> type<\/span>:<\/span> 'line'<\/span>,<\/span> data<\/span>:<\/span> d,<\/span> areaStyle<\/span>:<\/span> {<\/span>}<\/span> }<\/span>]<\/span>;<\/span> break<\/span>;<\/span>
\n case<\/span> 'pie'<\/span>:<\/span> o.<\/span>xAxis =<\/span> undefined<\/span>;<\/span> o.<\/span>yAxis =<\/span> undefined<\/span>;<\/span>
\n o.<\/span>series =<\/span> [<\/span>{<\/span> type<\/span>:<\/span> 'pie'<\/span>,<\/span> radius<\/span>:<\/span> '60%'<\/span>,<\/span> data<\/span>:<\/span> d.<\/span>map<\/span>(<\/span>function<\/span> (<\/span>v,<\/span> k<\/span>)<\/span> {<\/span> return<\/span> {<\/span> name<\/span>:<\/span> 'n'<\/span> +<\/span> k,<\/span> value<\/span>:<\/span> v }<\/span>;<\/span> }<\/span>)<\/span> }<\/span>]<\/span>;<\/span> break<\/span>;<\/span>
\n case<\/span> 'graph'<\/span>:<\/span> o.<\/span>xAxis =<\/span> undefined<\/span>;<\/span> o.<\/span>yAxis =<\/span> undefined<\/span>;<\/span>
\n o.<\/span>series =<\/span> [<\/span>{<\/span>
\n type<\/span>:<\/span> 'graph'<\/span>,<\/span> layout<\/span>:<\/span> 'none'<\/span>,<\/span>
\n data<\/span>:<\/span> [<\/span>{<\/span> x<\/span>:<\/span> 1<\/span>,<\/span> y<\/span>:<\/span> 1<\/span>,<\/span> name<\/span>:<\/span> 'a'<\/span> }<\/span>,<\/span> {<\/span> x<\/span>:<\/span> 2<\/span>,<\/span> y<\/span>:<\/span> 2<\/span>,<\/span> name<\/span>:<\/span> 'b'<\/span> }<\/span>]<\/span>,<\/span> links<\/span>:<\/span> [<\/span>{<\/span> source<\/span>:<\/span> 0<\/span>,<\/span> target<\/span>:<\/span> 1<\/span> }<\/span>]<\/span>
\n }<\/span>]<\/span>;<\/span> break<\/span>;<\/span>
\n case<\/span> 'heatmap'<\/span>:<\/span> o.<\/span>yAxis =<\/span> {<\/span> type<\/span>:<\/span> 'category'<\/span>,<\/span> data<\/span>:<\/span> [<\/span>'x'<\/span>,<\/span> 'y'<\/span>,<\/span> 'z'<\/span>]<\/span> }<\/span>;<\/span>
\n o.<\/span>series =<\/span> [<\/span>{<\/span> type<\/span>:<\/span> 'heatmap'<\/span>,<\/span> data<\/span>:<\/span> d.<\/span>map<\/span>(<\/span>function<\/span> (<\/span>v,<\/span> k<\/span>)<\/span> {<\/span> return<\/span> [<\/span>k,<\/span> k %<\/span> 3<\/span>,<\/span> v]<\/span>;<\/span> }<\/span>)<\/span> }<\/span>]<\/span>;<\/span> break<\/span>;<\/span>
\n default<\/span>:<\/span> o.<\/span>series =<\/span> [<\/span>{<\/span> type<\/span>:<\/span> 'line'<\/span>,<\/span> data<\/span>:<\/span> d,<\/span> showSymbol<\/span>:<\/span> false<\/span> }<\/span>]<\/span>;<\/span>
\n }<\/span>
\n return<\/span> \/** @type {any} *\/<\/span>(<\/span>o)<\/span>;<\/span>
\n }<\/span>;<\/span>
\n p.<\/span>run<\/span>(<\/span>V<\/span>[<\/span>idx]<\/span>[<\/span>0<\/span>]<\/span>,<\/span> baseOpt<\/span>(<\/span>)<\/span>,<\/span> function<\/span> (<\/span>)<\/span> {<\/span>
\n var<\/span> TYPES<\/span> =<\/span> [<\/span>'line'<\/span>,<\/span> 'bar'<\/span>,<\/span> 'scatter'<\/span>,<\/span> 'effectScatter'<\/span>,<\/span> 'candlestick'<\/span>,<\/span> 'boxplot'<\/span>,<\/span>
\n 'custom'<\/span>,<\/span> 'area'<\/span>,<\/span> 'pie'<\/span>,<\/span> 'graph'<\/span>,<\/span> 'heatmap'<\/span>]<\/span>,<\/span> zero =<\/span> [<\/span>]<\/span>,<\/span> noAxis =<\/span> [<\/span>]<\/span>;<\/span>
\n var<\/span> rows =<\/span> ssrSweep<\/span>(<\/span>TYPES<\/span>,<\/span> mk,<\/span> function<\/span> (<\/span>t,<\/span> svg<\/span>)<\/span> {<\/span>
\n var<\/span> sh =<\/span> shadowShape<\/span>(<\/span>svg)<\/span>,<\/span> tr =<\/span> rectShapes<\/span>(<\/span>svg)<\/span>.<\/span>length,<\/span> pg =<\/span> countTag<\/span>(<\/span>svg,<\/span> 'polygon'<\/span>)<\/span>;<\/span>
\n if<\/span> (<\/span>!<\/span>tr)<\/span> {<\/span> noAxis.<\/span>push<\/span>(<\/span>t)<\/span>;<\/span> }<\/span> else<\/span> if<\/span> (<\/span>!<\/span>pg)<\/span> {<\/span> zero.<\/span>push<\/span>(<\/span>t)<\/span>;<\/span> }<\/span>
\n return<\/span> ' '<\/span> +<\/span> t +<\/span> '：\u8f68\u9053\u5757='<\/span> +<\/span> tr +<\/span> ' polygon(\u5f71\u5b50\u9762)='<\/span> +<\/span> pg +<\/span>
\n ' polyline='<\/span> +<\/span> countTag<\/span>(<\/span>svg,<\/span> 'polyline'<\/span>)<\/span> +<\/span> ' \u9996\u6761 polyline \u9876\u70b9='<\/span> +<\/span> (<\/span>sh.<\/span>\u9876\u70b9 ||<\/span> 0<\/span>)<\/span> +<\/span>
\n ' \u5b57\u8282='<\/span> +<\/span> svg.<\/span>length +<\/span>
\n (<\/span>tr ?<\/span> ''<\/span> :<\/span> '（\u8f68\u9053\u5757=0 \u21d2 \u6ed1\u5757\u6574\u6761\u6ca1\u753b，\u8fd9\u4e00\u6863\u4e0d\u80fd\u5f53\u767d\u540d\u5355\u8bc1\u636e）'<\/span>)<\/span>;<\/span>
\n }<\/span>)<\/span>;<\/span>
\n var<\/span> force =<\/span> ssrSweep<\/span>(<\/span>zero,<\/span> function<\/span> (<\/span>t<\/span>)<\/span> {<\/span>
\n var<\/span> o =<\/span> mk<\/span>(<\/span>t)<\/span>;<\/span>
\n o.<\/span>dataZoom =<\/span> [<\/span>{<\/span> type<\/span>:<\/span> 'slider'<\/span>,<\/span> xAxisIndex<\/span>:<\/span> 0<\/span>,<\/span> start<\/span>:<\/span> 25<\/span>,<\/span> end<\/span>:<\/span> 75<\/span>,<\/span> showDataShadow<\/span>:<\/span> true<\/span> }<\/span>]<\/span>;<\/span>
\n return<\/span> o;<\/span>
\n }<\/span>,<\/span> function<\/span> (<\/span>t,<\/span> svg<\/span>)<\/span> {<\/span>
\n var<\/span> sh =<\/span> shadowShape<\/span>(<\/span>svg)<\/span>;<\/span>
\n return<\/span> ' \u5f3a\u5236 true \u21d2 '<\/span> +<\/span> t +<\/span> '：\u8f68\u9053\u5757='<\/span> +<\/span> rectShapes<\/span>(<\/span>svg)<\/span>.<\/span>length +<\/span>
\n ' polygon(\u5f71\u5b50\u9762)='<\/span> +<\/span> countTag<\/span>(<\/span>svg,<\/span> 'polygon'<\/span>)<\/span> +<\/span> ' polyline='<\/span> +<\/span> countTag<\/span>(<\/span>svg,<\/span> 'polyline'<\/span>)<\/span> +<\/span>
\n ' \u5f71\u5b50\u9876\u70b9='<\/span> +<\/span> (<\/span>sh.<\/span>\u9876\u70b9 ||<\/span> 0<\/span>)<\/span> +<\/span> ' \u5b57\u8282='<\/span> +<\/span> svg.<\/span>length;<\/span>
\n }<\/span>)<\/span>;<\/span>
\n return<\/span> [<\/span>' \u540d\u5355\u5199\u6b7b\u5728 SliderZoomView.js:68 SHOW_DATA_SHADOW_SERIES_TYPE=[line,bar,candlestick,scatter]；'<\/span>
\n +<\/span> 'showDataShadow \u9ed8\u8ba4 auto \u21d2 \u540d\u5355\u5916\u4e00\u5f8b\u6ca1\u5f71\u5b50\u3002'<\/span>,<\/span>
\n ' \u5224\u5b9a\u770b\u4e24\u5217：\u8f68\u9053\u5757（\u6ed1\u5757\u753b\u6ca1\u753b，\u753b\u4e86\u662f 3 \u4e2a path：\u8f68\u9053\u5e95 + \u70b9\u51fb\u9762\u677f + \u9009\u4e2d\u6bb5；'<\/span>
\n +<\/span> '\u771f\u6b63\u753b\u8fb9\u6846\u7684\u90a3\u6761\u5185\u7f29\u4e86\u534a\u50cf\u7d20，\u8fd9\u6761\u6b63\u5219\u4e0d\u6570\u5b83，\u9762\u677f\u4e5d \u2460 \u9010\u6761\u70b9\u8fc7\u540d）\u4e0e polygon（\u5f71\u5b50\u7684\u9762，'<\/span>
\n +<\/span> '\u6709\u5f71\u5b50\u662f 3 \u5c42：\u672a\u9009\u5de6\u6bb5 + \u9009\u4e2d\u6bb5 + \u672a\u9009\u53f3\u6bb5，\u6bcf\u6bb5\u4e00\u9762\u4e00\u7ebf（:331-351 \u5efa\u4e00\u5bf9\u3001:354-358 \u5efa\u4e09\u6bb5）\u21d2 polygon=3 \u914d polyline=3；'<\/span>
\n +<\/span> '\u7cfb\u5217\u81ea\u5df1\u90a3\u4e00\u6298\u843d\u76d8\u662f path，\u4e0d\u5360 polyline\u3002'<\/span>
\n +<\/span> '\u9996\u6761 polyline \u7684\u9876\u70b9\u6570\u4e0d\u53ef\u9760\u2014\u2014\u997c\u56fe\u7684\u5f15\u5bfc\u7ebf\u4e5f\u662f polyline\u3002'<\/span>,<\/span>
\n ' \u540c\u4e00\u4efd\u6570\u636e（12 \u7c7b\u76ee + 12 \u4e2a\u6570）\u3001\u540c\u4e00\u4e2a\u7a97\u53e3 25~75，\u53ea\u6362\u7cfb\u5217：'<\/span>]<\/span>
\n .<\/span>concat<\/span>(<\/span>rows)<\/span>
\n .<\/span>concat<\/span>(<\/span>[<\/span>' \u21d2 \u8f68\u9053\u5757=0 \u7684\u662f '<\/span> +<\/span> JSON<\/span>.<\/span>stringify<\/span>(<\/span>noAxis)<\/span> +<\/span>
\n '：\u8fd9\u4e24\u4e2a option \u91cc\u6ca1\u6709\u5750\u6807\u8f74（mk \u91cc\u628a xAxis\/yAxis \u7f6e\u4e86 undefined），'<\/span>
\n +<\/span> 'dataZoom \u4e00\u6839\u8f74\u4e5f\u8ba4\u9886\u4e0d\u5230（\u63a2\u9488\u8bfb eachTargetAxis \u5f97 []），\u4e8e\u662f SliderZoomView \u6574\u4e2a\u4e0d\u6e32\u67d3\u2014\u2014'<\/span>
\n +<\/span> '\u5b83\u4eec\u300c\u6ca1\u5f71\u5b50\u300d\u662f\u56e0\u4e3a\u6839\u672c\u6ca1\u6709\u6ed1\u5757，\u4e0d\u662f\u56e0\u4e3a\u767d\u540d\u5355\u3002'<\/span>,<\/span>
\n ' \u6ed1\u5757\u753b\u4e86\u800c polygon=0 \u7684\u662f '<\/span> +<\/span> JSON<\/span>.<\/span>stringify<\/span>(<\/span>zero)<\/span> +<\/span> '：\u8f68\u9053\u5757\u5728，\u53ea\u662f\u7cfb\u5217\u4e0d\u5728\u540d\u5355\u91cc\u3002'<\/span>
\n +<\/span> '（custom \u90a3\u6863\u8f68\u9053\u5757=9 \u662f\u8fd9\u6761\u6b63\u5219\u628a renderItem \u753b\u7684 4\u00d74 \u65b9\u5757\u4e5f\u6570\u4e86\u8fdb\u53bb：12 \u884c\u88ab filterMode '<\/span>
\n +<\/span> '\u88c1\u5230 6 \u884c \u21d2 3 \u4e2a\u8f68\u9053\u5757 + 6 \u4e2a\u65b9\u5757，\u7b2c\u5341\u4e8c\u8282\u90a3\u672c\u8d26）'<\/span>,<\/span>
\n ' \u21d2 \u628a showDataShadow \u4ece auto \u6539\u6210 true，:375 \u90a3\u53e5\u767d\u540d\u5355\u5224\u5b9a\u5c31\u88ab\u7ed5\u8fc7：'<\/span>]<\/span>)<\/span>
\n .<\/span>concat<\/span>(<\/span>force)<\/span>;<\/span>
\n }<\/span>)<\/span>;<\/span>
\n return<\/span>;<\/span>
\n }<\/span>
\n if<\/span> (<\/span>idx ===<\/span> 8<\/span>)<\/span> {<\/span>
\n p.<\/span>run<\/span>(<\/span>V<\/span>[<\/span>idx]<\/span>[<\/span>0<\/span>]<\/span>,<\/span> V<\/span>[<\/span>idx]<\/span>[<\/span>1<\/span>]<\/span>,<\/span> function<\/span> (<\/span>svg,<\/span> c<\/span>)<\/span> {<\/span>
\n var<\/span> out =<\/span> [<\/span>shadowRow<\/span>(<\/span>svg)<\/span>,<\/span> geometryRow<\/span>(<\/span>svg)<\/span>,<\/span> dzRow<\/span>(<\/span>c,<\/span> 0<\/span>)<\/span>]<\/span>;<\/span>
\n var<\/span> RIVER<\/span> =<\/span> [<\/span>[<\/span>0<\/span>,<\/span> 'a'<\/span>,<\/span> 12<\/span>]<\/span>,<\/span> [<\/span>1<\/span>,<\/span> 'a'<\/span>,<\/span> 31<\/span>]<\/span>,<\/span> [<\/span>2<\/span>,<\/span> 'b'<\/span>,<\/span> 22<\/span>]<\/span>,<\/span> [<\/span>3<\/span>,<\/span> 'a'<\/span>,<\/span> 40<\/span>]<\/span>]<\/span>;<\/span>
\n var<\/span> CASES<\/span> =<\/span> [<\/span>
\n [<\/span>'themeRiver + singleAxis + slider'<\/span>,<\/span> true<\/span>,<\/span> true<\/span>]<\/span>,<\/span>
\n [<\/span>'themeRiver + singleAxis，\u4e00\u6839 dz \u90fd\u4e0d\u5199'<\/span>,<\/span> true<\/span>,<\/span> false<\/span>]<\/span>,<\/span>
\n [<\/span>'themeRiver \u65e0 singleAxis，\u4e5f\u4e0d\u5199 dz'<\/span>,<\/span> false<\/span>,<\/span> false<\/span>]<\/span>,<\/span>
\n [<\/span>'themeRiver \u65e0 singleAxis + slider(xAxisIndex:0)'<\/span>,<\/span> false<\/span>,<\/span> true<\/span>]<\/span>
\n ]<\/span>;<\/span>
\n out.<\/span>push<\/span>(<\/span>' \u5f52\u56e0\u56db\u6863（\u6bcf\u6863\u53e6\u8d77\u4e00\u4e2a ssr \u5b9e\u4f8b，\u53ea\u770b\u629b\u4e0d\u629b）：'<\/span>)<\/span>;<\/span>
\n for<\/span> (<\/span>var<\/span> k =<\/span> 0<\/span>;<\/span> k <<\/span> CASES<\/span>.<\/span>length;<\/span> k++<\/span>)<\/span> {<\/span>
\n var<\/span> inst =<\/span> echarts.<\/span>init<\/span>(<\/span>null<\/span>,<\/span> null<\/span>,<\/span> {<\/span> renderer<\/span>:<\/span> 'svg'<\/span>,<\/span> ssr<\/span>:<\/span> true<\/span>,<\/span> width<\/span>:<\/span> 400<\/span>,<\/span> height<\/span>:<\/span> 260<\/span> }<\/span>)<\/span>;<\/span>
\n var<\/span> o =<\/span> \/** @type {any} *\/<\/span>(<\/span>{<\/span> animation<\/span>:<\/span> false<\/span>,<\/span> series<\/span>:<\/span> [<\/span>{<\/span> type<\/span>:<\/span> 'themeRiver'<\/span>,<\/span> data<\/span>:<\/span> RIVER<\/span> }<\/span>]<\/span> }<\/span>)<\/span>;<\/span>
\n if<\/span> (<\/span>CASES<\/span>[<\/span>k]<\/span>[<\/span>1<\/span>]<\/span>)<\/span> {<\/span> o.<\/span>singleAxis =<\/span> {<\/span> type<\/span>:<\/span> 'category'<\/span> }<\/span>;<\/span> }<\/span>
\n if<\/span> (<\/span>CASES<\/span>[<\/span>k]<\/span>[<\/span>2<\/span>]<\/span>)<\/span> {<\/span>
\n o.<\/span>dataZoom =<\/span> CASES<\/span>[<\/span>k]<\/span>[<\/span>1<\/span>]<\/span> ?<\/span> [<\/span>{<\/span> type<\/span>:<\/span> 'slider'<\/span>,<\/span> start<\/span>:<\/span> 0<\/span>,<\/span> end<\/span>:<\/span> 100<\/span> }<\/span>]<\/span>
\n :<\/span> [<\/span>{<\/span> type<\/span>:<\/span> 'slider'<\/span>,<\/span> xAxisIndex<\/span>:<\/span> 0<\/span>,<\/span> start<\/span>:<\/span> 0<\/span>,<\/span> end<\/span>:<\/span> 100<\/span> }<\/span>]<\/span>;<\/span>
\n }<\/span>
\n try<\/span> {<\/span>
\n inst.<\/span>setOption<\/span>(<\/span>o,<\/span> true<\/span>)<\/span>;<\/span>
\n var<\/span> s2 =<\/span> svgOf<\/span>(<\/span>inst)<\/span>,<\/span> sh2 =<\/span> shadowShape<\/span>(<\/span>s2)<\/span>;<\/span>
\n out.<\/span>push<\/span>(<\/span>' '<\/span> +<\/span> CASES<\/span>[<\/span>k]<\/span>[<\/span>0<\/span>]<\/span> +<\/span> ' \u21d2 \u6ca1\u629b \u5b57\u8282='<\/span> +<\/span> s2.<\/span>length +<\/span> ' polyline='<\/span> +<\/span>
\n countTag<\/span>(<\/span>s2,<\/span> 'polyline'<\/span>)<\/span> +<\/span> ' \u5f71\u5b50\u9876\u70b9='<\/span> +<\/span> (<\/span>sh2.<\/span>\u9876\u70b9 ||<\/span> 0<\/span>)<\/span>)<\/span>;<\/span>
\n }<\/span> catch<\/span> (<\/span>e)<\/span> {<\/span>
\n out.<\/span>push<\/span>(<\/span>' '<\/span> +<\/span> CASES<\/span>[<\/span>k]<\/span>[<\/span>0<\/span>]<\/span> +<\/span> ' \u21d2 \u629b：'<\/span> +<\/span> e.<\/span>message)<\/span>;<\/span>
\n }<\/span> finally<\/span> {<\/span> try<\/span> {<\/span> inst.<\/span>dispose<\/span>(<\/span>)<\/span>;<\/span> }<\/span> catch<\/span> (<\/span>e2)<\/span> {<\/span> }<\/span> }<\/span>
\n }<\/span>
\n out.<\/span>push<\/span>(<\/span>' \u21d2 \u629b\u7684\u662f themeRiver \u81ea\u5df1\u7684 getInitialData（\u5b83\u8981 singleAxis），\u628a dataZoom \u6574\u6761\u5220\u6389\u7167\u6837\u629b \u21d2 \u4e0e\u7f29\u653e\u65e0\u5173；'<\/span>)<\/span>;<\/span>
\n out.<\/span>push<\/span>(<\/span>' \u914d\u4e0a singleAxis \u4e4b\u540e\u6302 slider \u5b8c\u5168\u6b63\u5e38，\u53ea\u662f\u4ecd\u6ca1\u5f71\u5b50\u2014\u2014\u540d\u5355\u91cc\u6ca1\u6709\u5b83（:68），\u5f71\u5b50\u9876\u70b9=0\u3002'<\/span>)<\/span>;<\/span>
\n out.<\/span>push<\/span>(<\/span>' \u4e0a\u9762 dzRow \u91cc\u90a3\u884c \u503c=[NaN, NaN] \u4e0d\u662f\u7f29\u653e\u574f\u4e86，\u662f"\u8bfb\u6570\u5668\u628a null \u5370\u6210\u4e86 NaN"：'<\/span>)<\/span>;<\/span>
\n [<\/span>[<\/span>'\u4e0d\u5199 data'<\/span>,<\/span> null<\/span>]<\/span>,<\/span> [<\/span>'data=[0,1,2,3]'<\/span>,<\/span> [<\/span>0<\/span>,<\/span> 1<\/span>,<\/span> 2<\/span>,<\/span> 3<\/span>]<\/span>]<\/span>,<\/span> [<\/span>'data=["a","b","c","d"]'<\/span>,<\/span> [<\/span>'a'<\/span>,<\/span> 'b'<\/span>,<\/span> 'c'<\/span>,<\/span> 'd'<\/span>]<\/span>]<\/span>]<\/span>
\n .<\/span>forEach<\/span>(<\/span>function<\/span> (<\/span>one<\/span>)<\/span> {<\/span>
\n var<\/span> it =<\/span> echarts.<\/span>init<\/span>(<\/span>null<\/span>,<\/span> null<\/span>,<\/span> {<\/span> renderer<\/span>:<\/span> 'svg'<\/span>,<\/span> ssr<\/span>:<\/span> true<\/span>,<\/span> width<\/span>:<\/span> 400<\/span>,<\/span> height<\/span>:<\/span> 260<\/span> }<\/span>)<\/span>;<\/span>
\n var<\/span> sa =<\/span> \/** @type {any} *\/<\/span>(<\/span>{<\/span> type<\/span>:<\/span> 'category'<\/span> }<\/span>)<\/span>;<\/span>
\n if<\/span> (<\/span>one[<\/span>1<\/span>]<\/span>)<\/span> {<\/span> sa.<\/span>data =<\/span> one[<\/span>1<\/span>]<\/span>;<\/span> }<\/span>
\n try<\/span> {<\/span>
\n it.<\/span>setOption<\/span>(<\/span>\/** @type {any} *\/<\/span>(<\/span>{<\/span>
\n animation<\/span>:<\/span> false<\/span>,<\/span> singleAxis<\/span>:<\/span> sa,<\/span>
\n series<\/span>:<\/span> [<\/span>{<\/span> type<\/span>:<\/span> 'themeRiver'<\/span>,<\/span> data<\/span>:<\/span> RIVER<\/span> }<\/span>]<\/span>,<\/span>
\n dataZoom<\/span>:<\/span> [<\/span>{<\/span> type<\/span>:<\/span> 'slider'<\/span>,<\/span> singleAxisIndex<\/span>:<\/span> 0<\/span>,<\/span> start<\/span>:<\/span> 25<\/span>,<\/span> end<\/span>:<\/span> 75<\/span> }<\/span>]<\/span>
\n }<\/span>)<\/span>,<\/span> true<\/span>)<\/span>;<\/span>
\n var<\/span> am =<\/span> \/** @type {any} *\/<\/span> (<\/span>it)<\/span>.<\/span>getModel<\/span>(<\/span>)<\/span>.<\/span>getComponent<\/span>(<\/span>'singleAxis'<\/span>,<\/span> 0<\/span>)<\/span>;<\/span>
\n var<\/span> px =<\/span> \/** @type {any} *\/<\/span> (<\/span>it)<\/span>.<\/span>getModel<\/span>(<\/span>)<\/span>.<\/span>getComponent<\/span>(<\/span>'dataZoom'<\/span>,<\/span> 0<\/span>)<\/span>.<\/span>getAxisProxy<\/span>(<\/span>'single'<\/span>,<\/span> 0<\/span>)<\/span>;<\/span>
\n var<\/span> sv =<\/span> svgOf<\/span>(<\/span>it)<\/span>;<\/span>
\n out.<\/span>push<\/span>(<\/span>' singleAxis '<\/span> +<\/span> one[<\/span>0<\/span>]<\/span> +<\/span> ' \u21d2 scale.getExtent()='<\/span> +<\/span> JSON<\/span>.<\/span>stringify<\/span>(<\/span>am.<\/span>axis.<\/span>scale.<\/span>getExtent<\/span>(<\/span>)<\/span>)<\/span> +<\/span>
\n ' proxy.getWindow \u767e\u5206\u6bd4='<\/span> +<\/span> JSON<\/span>.<\/span>stringify<\/span>(<\/span>px.<\/span>getWindow<\/span>(<\/span>)<\/span>.<\/span>percent)<\/span> +<\/span>
\n ' \u503c='<\/span> +<\/span> JSON<\/span>.<\/span>stringify<\/span>(<\/span>px.<\/span>getWindow<\/span>(<\/span>)<\/span>.<\/span>value)<\/span> +<\/span>
\n ' \u5b57\u8282='<\/span> +<\/span> sv.<\/span>length +<\/span> ' polyline='<\/span> +<\/span> countTag<\/span>(<\/span>sv,<\/span> 'polyline'<\/span>)<\/span>)<\/span>;<\/span>
\n }<\/span> catch<\/span> (<\/span>e)<\/span> {<\/span> out.<\/span>push<\/span>(<\/span>' singleAxis '<\/span> +<\/span> one[<\/span>0<\/span>]<\/span> +<\/span> ' \u21d2 \u629b：'<\/span> +<\/span> e.<\/span>message)<\/span>;<\/span> }<\/span>
\n finally<\/span> {<\/span> try<\/span> {<\/span> it.<\/span>dispose<\/span>(<\/span>)<\/span>;<\/span> }<\/span> catch<\/span> (<\/span>e3)<\/span> {<\/span> }<\/span> }<\/span>
\n }<\/span>)<\/span>;<\/span>
\n out.<\/span>push<\/span>(<\/span>' \u21d2 \u8f74\u4e0a\u6ca1\u6709 data \u65f6 ordinal \u8f74\u7684 scale.getExtent() \u672c\u8eab\u5c31\u662f [null,null]，'<\/span>
\n +<\/span> '\u7a97\u53e3\u503c\u53ea\u80fd\u8ddf\u7740\u662f null（\u9ec4\u6846\u6309\u8001\u89c4\u77e9\u628a null \u5370\u6210 NaN）；\u767e\u5206\u6bd4\u90a3\u4e00\u680f [25,75] \u4e00\u76f4\u662f\u597d\u7684\u3002'<\/span>
\n +<\/span> '\u7ed9\u8f74\u8865\u4e0a data，\u503c\u7a97\u7acb\u523b\u53d8\u771f\u6570，\u4e14 startValue\/endValue \u5199\u7684\u5c31\u662f\u8fd9\u4efd data \u7684\u4e0b\u6807\u3002'<\/span>)<\/span>;<\/span>
\n return<\/span> out;<\/span>
\n }<\/span>)<\/span>;<\/span>
\n return<\/span>;<\/span>
\n }<\/span>
\n p.<\/span>run<\/span>(<\/span>V<\/span>[<\/span>idx]<\/span>[<\/span>0<\/span>]<\/span>,<\/span> V<\/span>[<\/span>idx]<\/span>[<\/span>1<\/span>]<\/span>,<\/span> function<\/span> (<\/span>svg,<\/span> c<\/span>)<\/span> {<\/span>
\n return<\/span> [<\/span>shadowRow<\/span>(<\/span>svg)<\/span>,<\/span> geometryRow<\/span>(<\/span>svg)<\/span>,<\/span> dzRow<\/span>(<\/span>c,<\/span> 0<\/span>)<\/span>]<\/span>;<\/span>
\n }<\/span>)<\/span>;<\/span>
\n }<\/span>)<\/span>;<\/span>
\n }<\/span>)<\/span>(<\/span>i)<\/span>;<\/span>
\n }<\/span>
\n p.<\/span>run<\/span>(<\/span>V<\/span>[<\/span>0<\/span>]<\/span>[<\/span>0<\/span>]<\/span>,<\/span> V<\/span>[<\/span>0<\/span>]<\/span>[<\/span>1<\/span>]<\/span>,<\/span> function<\/span> (<\/span>svg,<\/span> c<\/span>)<\/span> {<\/span> return<\/span> [<\/span>shadowRow<\/span>(<\/span>svg)<\/span>,<\/span> shadowColorRow<\/span>(<\/span>svg)<\/span>,<\/span> dzRow<\/span>(<\/span>c,<\/span> 0<\/span>)<\/span>]<\/span>;<\/span> }<\/span>)<\/span>;<\/span>
\n}<\/span><\/p>\n

\/* ===== \u9762\u677f\u5341\u4e00：\u591a\u6839\u8f74\u3001\u591a\u6839\u6ed1\u5757（\u7b2c\u5341\u4e03\u8282：\u5148\u6765\u8005\u79f0\u738b，\u4e8b\u4ef6\u8ba1\u6570\u5728\u9762\u677f\u5341\u4e8c \u2465） ===== *\/<\/span><\/p>\n

function<\/span> twoAxisOpt<\/span>(<\/span>dz,<\/span> grids,<\/span> extra<\/span>)<\/span> {<\/span>
\n var<\/span> two =<\/span> !<\/span>!<\/span>grids;<\/span> \/\/ \u771f \u21d2 \u4e24\u5757 grid \u5404\u6302\u4e00\u8f74；\u5047 \u21d2 \u4e00\u5757 grid \u91cc\u53e0\u4e24\u6761 x \u8f74（\u7b2c\u4e8c\u6761\u538b\u5230 top）<\/span>
\n var<\/span> o =<\/span> \/** @type {any} *\/<\/span>(<\/span>{<\/span>
\n animation<\/span>:<\/span> false<\/span>,<\/span>
\n grid<\/span>:<\/span> two ?<\/span> [<\/span>{<\/span> left<\/span>:<\/span> 60<\/span>,<\/span> right<\/span>:<\/span> 20<\/span>,<\/span> top<\/span>:<\/span> 40<\/span>,<\/span> height<\/span>:<\/span> 70<\/span> }<\/span>,<\/span> {<\/span> left<\/span>:<\/span> 60<\/span>,<\/span> right<\/span>:<\/span> 20<\/span>,<\/span> top<\/span>:<\/span> 130<\/span>,<\/span> height<\/span>:<\/span> 70<\/span> }<\/span>]<\/span>
\n :<\/span> [<\/span>{<\/span> left<\/span>:<\/span> 60<\/span>,<\/span> right<\/span>:<\/span> 20<\/span>,<\/span> top<\/span>:<\/span> 65<\/span>,<\/span> bottom<\/span>:<\/span> 80<\/span> }<\/span>]<\/span>,<\/span>
\n xAxis<\/span>:<\/span> [<\/span>{<\/span> type<\/span>:<\/span> 'category'<\/span>,<\/span> data<\/span>:<\/span> CAT12<\/span>.<\/span>slice<\/span>(<\/span>)<\/span> }<\/span>,<\/span>
\n {<\/span> type<\/span>:<\/span> 'category'<\/span>,<\/span> data<\/span>:<\/span> CAT12<\/span>.<\/span>slice<\/span>(<\/span>)<\/span>,<\/span> gridIndex<\/span>:<\/span> two ?<\/span> 1<\/span> :<\/span> 0<\/span>,<\/span> position<\/span>:<\/span> two ?<\/span> 'bottom'<\/span> :<\/span> 'top'<\/span> }<\/span>]<\/span>,<\/span>
\n yAxis<\/span>:<\/span> two ?<\/span> [<\/span>{<\/span>}<\/span>,<\/span> {<\/span> gridIndex<\/span>:<\/span> 1<\/span> }<\/span>]<\/span> :<\/span> [<\/span>{<\/span>}<\/span>]<\/span>,<\/span>
\n series<\/span>:<\/span> [<\/span>{<\/span> type<\/span>:<\/span> 'line'<\/span>,<\/span> data<\/span>:<\/span> A12<\/span>.<\/span>slice<\/span>(<\/span>)<\/span>,<\/span> showSymbol<\/span>:<\/span> false<\/span> }<\/span>,<\/span>
\n {<\/span> type<\/span>:<\/span> 'line'<\/span>,<\/span> data<\/span>:<\/span> A12<\/span>.<\/span>slice<\/span>(<\/span>)<\/span>,<\/span> showSymbol<\/span>:<\/span> false<\/span>,<\/span> xAxisIndex<\/span>:<\/span> two ?<\/span> 1<\/span> :<\/span> 0<\/span>,<\/span> yAxisIndex<\/span>:<\/span> two ?<\/span> 1<\/span> :<\/span> 0<\/span> }<\/span>]<\/span>,<\/span>
\n dataZoom<\/span>:<\/span> dz
\n }<\/span>)<\/span>;<\/span>
\n return<\/span> mix<\/span>(<\/span>o,<\/span> extra ||<\/span> {<\/span>}<\/span>)<\/span>;<\/span>
\n}<\/span>
\nfunction<\/span> dzListModel<\/span>(<\/span>c<\/span>)<\/span> {<\/span>
\n var<\/span> m =<\/span> modelOf<\/span>(<\/span>c)<\/span>,<\/span> out =<\/span> [<\/span>]<\/span>;<\/span>
\n if<\/span> (<\/span>!<\/span>m)<\/span> return<\/span> ' \u7ec4\u4ef6\u6e05\u5355 = '<\/span> +<\/span> NO_MODEL<\/span>;<\/span>
\n var<\/span> all =<\/span> [<\/span>]<\/span>;<\/span>
\n try<\/span> {<\/span>
\n m.<\/span>eachComponent<\/span>(<\/span>'dataZoom'<\/span>,<\/span> function<\/span> (<\/span>zm<\/span>)<\/span> {<\/span> all.<\/span>push<\/span>(<\/span>zm)<\/span>;<\/span> }<\/span>)<\/span>;<\/span>
\n }<\/span> catch<\/span> (<\/span>e)<\/span> {<\/span> return<\/span> ' \u7ec4\u4ef6\u6e05\u5355\u8bfb\u4e0d\u5230：'<\/span> +<\/span> e.<\/span>message;<\/span> }<\/span>
\n for<\/span> (<\/span>var<\/span> i =<\/span> 0<\/span>;<\/span> i <<\/span> all.<\/span>length;<\/span> i++<\/span>)<\/span> {<\/span>
\n var<\/span> t =<\/span> [<\/span>]<\/span>;<\/span>
\n try<\/span> {<\/span> all[<\/span>i]<\/span>.<\/span>eachTargetAxis<\/span>(<\/span>function<\/span> (<\/span>dim,<\/span> idx<\/span>)<\/span> {<\/span> t.<\/span>push<\/span>(<\/span>dim +<\/span> idx)<\/span>;<\/span> }<\/span>)<\/span>;<\/span> }<\/span> catch<\/span> (<\/span>e)<\/span> {<\/span> }<\/span>
\n out.<\/span>push<\/span>(<\/span>' ['<\/span> +<\/span> i +<\/span> '] id='<\/span> +<\/span> JSON<\/span>.<\/span>stringify<\/span>(<\/span>all[<\/span>i]<\/span>.<\/span>id)<\/span> +<\/span> ' type='<\/span> +<\/span> all[<\/span>i]<\/span>.<\/span>subType +<\/span>
\n ' targets='<\/span> +<\/span> JSON<\/span>.<\/span>stringify<\/span>(<\/span>t)<\/span> +<\/span> ' $fromToolbox='<\/span> +<\/span> JSON<\/span>.<\/span>stringify<\/span>(<\/span>all[<\/span>i]<\/span>.<\/span>option.<\/span>$fromToolbox ==<\/span> null<\/span> ?<\/span> null<\/span> :<\/span> all[<\/span>i]<\/span>.<\/span>option.<\/span>$fromToolbox)<\/span> +<\/span>
\n ' \u56de\u8bfb\u7a97（option \u90a3\u4efd，processor \u5237\u8fc7）='<\/span> +<\/span> JSON<\/span>.<\/span>stringify<\/span>(<\/span>[<\/span>all[<\/span>i]<\/span>.<\/span>option.<\/span>start,<\/span> all[<\/span>i]<\/span>.<\/span>option.<\/span>end,<\/span> all[<\/span>i]<\/span>.<\/span>option.<\/span>startValue,<\/span> all[<\/span>i]<\/span>.<\/span>option.<\/span>endValue]<\/span>)<\/span>)<\/span>;<\/span>
\n }<\/span>
\n return<\/span> ' dataZoom \u7ec4\u4ef6\u6e05\u5355（'<\/span> +<\/span> all.<\/span>length +<\/span> ' \u6839，\u987a\u5e8f\u5c31\u662f\u58f0\u660e\u987a\u5e8f）\\\\n'<\/span> +<\/span> (<\/span>out.<\/span>join<\/span>(<\/span>'\\\\n'<\/span>)<\/span> ||<\/span> ' （0 \u6839）'<\/span>)<\/span>;<\/span>
\n}<\/span><\/p>\n

function<\/span> initPanel11<\/span>(<\/span>)<\/span> {<\/span>
\n var<\/span> p =<\/span> makePanel<\/span>(<\/span>'p11'<\/span>)<\/span>;<\/span>
\n var<\/span> SL<\/span> =<\/span> slider<\/span>(<\/span>25<\/span>,<\/span> 75<\/span>)<\/span>,<\/span> IN<\/span> =<\/span> inside<\/span>(<\/span>60<\/span>,<\/span> 100<\/span>)<\/span>;<\/span>
\n \/** @type {any[][]} *\/<\/span>
\n var<\/span> V<\/span> =<\/span> [<\/span>
\n [<\/span>'\u2460 \u53cc x \u8f74\u5171\u7528\u4e00\u4e2a grid + \u4e00\u6839 dz'<\/span>,<\/span> twoAxisOpt<\/span>(<\/span>[<\/span>{<\/span> type<\/span>:<\/span> 'slider'<\/span>,<\/span> xAxisIndex<\/span>:<\/span> 0<\/span>,<\/span> start<\/span>:<\/span> 25<\/span>,<\/span> end<\/span>:<\/span> 75<\/span> }<\/span>]<\/span>,<\/span> false<\/span>)<\/span>]<\/span>,<\/span>
\n [<\/span>'\u2461 \u4e24\u6839\u72ec\u7acb grid，\u4e00\u6839 dz \u7ba1\u4e24\u8f74'<\/span>,<\/span> twoAxisOpt<\/span>(<\/span>[<\/span>{<\/span> type<\/span>:<\/span> 'slider'<\/span>,<\/span> xAxisIndex<\/span>:<\/span> [<\/span>0<\/span>,<\/span> 1<\/span>]<\/span>,<\/span> start<\/span>:<\/span> 25<\/span>,<\/span> end<\/span>:<\/span> 75<\/span> }<\/span>]<\/span>,<\/span> true<\/span>)<\/span>]<\/span>,<\/span>
\n [<\/span>'\u2462 xAxisIndex:"all"（\u4e0e \u2461 \u7b49\u4ef7）'<\/span>,<\/span> twoAxisOpt<\/span>(<\/span>[<\/span>{<\/span> type<\/span>:<\/span> 'slider'<\/span>,<\/span> xAxisIndex<\/span>:<\/span> 'all'<\/span>,<\/span> start<\/span>:<\/span> 25<\/span>,<\/span> end<\/span>:<\/span> 75<\/span> }<\/span>]<\/span>,<\/span> true<\/span>)<\/span>]<\/span>,<\/span>
\n [<\/span>'\u2463 xAxisIndex:[] \u7a7a\u6570\u7ec4（\u5408\u6cd5\u7684\u6b7b\u952e）'<\/span>,<\/span> twoAxisOpt<\/span>(<\/span>[<\/span>{<\/span> type<\/span>:<\/span> 'slider'<\/span>,<\/span> xAxisIndex<\/span>:<\/span> [<\/span>]<\/span>,<\/span> start<\/span>:<\/span> 25<\/span>,<\/span> end<\/span>:<\/span> 75<\/span> }<\/span>]<\/span>,<\/span> true<\/span>)<\/span>]<\/span>,<\/span>
\n [<\/span>'\u2464 \u540c\u8f74\u4e24\u6839：slider \u5728\u524d'<\/span>,<\/span> twoAxisOpt<\/span>(<\/span>[<\/span>
\n {<\/span> type<\/span>:<\/span> 'slider'<\/span>,<\/span> xAxisIndex<\/span>:<\/span> 0<\/span>,<\/span> start<\/span>:<\/span> 25<\/span>,<\/span> end<\/span>:<\/span> 75<\/span> }<\/span>,<\/span>
\n {<\/span> type<\/span>:<\/span> 'inside'<\/span>,<\/span> xAxisIndex<\/span>:<\/span> 0<\/span>,<\/span> start<\/span>:<\/span> 60<\/span>,<\/span> end<\/span>:<\/span> 100<\/span> }<\/span>
\n ]<\/span>,<\/span> false<\/span>)<\/span>]<\/span>,<\/span>
\n [<\/span>'\u2465 \u540c\u8f74\u4e24\u6839：inside \u5728\u524d'<\/span>,<\/span> twoAxisOpt<\/span>(<\/span>[<\/span>
\n {<\/span> type<\/span>:<\/span> 'inside'<\/span>,<\/span> xAxisIndex<\/span>:<\/span> 0<\/span>,<\/span> start<\/span>:<\/span> 60<\/span>,<\/span> end<\/span>:<\/span> 100<\/span> }<\/span>,<\/span>
\n {<\/span> type<\/span>:<\/span> 'slider'<\/span>,<\/span> xAxisIndex<\/span>:<\/span> 0<\/span>,<\/span> start<\/span>:<\/span> 25<\/span>,<\/span> end<\/span>:<\/span> 75<\/span> }<\/span>
\n ]<\/span>,<\/span> false<\/span>)<\/span>]<\/span>,<\/span>
\n [<\/span>'\u2466 x \u4e0e y \u540c\u65f6\u4ea4\u7ed9\u4e00\u6839 dz'<\/span>,<\/span> dzOpt<\/span>(<\/span>[<\/span>mix<\/span>(<\/span>{<\/span> type<\/span>:<\/span> 'slider'<\/span>,<\/span> xAxisIndex<\/span>:<\/span> 0<\/span>,<\/span> yAxisIndex<\/span>:<\/span> 0<\/span>,<\/span> start<\/span>:<\/span> 25<\/span>,<\/span> end<\/span>:<\/span> 75<\/span> }<\/span>,<\/span> {<\/span>}<\/span>)<\/span>]<\/span>,<\/span>
\n {<\/span> yAxis<\/span>:<\/span> {<\/span> type<\/span>:<\/span> 'value'<\/span> }<\/span> }<\/span>)<\/span>]<\/span>,<\/span>
\n [<\/span>'\u2467 dispatchAction \u7684 batch \u4e00\u6b21\u52a8\u4e24\u6839'<\/span>,<\/span> twoAxisOpt<\/span>(<\/span>[<\/span>
\n {<\/span> type<\/span>:<\/span> 'slider'<\/span>,<\/span> xAxisIndex<\/span>:<\/span> 0<\/span>,<\/span> start<\/span>:<\/span> 25<\/span>,<\/span> end<\/span>:<\/span> 75<\/span> }<\/span>,<\/span>
\n {<\/span> type<\/span>:<\/span> 'slider'<\/span>,<\/span> xAxisIndex<\/span>:<\/span> 1<\/span>,<\/span> start<\/span>:<\/span> 10<\/span>,<\/span> end<\/span>:<\/span> 40<\/span> }<\/span>
\n ]<\/span>,<\/span> true<\/span>)<\/span>]<\/span>,<\/span>
\n [<\/span>'\u2468 \u7ed9 \u2464 \u7684\u540e\u6765\u8005\u53d1\u52a8\u4f5c（dataZoomIndex:1）'<\/span>,<\/span> twoAxisOpt<\/span>(<\/span>[<\/span>
\n {<\/span> type<\/span>:<\/span> 'slider'<\/span>,<\/span> xAxisIndex<\/span>:<\/span> 0<\/span>,<\/span> start<\/span>:<\/span> 25<\/span>,<\/span> end<\/span>:<\/span> 75<\/span> }<\/span>,<\/span>
\n {<\/span> type<\/span>:<\/span> 'inside'<\/span>,<\/span> xAxisIndex<\/span>:<\/span> 0<\/span>,<\/span> start<\/span>:<\/span> 60<\/span>,<\/span> end<\/span>:<\/span> 100<\/span> }<\/span>
\n ]<\/span>,<\/span> false<\/span>)<\/span>]<\/span>
\n ]<\/span>;<\/span>
\n function<\/span> both<\/span>(<\/span>svg,<\/span> c<\/span>)<\/span> {<\/span>
\n return<\/span> [<\/span>dzListModel<\/span>(<\/span>c)<\/span>,<\/span> dzRow<\/span>(<\/span>c,<\/span> 0<\/span>)<\/span>,<\/span> dzCount<\/span>(<\/span>c)<\/span> ><\/span> 1<\/span> ?<\/span> dzRow<\/span>(<\/span>c,<\/span> 1<\/span>)<\/span> :<\/span> ' dz1 =（\u53ea\u6709\u4e00\u6839）'<\/span>,<\/span>
\n axisRow<\/span>(<\/span>c,<\/span> 'x'<\/span>,<\/span> 0<\/span>)<\/span>,<\/span> axisRow<\/span>(<\/span>c,<\/span> 'x'<\/span>,<\/span> 1<\/span>)<\/span>,<\/span> gridRow<\/span>(<\/span>c)<\/span>,<\/span> countRow<\/span>(<\/span>c)<\/span>]<\/span>;<\/span>
\n }<\/span>
\n for<\/span> (<\/span>var<\/span> i =<\/span> 0<\/span>;<\/span> i <<\/span> V<\/span>.<\/span>length;<\/span> i++<\/span>)<\/span> {<\/span>
\n (<\/span>function<\/span> (<\/span>idx<\/span>)<\/span> {<\/span>
\n bind<\/span>(<\/span>'b11'<\/span> +<\/span> String.<\/span>fromCharCode<\/span>(<\/span>97<\/span> +<\/span> idx)<\/span>,<\/span> function<\/span> (<\/span>)<\/span> {<\/span>
\n if<\/span> (<\/span>idx ===<\/span> 6<\/span>)<\/span> {<\/span>
\n p.<\/span>run<\/span>(<\/span>V<\/span>[<\/span>idx]<\/span>[<\/span>0<\/span>]<\/span>,<\/span> V<\/span>[<\/span>idx]<\/span>[<\/span>1<\/span>]<\/span>,<\/span> function<\/span> (<\/span>svg,<\/span> c<\/span>)<\/span> {<\/span>
\n return<\/span> both<\/span>(<\/span>svg,<\/span> c)<\/span>.<\/span>concat<\/span>(<\/span>[<\/span>axisRow<\/span>(<\/span>c,<\/span> 'y'<\/span>,<\/span> 0<\/span>)<\/span>,<\/span>
\n ' \u21d2 \u4e24\u6839\u8f74\u5171\u7528\u8fd9\u4e00\u6839 dz，\u4f46 proxy \u662f\u6309\u8f74\u5efa\u7684：x \u7a97\u4e0e y \u7a97\u5404\u7b97\u5404\u7684，'<\/span>
\n +<\/span> '\u7528\u7684\u662f\u540c\u4e00\u5bf9\u767e\u5206\u6bd4（DataZoomModel.js:343-348 \u53d6\u7684\u662f\u8fd9\u6839 dz \u81ea\u5df1\u7684 start\/end）'<\/span>]<\/span>)<\/span>;<\/span>
\n }<\/span>)<\/span>;<\/span>
\n return<\/span>;<\/span>
\n }<\/span>
\n if<\/span> (<\/span>idx ===<\/span> 7<\/span>)<\/span> {<\/span>
\n var<\/span> H<\/span> =<\/span> [<\/span>]<\/span>;<\/span>
\n p.<\/span>runMany<\/span>(<\/span>[<\/span>{<\/span>
\n label<\/span>:<\/span> V<\/span>[<\/span>idx]<\/span>[<\/span>0<\/span>]<\/span>,<\/span> o<\/span>:<\/span> V<\/span>[<\/span>idx]<\/span>[<\/span>1<\/span>]<\/span>,<\/span> build<\/span>:<\/span> both,<\/span>
\n act<\/span>:<\/span> function<\/span> (<\/span>chart,<\/span> reader,<\/span> arr<\/span>)<\/span> {<\/span>
\n H<\/span>.<\/span>length =<\/span> 0<\/span>;<\/span>
\n try<\/span> {<\/span> reader.<\/span>on<\/span>(<\/span>'datazoom'<\/span>,<\/span> function<\/span> (<\/span>)<\/span> {<\/span> H<\/span>.<\/span>push<\/span>(<\/span>'hit'<\/span>)<\/span>;<\/span> }<\/span>)<\/span>;<\/span> }<\/span> catch<\/span> (<\/span>e0)<\/span> {<\/span> }<\/span>
\n try<\/span> {<\/span>
\n reader.<\/span>dispatchAction<\/span>(<\/span>{<\/span>
\n type<\/span>:<\/span> 'dataZoom'<\/span>,<\/span>
\n batch<\/span>:<\/span> [<\/span>{<\/span> dataZoomIndex<\/span>:<\/span> 0<\/span>,<\/span> start<\/span>:<\/span> 0<\/span>,<\/span> end<\/span>:<\/span> 20<\/span> }<\/span>,<\/span> {<\/span> dataZoomIndex<\/span>:<\/span> 1<\/span>,<\/span> start<\/span>:<\/span> 50<\/span>,<\/span> end<\/span>:<\/span> 70<\/span> }<\/span>]<\/span>
\n }<\/span>)<\/span>;<\/span>
\n }<\/span> catch<\/span> (<\/span>e)<\/span> {<\/span> arr.<\/span>push<\/span>(<\/span>' \u21d2 batch \u52a8\u4f5c\u629b\u9519：'<\/span> +<\/span> e.<\/span>message)<\/span>;<\/span> }<\/span>
\n try<\/span> {<\/span> reader.<\/span>off<\/span>(<\/span>'datazoom'<\/span>)<\/span>;<\/span> }<\/span> catch<\/span> (<\/span>e2)<\/span> {<\/span> }<\/span>
\n try<\/span> {<\/span> chart.<\/span>off<\/span>(<\/span>'datazoom'<\/span>)<\/span>;<\/span> }<\/span> catch<\/span> (<\/span>e3)<\/span> {<\/span> }<\/span>
\n try<\/span> {<\/span>
\n chart.<\/span>dispatchAction<\/span>(<\/span>{<\/span>
\n type<\/span>:<\/span> 'dataZoom'<\/span>,<\/span>
\n batch<\/span>:<\/span> [<\/span>{<\/span> dataZoomIndex<\/span>:<\/span> 0<\/span>,<\/span> start<\/span>:<\/span> 0<\/span>,<\/span> end<\/span>:<\/span> 20<\/span> }<\/span>,<\/span> {<\/span> dataZoomIndex<\/span>:<\/span> 1<\/span>,<\/span> start<\/span>:<\/span> 50<\/span>,<\/span> end<\/span>:<\/span> 70<\/span> }<\/span>]<\/span>
\n }<\/span>)<\/span>;<\/span>
\n }<\/span> catch<\/span> (<\/span>e4)<\/span> {<\/span> }<\/span>
\n arr.<\/span>push<\/span>(<\/span>' \u21d2 \u4e00\u6b21 batch \u4e24\u4e2a\u5143\u7d20：\u52a8\u4f5c\u5904\u7406\u5668\u6309\u5143\u7d20\u5404\u8dd1\u4e00\u904d（echarts.js:1496-1505 \u628a batch \u644a\u5e73\u6210 payloads），'<\/span>
\n +<\/span> '\u4f46\u4e8b\u4ef6\u53ea\u53d1\u4e00\u4e2a\u3001e.batch \u662f\u957f\u5ea6 2 \u7684\u6570\u7ec4（:1560-1565）'<\/span>)<\/span>;<\/span>
\n }<\/span>,<\/span>
\n after<\/span>:<\/span> function<\/span> (<\/span>svg,<\/span> c<\/span>)<\/span> {<\/span>
\n return<\/span> [<\/span>' \u4e8b\u4ef6\u547d\u4e2d='<\/span> +<\/span> H<\/span>.<\/span>length +<\/span> ' \u6b21（e.batch \u957f\u5ea6\u89c1\u63a2\u9488 D25），\u53ef\u4e24\u7aef\u7684\u7a97\u53e3\u786e\u5b9e\u90fd\u52a8\u4e86：\u770b\u4e0b\u9762 dz0\/dz1 \u4e24\u6761 settledOption'<\/span>,<\/span>
\n dzRow<\/span>(<\/span>c,<\/span> 0<\/span>)<\/span>,<\/span> dzRow<\/span>(<\/span>c,<\/span> 1<\/span>)<\/span>,<\/span> axisRow<\/span>(<\/span>c,<\/span> 'x'<\/span>,<\/span> 0<\/span>)<\/span>,<\/span> axisRow<\/span>(<\/span>c,<\/span> 'x'<\/span>,<\/span> 1<\/span>)<\/span>]<\/span>;<\/span>
\n }<\/span>
\n }<\/span>]<\/span>)<\/span>;<\/span>
\n return<\/span>;<\/span>
\n }<\/span>
\n if<\/span> (<\/span>idx ===<\/span> 8<\/span>)<\/span> {<\/span>
\n p.<\/span>runMany<\/span>(<\/span>[<\/span>{<\/span>
\n label<\/span>:<\/span> V<\/span>[<\/span>idx]<\/span>[<\/span>0<\/span>]<\/span>,<\/span> o<\/span>:<\/span> V<\/span>[<\/span>idx]<\/span>[<\/span>1<\/span>]<\/span>,<\/span> build<\/span>:<\/span> both,<\/span>
\n act<\/span>:<\/span> function<\/span> (<\/span>chart,<\/span> reader,<\/span> arr<\/span>)<\/span> {<\/span>
\n try<\/span> {<\/span>
\n reader.<\/span>dispatchAction<\/span>(<\/span>{<\/span> type<\/span>:<\/span> 'dataZoom'<\/span>,<\/span> dataZoomIndex<\/span>:<\/span> 1<\/span>,<\/span> start<\/span>:<\/span> 5<\/span>,<\/span> end<\/span>:<\/span> 15<\/span> }<\/span>)<\/span>;<\/span>
\n arr.<\/span>push<\/span>(<\/span>' \u21d2 \u5df2\u7ed9 dataZoomIndex:1（\u90a3\u6839 inside，\u58f0\u660e\u5728\u540e）\u53d1\u7a97\u53e3 5~15'<\/span>)<\/span>;<\/span>
\n }<\/span> catch<\/span> (<\/span>e)<\/span> {<\/span> arr.<\/span>push<\/span>(<\/span>' \u21d2 \u52a8\u4f5c\u629b\u9519：'<\/span> +<\/span> e.<\/span>message)<\/span>;<\/span> }<\/span>
\n try<\/span> {<\/span> chart.<\/span>dispatchAction<\/span>(<\/span>{<\/span> type<\/span>:<\/span> 'dataZoom'<\/span>,<\/span> dataZoomIndex<\/span>:<\/span> 1<\/span>,<\/span> start<\/span>:<\/span> 5<\/span>,<\/span> end<\/span>:<\/span> 15<\/span> }<\/span>)<\/span>;<\/span> }<\/span> catch<\/span> (<\/span>e2)<\/span> {<\/span> }<\/span>
\n }<\/span>,<\/span>
\n after<\/span>:<\/span> function<\/span> (<\/span>svg,<\/span> c<\/span>)<\/span> {<\/span>
\n return<\/span> [<\/span>dzRow<\/span>(<\/span>c,<\/span> 0<\/span>)<\/span>,<\/span> dzRow<\/span>(<\/span>c,<\/span> 1<\/span>)<\/span>,<\/span> axisRow<\/span>(<\/span>c,<\/span> 'x'<\/span>,<\/span> 0<\/span>)<\/span>,<\/span>
\n ' \u21d2 \u7ed9\u540e\u6765\u8005\u53d1\u52a8\u4f5c，\u7167\u6837\u6539\u5f97\u52a8\u8f74：findEffectedDataZooms \u4f1a\u987a\u7740\u300c\u540c\u8f74\u5373\u8054\u52a8\u300d\u628a\u540c\u4e00\u6761\u8f74\u4e0a\u7684\u7ec4\u4ef6\u5168\u5237\u4e00\u904d'<\/span>
\n +<\/span> '（helper.js:93-105），\u800c\u7a97\u53e3\u7684\u7b97\u6cd5\u53ea\u8ba4\u4e3b\u4eba（AxisProxy.js:253 \u65e9\u9000\u3001:271 \u8bfb\u4e3b\u4eba\u7684 settledOption）'<\/span>]<\/span>;<\/span>
\n }<\/span>
\n }<\/span>]<\/span>)<\/span>;<\/span>
\n return<\/span>;<\/span>
\n }<\/span>
\n p.<\/span>run<\/span>(<\/span>V<\/span>[<\/span>idx]<\/span>[<\/span>0<\/span>]<\/span>,<\/span> V<\/span>[<\/span>idx]<\/span>[<\/span>1<\/span>]<\/span>,<\/span> both)<\/span>;<\/span>
\n }<\/span>)<\/span>;<\/span>
\n }<\/span>)<\/span>(<\/span>i)<\/span>;<\/span>
\n }<\/span>
\n p.<\/span>run<\/span>(<\/span>V<\/span>[<\/span>4<\/span>]<\/span>[<\/span>0<\/span>]<\/span>,<\/span> V<\/span>[<\/span>4<\/span>]<\/span>[<\/span>1<\/span>]<\/span>,<\/span> both)<\/span>;<\/span>
\n}<\/span><\/p>\n

\/* ===== \u9762\u677f\u5341\u4e8c：toolbox \u7684\u6846\u9009（\u7b2c\u5341\u516b\u8282：\u4e00\u6839\u90fd\u4e0d\u5199，\u5efa\u56fe\u5c31\u4e24\u6839） ===== *\/<\/span><\/p>\n

function<\/span> tbOpt<\/span>(<\/span>feature,<\/span> extra<\/span>)<\/span> {<\/span>
\n return<\/span> \/** @type {any} *\/<\/span>(<\/span>mix<\/span>(<\/span>{<\/span>
\n animation<\/span>:<\/span> false<\/span>,<\/span>
\n xAxis<\/span>:<\/span> {<\/span> type<\/span>:<\/span> 'category'<\/span>,<\/span> data<\/span>:<\/span> CAT12<\/span>.<\/span>slice<\/span>(<\/span>)<\/span> }<\/span>,<\/span> yAxis<\/span>:<\/span> {<\/span>}<\/span>,<\/span>
\n series<\/span>:<\/span> [<\/span>{<\/span> type<\/span>:<\/span> 'line'<\/span>,<\/span> data<\/span>:<\/span> A12<\/span>.<\/span>slice<\/span>(<\/span>)<\/span>,<\/span> showSymbol<\/span>:<\/span> false<\/span> }<\/span>]<\/span>,<\/span>
\n toolbox<\/span>:<\/span> {<\/span> feature<\/span>:<\/span> feature ||<\/span> {<\/span> dataZoom<\/span>:<\/span> {<\/span>}<\/span> }<\/span> }<\/span>
\n }<\/span>,<\/span> extra)<\/span>)<\/span>;<\/span>
\n}<\/span>
\nfunction<\/span> selectFeatureRow<\/span>(<\/span>c<\/span>)<\/span> {<\/span>
\n var<\/span> m =<\/span> modelOf<\/span>(<\/span>c)<\/span>;<\/span>
\n if<\/span> (<\/span>!<\/span>m)<\/span> return<\/span> ' toolbox \u7279\u5f81 = '<\/span> +<\/span> NO_MODEL<\/span>;<\/span>
\n var<\/span> out =<\/span> [<\/span>]<\/span>;<\/span>
\n try<\/span> {<\/span>
\n var<\/span> tm =<\/span> m.<\/span>getComponent<\/span>(<\/span>'toolbox'<\/span>,<\/span> 0<\/span>)<\/span>;<\/span>
\n var<\/span> f =<\/span> tm &&<\/span> tm.<\/span>getModel ?<\/span> tm.<\/span>getModel<\/span>(<\/span>'feature'<\/span>)<\/span> :<\/span> null<\/span>;<\/span>
\n out.<\/span>push<\/span>(<\/span>' feature \u952e='<\/span> +<\/span> JSON<\/span>.<\/span>stringify<\/span>(<\/span>f ?<\/span> Object.<\/span>keys<\/span>(<\/span>f.<\/span>option ||<\/span> {<\/span>}<\/span>)<\/span> :<\/span> null<\/span>)<\/span> +<\/span>
\n ' dataZoom \u9ed8\u8ba4\u503c='<\/span> +<\/span> JSON<\/span>.<\/span>stringify<\/span>(<\/span>f &&<\/span> f.<\/span>get ?<\/span> {<\/span>
\n yAxisIndex<\/span>:<\/span> f.<\/span>get<\/span>(<\/span>'yAxisIndex'<\/span>)<\/span>,<\/span> filterMode<\/span>:<\/span> f.<\/span>get<\/span>(<\/span>'filterMode'<\/span>)<\/span>,<\/span> zoomLock<\/span>:<\/span> f.<\/span>get<\/span>(<\/span>'zoomLock'<\/span>)<\/span>,<\/span>
\n brushSelect<\/span>:<\/span> f.<\/span>get<\/span>(<\/span>'brushSelect'<\/span>)<\/span>,<\/span> icon<\/span>:<\/span> f.<\/span>get<\/span>(<\/span>'icon'<\/span>)<\/span>,<\/span> title<\/span>:<\/span> f.<\/span>get<\/span>(<\/span>'title'<\/span>)<\/span>
\n }<\/span> :<\/span> null<\/span>)<\/span>)<\/span>;<\/span>
\n }<\/span> catch<\/span> (<\/span>e)<\/span> {<\/span> out.<\/span>push<\/span>(<\/span>' feature \u8bfb\u4e0d\u5230：'<\/span> +<\/span> e.<\/span>message)<\/span>;<\/span> }<\/span>
\n try<\/span> {<\/span>
\n var<\/span> ids =<\/span> [<\/span>]<\/span>;<\/span>
\n m.<\/span>eachComponent<\/span>(<\/span>'dataZoom'<\/span>,<\/span> function<\/span> (<\/span>zm<\/span>)<\/span> {<\/span> ids.<\/span>push<\/span>(<\/span>String<\/span>(<\/span>zm.<\/span>id)<\/span>)<\/span>;<\/span> }<\/span>)<\/span>;<\/span>
\n out.<\/span>push<\/span>(<\/span>' \u771f dataZoom \u7ec4\u4ef6 id='<\/span> +<\/span> JSON<\/span>.<\/span>stringify<\/span>(<\/span>ids)<\/span>)<\/span>;<\/span>
\n }<\/span> catch<\/span> (<\/span>e2)<\/span> {<\/span> out.<\/span>push<\/span>(<\/span>' \u7ec4\u4ef6\u6e05\u5355\u8bfb\u4e0d\u5230（\u6869\u4ef6）'<\/span>)<\/span>;<\/span> }<\/span>
\n return<\/span> out.<\/span>join<\/span>(<\/span>'\\\\n'<\/span>)<\/span>;<\/span>
\n}<\/span><\/p>\n

function<\/span> initPanel12<\/span>(<\/span>)<\/span> {<\/span>
\n var<\/span> p =<\/span> makePanel<\/span>(<\/span>'p12'<\/span>)<\/span>;<\/span>
\n \/** @type {any[][]} *\/<\/span>
\n var<\/span> V<\/span> =<\/span> [<\/span>
\n [<\/span>'\u2460 \u53ea\u6302 toolbox，\u4e0d\u70b9'<\/span>,<\/span> tbOpt<\/span>(<\/span>)<\/span>]<\/span>,<\/span>
\n [<\/span>'\u2461 \u70b9\u4e0b dataZoom \u56fe\u6807（takeGlobalCursor）'<\/span>,<\/span> tbOpt<\/span>(<\/span>)<\/span>]<\/span>,<\/span>
\n [<\/span>'\u2462 \u6a21\u62df\u4e00\u6b21\u6846\u9009'<\/span>,<\/span> tbOpt<\/span>(<\/span>)<\/span>]<\/span>,<\/span>
\n [<\/span>'\u2463 \u6846\u9009\u4e4b\u540e\u518d\u70b9 restore'<\/span>,<\/span> tbOpt<\/span>(<\/span>)<\/span>]<\/span>,<\/span>
\n [<\/span>'\u2464 yAxis \u578b\u6846\u9009'<\/span>,<\/span> tbOpt<\/span>(<\/span>{<\/span> dataZoom<\/span>:<\/span> {<\/span> yAxisIndex<\/span>:<\/span> 0<\/span> }<\/span> }<\/span>)<\/span>]<\/span>,<\/span>
\n [<\/span>'\u2465 \u6570\u4e00\u6b21 dispatch \u89e6\u53d1\u51e0\u4e2a datazoom \u4e8b\u4ef6'<\/span>,<\/span> dzOpt<\/span>(<\/span>[<\/span>slider<\/span>(<\/span>25<\/span>,<\/span> 75<\/span>)<\/span>,<\/span> inside<\/span>(<\/span>25<\/span>,<\/span> 75<\/span>)<\/span>]<\/span>)<\/span>]<\/span>,<\/span>
\n [<\/span>'\u2466 brush \u4e0e dataZoom \u7684\u56fe\u6807\u540c\u65f6\u6302'<\/span>,<\/span> tbOpt<\/span>(<\/span>{<\/span> dataZoom<\/span>:<\/span> {<\/span>}<\/span>,<\/span> brush<\/span>:<\/span> {<\/span> toolbox<\/span>:<\/span> [<\/span>'rect'<\/span>,<\/span> 'clear'<\/span>]<\/span> }<\/span> }<\/span>)<\/span>]<\/span>,<\/span>
\n [<\/span>'\u2467 \u53ea\u6302 toolbox，\u5efa\u56fe\u4e4b\u540e\u518d setOption \u4e00\u6839\u7528\u6237 slider'<\/span>,<\/span> tbOpt<\/span>(<\/span>)<\/span>]<\/span>
\n ]<\/span>;<\/span>
\n function<\/span> std<\/span>(<\/span>svg,<\/span> c<\/span>)<\/span> {<\/span>
\n return<\/span> [<\/span>dzListModel<\/span>(<\/span>c)<\/span>,<\/span> selectFeatureRow<\/span>(<\/span>c)<\/span>,<\/span> ' getOption().dataZoom='<\/span> +<\/span>
\n JSON<\/span>.<\/span>stringify<\/span>(<\/span>(<\/span>function<\/span> (<\/span>)<\/span> {<\/span> try<\/span> {<\/span> return<\/span> c.<\/span>getOption<\/span>(<\/span>)<\/span>.<\/span>dataZoom ||<\/span> null<\/span>;<\/span> }<\/span> catch<\/span> (<\/span>e)<\/span> {<\/span> return<\/span> '\u8bfb\u4e0d\u5230'<\/span>;<\/span> }<\/span> }<\/span>)<\/span>(<\/span>)<\/span>)<\/span>,<\/span>
\n geometryRow<\/span>(<\/span>svg)<\/span>,<\/span> axisRow<\/span>(<\/span>c,<\/span> 'x'<\/span>,<\/span> 0<\/span>)<\/span>,<\/span> countRow<\/span>(<\/span>c)<\/span>]<\/span>;<\/span>
\n }<\/span>
\n \/\/ \u90a3\u4e24\u6839 select \u578b dataZoom \u7684 id（DATA_ZOOM_ID_BASE + \u8f74\u540d + \u4e0b\u6807，\u89c1 DataZoom.js:251）<\/span>
\n var<\/span> TB_X<\/span> =<\/span> '\\\\u0000_ec_\\\\u0000toolbox-dataZoom_xAxis0'<\/span>;<\/span>
\n var<\/span> TB_Y<\/span> =<\/span> '\\\\u0000_ec_\\\\u0000toolbox-dataZoom_yAxis0'<\/span>;<\/span>
\n for<\/span> (<\/span>var<\/span> i =<\/span> 0<\/span>;<\/span> i <<\/span> V<\/span>.<\/span>length;<\/span> i++<\/span>)<\/span> {<\/span>
\n (<\/span>function<\/span> (<\/span>idx<\/span>)<\/span> {<\/span>
\n bind<\/span>(<\/span>'b12'<\/span> +<\/span> String.<\/span>fromCharCode<\/span>(<\/span>97<\/span> +<\/span> idx)<\/span>,<\/span> function<\/span> (<\/span>)<\/span> {<\/span>
\n if<\/span> (<\/span>idx ===<\/span> 1<\/span>)<\/span> {<\/span>
\n p.<\/span>run<\/span>(<\/span>V<\/span>[<\/span>idx]<\/span>[<\/span>0<\/span>]<\/span>,<\/span> V<\/span>[<\/span>idx]<\/span>[<\/span>1<\/span>]<\/span>,<\/span> std,<\/span> function<\/span> (<\/span>chart,<\/span> reader,<\/span> arr<\/span>)<\/span> {<\/span>
\n var<\/span> p1 =<\/span> {<\/span> type<\/span>:<\/span> 'takeGlobalCursor'<\/span>,<\/span> key<\/span>:<\/span> 'dataZoomSelect'<\/span>,<\/span> dataZoomSelectActive<\/span>:<\/span> true<\/span> }<\/span>;<\/span>
\n var<\/span> err =<\/span> fire<\/span>(<\/span>reader,<\/span> p1)<\/span>;<\/span>
\n fire<\/span>(<\/span>chart,<\/span> p1)<\/span>;<\/span>
\n arr.<\/span>push<\/span>(<\/span>err ?<\/span> ' \u21d2 takeGlobalCursor \u629b\u9519：'<\/span> +<\/span> err
\n :<\/span> ' \u21d2 \u5df2 dispatch takeGlobalCursor(key:"dataZoomSelect")：\u8fd9\u4e00\u6b65\u53ea\u505a\u4e24\u4ef6\u4e8b\u2014\u2014brush \u9762\u677f setPanels + enableBrush（DataZoom.js:216-225），\u56fe\u6807\u8fdb emphasis \u6001（:215）'<\/span>)<\/span>;<\/span>
\n try<\/span> {<\/span>
\n arr.<\/span>push<\/span>(<\/span>' dispatch \u4e4b\u540e getOption().dataZoom \u6839\u6570='<\/span> +<\/span> (<\/span>(<\/span>reader.<\/span>getOption<\/span>(<\/span>)<\/span>.<\/span>dataZoom ||<\/span> [<\/span>]<\/span>)<\/span>.<\/span>length)<\/span> +<\/span>
\n '，\u7ec4\u4ef6\u6811\u4e0a\u7684 dataZoom \u6839\u6570='<\/span> +<\/span> dzCount<\/span>(<\/span>reader)<\/span>)<\/span>;<\/span>
\n }<\/span> catch<\/span> (<\/span>e2)<\/span> {<\/span> }<\/span>
\n }<\/span>,<\/span> function<\/span> (<\/span>svg,<\/span> c<\/span>)<\/span> {<\/span>
\n return<\/span> [<\/span>' \u21d2 \u90a3\u4e24\u6839 select \u4e0d\u662f\u70b9\u51fa\u6765\u7684：option creator \u5efa\u56fe\u65f6\u5c31\u751f\u6210\u4e86（DataZoom.js:243-255，'<\/span>
\n +<\/span> '\u6bcf\u6839\u88ab finder \u6307\u5230\u7684\u8f74\u4e00\u6839，type:"select"\u3001$fromToolbox:true\u3001id=DATA_ZOOM_ID_BASE + \u8f74\u540d + \u4e0b\u6807）'<\/span>,<\/span>
\n dzRow<\/span>(<\/span>c,<\/span> 0<\/span>)<\/span>,<\/span> axisRow<\/span>(<\/span>c,<\/span> 'x'<\/span>,<\/span> 0<\/span>)<\/span>]<\/span>;<\/span>
\n }<\/span>)<\/span>;<\/span>
\n return<\/span>;<\/span>
\n }<\/span>
\n if<\/span> (<\/span>idx ===<\/span> 2<\/span> ||<\/span> idx ===<\/span> 3<\/span>)<\/span> {<\/span>
\n p.<\/span>run<\/span>(<\/span>V<\/span>[<\/span>idx]<\/span>[<\/span>0<\/span>]<\/span>,<\/span> V<\/span>[<\/span>idx]<\/span>[<\/span>1<\/span>]<\/span>,<\/span> std,<\/span> function<\/span> (<\/span>chart,<\/span> reader,<\/span> arr<\/span>)<\/span> {<\/span>
\n var<\/span> p1 =<\/span> {<\/span> type<\/span>:<\/span> 'takeGlobalCursor'<\/span>,<\/span> key<\/span>:<\/span> 'dataZoomSelect'<\/span>,<\/span> dataZoomSelectActive<\/span>:<\/span> true<\/span> }<\/span>;<\/span>
\n \/\/ \u7167 DataZoom.js:123-127 \u7684 snapshot \u5f62\u72b6\u53d1：batch \u5143\u7d20\u5e26 dataZoomId，\u53ea\u5199 startValue\/endValue<\/span>
\n var<\/span> p2 =<\/span> {<\/span> type<\/span>:<\/span> 'dataZoom'<\/span>,<\/span> batch<\/span>:<\/span> [<\/span>{<\/span> dataZoomId<\/span>:<\/span> TB_X<\/span>,<\/span> startValue<\/span>:<\/span> 2<\/span>,<\/span> endValue<\/span>:<\/span> 6<\/span> }<\/span>]<\/span> }<\/span>;<\/span>
\n var<\/span> e1 =<\/span> fire<\/span>(<\/span>reader,<\/span> p1)<\/span>;<\/span>
\n fire<\/span>(<\/span>chart,<\/span> p1)<\/span>;<\/span>
\n arr.<\/span>push<\/span>(<\/span>e1 ?<\/span> ' \u21d2 takeGlobalCursor \u629b\u9519：'<\/span> +<\/span> e1 :<\/span> ' \u21d2 \u5df2 takeGlobalCursor（\u6846\u9009\u6001\u5f00）'<\/span>)<\/span>;<\/span>
\n var<\/span> err =<\/span> fire<\/span>(<\/span>reader,<\/span> p2)<\/span>;<\/span>
\n fire<\/span>(<\/span>chart,<\/span> p2)<\/span>;<\/span>
\n arr.<\/span>push<\/span>(<\/span>(<\/span>err ?<\/span> ' \u21d2 \u6846\u9009\u52a8\u4f5c\u629b\u9519：'<\/span> +<\/span> err
\n :<\/span> ' \u21d2 \u5df2\u6309 _onBrush \u7684\u5f62\u72b6\u53d1 batch（\u4e00\u6761\u5143\u7d20，dataZoomId \u6307\u5411 x \u8f74\u90a3\u6839 select，\u53ea\u5199 startValue\/endValue）'<\/span>)<\/span> +<\/span>
\n '（\u8fd9\u4e00\u6b65\u5c31\u662f\u300c\u6846\u5b8c\u4e4b\u540e\u677e\u624b\u300d：_onBrush \u53ea\u5728 isEnd \u4e14 areas \u975e\u7a7a\u65f6\u624d\u53d1，DataZoom.js:82-89）'<\/span>)<\/span>;<\/span>
\n if<\/span> (<\/span>idx ===<\/span> 3<\/span>)<\/span> {<\/span>
\n var<\/span> e3 =<\/span> fire<\/span>(<\/span>reader,<\/span> {<\/span> type<\/span>:<\/span> 'restore'<\/span> }<\/span>)<\/span>;<\/span>
\n fire<\/span>(<\/span>chart,<\/span> {<\/span> type<\/span>:<\/span> 'restore'<\/span> }<\/span>)<\/span>;<\/span>
\n arr.<\/span>push<\/span>(<\/span>(<\/span>e3 ?<\/span> ' \u21d2 restore \u629b\u9519：'<\/span> +<\/span> e3 :<\/span> ' \u21d2 \u53c8 dispatch restore：\u7a97\u53e3\u56de\u5230 option \u58f0\u660e\u503c'<\/span>)<\/span> +<\/span>
\n '（toolbox \u90a3\u4e2a back \u6309\u94ae\u8d70\u7684\u662f history.pop，\u4e0d\u662f restore：DataZoom.js:183-185）'<\/span>)<\/span>;<\/span>
\n }<\/span>
\n }<\/span>,<\/span> function<\/span> (<\/span>svg,<\/span> c<\/span>)<\/span> {<\/span>
\n return<\/span> [<\/span>dzListModel<\/span>(<\/span>c)<\/span>,<\/span> dzRow<\/span>(<\/span>c,<\/span> 0<\/span>)<\/span>,<\/span> dzCount<\/span>(<\/span>c)<\/span> ><\/span> 1<\/span> ?<\/span> dzRow<\/span>(<\/span>c,<\/span> 1<\/span>)<\/span> :<\/span> ' dz1 =（\u53ea\u6709\u4e00\u6839）'<\/span>,<\/span>
\n axisRow<\/span>(<\/span>c,<\/span> 'x'<\/span>,<\/span> 0<\/span>)<\/span>,<\/span> backRow<\/span>(<\/span>c,<\/span> 0<\/span>)<\/span>,<\/span>
\n ' \u21d2 \u6846\u9009\u7684\u53d6\u6574\u5728 DataZoom.js:122-126：getAcceptableTickPrecision(scaleExtent, grid \u5bbd, 0.5) \u7b97\u51fa precision，'<\/span>
\n +<\/span> '\u518d\u628a coordRange \u7684\u4e24\u7aef round \u4e00\u4e0b\u2014\u2014\u548c\u7b2c\u5341\u8282\u90a3\u6761\u53d6\u6574\u5b9a\u5f8b\u662f\u540c\u4e00\u4e2a\u601d\u8def（\u5148\u4fdd\u8bc1\u300c\u663e\u793a\u5f97\u51fa\u6765\u300d）'<\/span>]<\/span>;<\/span>
\n }<\/span>)<\/span>;<\/span>
\n return<\/span>;<\/span>
\n }<\/span>
\n if<\/span> (<\/span>idx ===<\/span> 5<\/span>)<\/span> {<\/span>
\n \/\/ \u6bcf\u4e2a\u76d1\u542c\u540d\u5355\u72ec\u6d4b\u4e00\u904d：chart.on \u5927\u5c0f\u5199\u4e0d\u654f\u611f，\u6df7\u5728\u4e00\u8d77\u6d4b\u4f1a\u4e92\u76f8\u6c61\u67d3<\/span>
\n var<\/span> acts =<\/span> [<\/span>
\n [<\/span>'\u5355\u4e2a\u52a8\u4f5c dataZoomIndex:0'<\/span>,<\/span> {<\/span> type<\/span>:<\/span> 'dataZoom'<\/span>,<\/span> dataZoomIndex<\/span>:<\/span> 0<\/span>,<\/span> start<\/span>:<\/span> 10<\/span>,<\/span> end<\/span>:<\/span> 30<\/span> }<\/span>]<\/span>,<\/span>
\n [<\/span>'\u4e0d\u7ed9 index \u7684\u52a8\u4f5c'<\/span>,<\/span> {<\/span> type<\/span>:<\/span> 'dataZoom'<\/span>,<\/span> start<\/span>:<\/span> 10<\/span>,<\/span> end<\/span>:<\/span> 30<\/span> }<\/span>]<\/span>,<\/span>
\n [<\/span>'batch \u4e24\u4e2a\u5143\u7d20'<\/span>,<\/span> {<\/span> type<\/span>:<\/span> 'dataZoom'<\/span>,<\/span> batch<\/span>:<\/span> [<\/span>{<\/span> dataZoomIndex<\/span>:<\/span> 0<\/span>,<\/span> start<\/span>:<\/span> 10<\/span>,<\/span> end<\/span>:<\/span> 30<\/span> }<\/span>,<\/span> {<\/span> dataZoomIndex<\/span>:<\/span> 1<\/span>,<\/span> start<\/span>:<\/span> 40<\/span>,<\/span> end<\/span>:<\/span> 60<\/span> }<\/span>]<\/span> }<\/span>]<\/span>
\n ]<\/span>;<\/span>
\n var<\/span> names =<\/span> [<\/span>'datazoom'<\/span>,<\/span> 'dataZoom'<\/span>,<\/span> 'DataZoom'<\/span>,<\/span> 'DATAZOOM'<\/span>]<\/span>;<\/span>
\n var<\/span> tbl =<\/span> {<\/span>}<\/span>;<\/span>
\n p.<\/span>run<\/span>(<\/span>V<\/span>[<\/span>idx]<\/span>[<\/span>0<\/span>]<\/span>,<\/span> V<\/span>[<\/span>idx]<\/span>[<\/span>1<\/span>]<\/span>,<\/span> std,<\/span> function<\/span> (<\/span>chart,<\/span> reader,<\/span> arr<\/span>)<\/span> {<\/span>
\n for<\/span> (<\/span>var<\/span> a =<\/span> 0<\/span>;<\/span> a <<\/span> acts.<\/span>length;<\/span> a++<\/span>)<\/span> {<\/span>
\n for<\/span> (<\/span>var<\/span> k =<\/span> 0<\/span>;<\/span> k <<\/span> names.<\/span>length;<\/span> k++<\/span>)<\/span> {<\/span>
\n var<\/span> n =<\/span> 0<\/span>,<\/span> last =<\/span> \/** @type {any} *\/<\/span> (<\/span>null<\/span>)<\/span>;<\/span>
\n try<\/span> {<\/span>
\n reader.<\/span>on<\/span>(<\/span>names[<\/span>k]<\/span>,<\/span> function<\/span> (<\/span>e<\/span>)<\/span> {<\/span> n++<\/span>;<\/span> last =<\/span> {<\/span> type<\/span>:<\/span> e.<\/span>type,<\/span> start<\/span>:<\/span> e.<\/span>start,<\/span> end<\/span>:<\/span> e.<\/span>end,<\/span> batch<\/span>:<\/span> e.<\/span>batch ?<\/span> e.<\/span>batch.<\/span>length :<\/span> 0<\/span> }<\/span>;<\/span> }<\/span>)<\/span>;<\/span>
\n fire<\/span>(<\/span>reader,<\/span> acts[<\/span>a]<\/span>[<\/span>1<\/span>]<\/span>)<\/span>;<\/span>
\n }<\/span> catch<\/span> (<\/span>e)<\/span> {<\/span> arr.<\/span>push<\/span>(<\/span>' \u21d2 '<\/span> +<\/span> acts[<\/span>a]<\/span>[<\/span>0<\/span>]<\/span> +<\/span> ' \u629b\u9519：'<\/span> +<\/span> e.<\/span>message)<\/span>;<\/span> }<\/span>
\n try<\/span> {<\/span> reader.<\/span>off<\/span>(<\/span>names[<\/span>k]<\/span>)<\/span>;<\/span> }<\/span> catch<\/span> (<\/span>e2)<\/span> {<\/span> }<\/span>
\n tbl[<\/span>acts[<\/span>a]<\/span>[<\/span>0<\/span>]<\/span> +<\/span> '｜on('<\/span> +<\/span> names[<\/span>k]<\/span> +<\/span> ')'<\/span>]<\/span> =<\/span> n +<\/span> (<\/span>last ?<\/span> ' \u6b21，e.type='<\/span> +<\/span> last.<\/span>type +<\/span> ' e.batch='<\/span> +<\/span> last.<\/span>batch :<\/span> ' \u6b21'<\/span>)<\/span>;<\/span>
\n }<\/span>
\n }<\/span>
\n arr.<\/span>push<\/span>(<\/span>' \u547d\u4e2d\u8868='<\/span> +<\/span> JSON<\/span>.<\/span>stringify<\/span>(<\/span>tbl,<\/span> null<\/span>,<\/span> 1<\/span>)<\/span>)<\/span>;<\/span>
\n fire<\/span>(<\/span>chart,<\/span> acts[<\/span>acts.<\/span>length –<\/span> 1<\/span>]<\/span>[<\/span>1<\/span>]<\/span>)<\/span>;<\/span>
\n try<\/span> {<\/span>
\n arr.<\/span>push<\/span>(<\/span>' \u6700\u540e\u4e00\u6863 dispatch \u4e4b\u540e getOption().dataZoom \u4e24\u6839\u7684\u7a97\u53e3='<\/span> +<\/span>
\n JSON<\/span>.<\/span>stringify<\/span>(<\/span>(<\/span>reader.<\/span>getOption<\/span>(<\/span>)<\/span>.<\/span>dataZoom ||<\/span> [<\/span>]<\/span>)<\/span>.<\/span>map<\/span>(<\/span>function<\/span> (<\/span>d<\/span>)<\/span> {<\/span> return<\/span> [<\/span>d.<\/span>start,<\/span> d.<\/span>end,<\/span> d.<\/span>startValue,<\/span> d.<\/span>endValue]<\/span>;<\/span> }<\/span>)<\/span>)<\/span> +<\/span>
\n '（\u4e24\u6839\u5171\u7528\u540c\u4e00\u4e2a axis proxy：\u52a8\u4f5c\u7ecf findEffectedDataZooms \u8054\u52a8\u5230\u6240\u6709\u540c\u8f74\u7684\u7ec4\u4ef6，helper.js:93-105）'<\/span>)<\/span>;<\/span>
\n }<\/span> catch<\/span> (<\/span>e3)<\/span> {<\/span> }<\/span>
\n }<\/span>,<\/span> function<\/span> (<\/span>svg,<\/span> c<\/span>)<\/span> {<\/span>
\n return<\/span> [<\/span>dzRow<\/span>(<\/span>c,<\/span> 0<\/span>)<\/span>,<\/span> dzRow<\/span>(<\/span>c,<\/span> 1<\/span>)<\/span>,<\/span> axisRow<\/span>(<\/span>c,<\/span> 'x'<\/span>,<\/span> 0<\/span>)<\/span>,<\/span> countRow<\/span>(<\/span>c)<\/span>,<\/span>
\n ' \u21d2 \u4e00\u6b21 dispatch \u53ea\u53d1 1 \u4e2a datazoom \u4e8b\u4ef6（\u56db\u79cd\u5927\u5c0f\u5199\u5199\u6cd5\u5404\u547d\u4e2d 1）；batch \u4e24\u4e2a\u5143\u7d20\u4e5f\u53ea 1 \u6b21，'<\/span>
\n +<\/span> '\u4f46 e.batch \u662f\u4e2a\u6570\u7ec4\u3001\u957f\u5ea6 2（echarts.js:1560-1565\u300cFollow the rule of action batch\u300d）'<\/span>]<\/span>;<\/span>
\n }<\/span>)<\/span>;<\/span>
\n return<\/span>;<\/span>
\n }<\/span>
\n if<\/span> (<\/span>idx ===<\/span> 4<\/span>)<\/span> {<\/span>
\n p.<\/span>run<\/span>(<\/span>V<\/span>[<\/span>idx]<\/span>[<\/span>0<\/span>]<\/span>,<\/span> V<\/span>[<\/span>idx]<\/span>[<\/span>1<\/span>]<\/span>,<\/span> std,<\/span> function<\/span> (<\/span>chart,<\/span> reader,<\/span> arr<\/span>)<\/span> {<\/span>
\n var<\/span> p1 =<\/span> {<\/span> type<\/span>:<\/span> 'dataZoom'<\/span>,<\/span> batch<\/span>:<\/span> [<\/span>{<\/span> dataZoomId<\/span>:<\/span> TB_Y<\/span>,<\/span> startValue<\/span>:<\/span> 10<\/span>,<\/span> endValue<\/span>:<\/span> 30<\/span> }<\/span>]<\/span> }<\/span>;<\/span>
\n var<\/span> err =<\/span> fire<\/span>(<\/span>reader,<\/span> p1)<\/span>;<\/span>
\n fire<\/span>(<\/span>chart,<\/span> p1)<\/span>;<\/span>
\n arr.<\/span>push<\/span>(<\/span>err ?<\/span> ' \u21d2 \u7ed9 y \u8f74\u90a3\u6839 select \u53d1\u52a8\u4f5c\u629b\u9519：'<\/span> +<\/span> err
\n :<\/span> ' \u21d2 \u53ea\u7ed9 dataZoomId \u6307\u5411 y \u7684\u90a3\u6839 select \u53d1 value \u7a97\u53e3 10~30（x \u8f74\u90a3\u6839\u4e0d\u5728 batch \u91cc）'<\/span>)<\/span>;<\/span>
\n }<\/span>,<\/span> function<\/span> (<\/span>svg,<\/span> c<\/span>)<\/span> {<\/span>
\n return<\/span> [<\/span>dzRow<\/span>(<\/span>c,<\/span> 0<\/span>)<\/span>,<\/span> dzRow<\/span>(<\/span>c,<\/span> 1<\/span>)<\/span>,<\/span> axisRow<\/span>(<\/span>c,<\/span> 'x'<\/span>,<\/span> 0<\/span>)<\/span>,<\/span> axisRow<\/span>(<\/span>c,<\/span> 'y'<\/span>,<\/span> 0<\/span>)<\/span>,<\/span>
\n ' \u21d2 \u770b dz1（y \u90a3\u6839）\u7684 host \u4e0e\u751f\u6548\u7a97：x\/y \u4e24\u6839 select \u5404\u7ba1\u4e00\u6839\u8f74，\u4e92\u4e0d\u8054\u52a8（\u4e0d\u540c\u8f74\u5c31\u4e0d\u7b97 linked，helper.js:111-120）'<\/span>]<\/span>;<\/span>
\n }<\/span>)<\/span>;<\/span>
\n return<\/span>;<\/span>
\n }<\/span>
\n if<\/span> (<\/span>idx ===<\/span> 7<\/span>)<\/span> {<\/span>
\n p.<\/span>run<\/span>(<\/span>V<\/span>[<\/span>idx]<\/span>[<\/span>0<\/span>]<\/span>,<\/span> V<\/span>[<\/span>idx]<\/span>[<\/span>1<\/span>]<\/span>,<\/span> function<\/span> (<\/span>svg,<\/span> c<\/span>)<\/span> {<\/span>
\n var<\/span> o =<\/span> null<\/span>,<\/span> readErr =<\/span> ''<\/span>;<\/span>
\n try<\/span> {<\/span> o =<\/span> c.<\/span>getOption<\/span>(<\/span>)<\/span>.<\/span>dataZoom;<\/span> }<\/span> catch<\/span> (<\/span>e)<\/span> {<\/span> readErr =<\/span> e.<\/span>message;<\/span> }<\/span>
\n var<\/span> shape =<\/span> [<\/span>]<\/span>;<\/span>
\n if<\/span> (<\/span>o)<\/span> {<\/span>
\n for<\/span> (<\/span>var<\/span> q =<\/span> 0<\/span>;<\/span> q <<\/span> o.<\/span>length;<\/span> q++<\/span>)<\/span> {<\/span>
\n shape.<\/span>push<\/span>(<\/span>q +<\/span> ':'<\/span> +<\/span> (<\/span>o[<\/span>q]<\/span> ===<\/span> null<\/span> ?<\/span> 'null（\u6d1e）'<\/span>
\n :<\/span> (<\/span>o[<\/span>q]<\/span>.<\/span>id !=<\/span> null<\/span> ?<\/span> 'id='<\/span> +<\/span> JSON<\/span>.<\/span>stringify<\/span>(<\/span>String<\/span>(<\/span>o[<\/span>q]<\/span>.<\/span>id)<\/span>)<\/span> :<\/span> String<\/span>(<\/span>o[<\/span>q]<\/span>.<\/span>type)<\/span>)<\/span>)<\/span>)<\/span>;<\/span>
\n }<\/span>
\n }<\/span>
\n return<\/span> [<\/span>selectFeatureRow<\/span>(<\/span>c)<\/span>,<\/span> dzRow<\/span>(<\/span>c,<\/span> 0<\/span>)<\/span>,<\/span> dzRow<\/span>(<\/span>c,<\/span> 1<\/span>)<\/span>,<\/span> dzRow<\/span>(<\/span>c,<\/span> 2<\/span>)<\/span>,<\/span>
\n ' getOption().dataZoom \u957f\u5ea6='<\/span> +<\/span> (<\/span>o ?<\/span> o.<\/span>length :<\/span> '\u8bfb\u4e0d\u5230 '<\/span> +<\/span> readErr)<\/span>,<\/span>
\n ' \u9010\u69fd='<\/span> +<\/span> JSON<\/span>.<\/span>stringify<\/span>(<\/span>shape)<\/span>,<\/span>
\n geometryRow<\/span>(<\/span>svg)<\/span>,<\/span> axisRow<\/span>(<\/span>c,<\/span> 'x'<\/span>,<\/span> 0<\/span>)<\/span>,<\/span> countRow<\/span>(<\/span>c)<\/span>,<\/span>
\n ' \u21d2 \u69fd\u4f4d\u5f52 getOption \u81ea\u5df1\u7ba1（Global.js:374-392）：\u5012\u7740\u626b，\u649e\u4e0a\u5185\u90e8 id \u5c31\u628a\u8fd9\u4e00\u69fd\u7f6e null（:387），'<\/span>
\n +<\/span> '\u4f46\u53ea\u8981\u5b83\u540e\u9762\u5df2\u7ecf\u89c1\u8fc7\u975e\u5185\u90e8\u7ec4\u4ef6（metNonInner，:385）\u5c31\u4e0d\u7f29 realLen（:388）\u2014\u2014'<\/span>
\n +<\/span> '\u5185\u90e8\u90a3\u4e24\u6839\u6392\u5728\u672b\u5c3e\u65f6\u6574\u6bb5\u88ab\u526a\u77ed（\u2460\u2461\u2462\u6863\u8bfb\u5230 []），\u5939\u5728\u7528\u6237\u7ec4\u4ef6\u4e2d\u95f4\u65f6\u7559\u4e0b\u4e00\u4e2a null \u6d1e'<\/span>]<\/span>;<\/span>
\n }<\/span>,<\/span> function<\/span> (<\/span>chart,<\/span> reader,<\/span> arr<\/span>)<\/span> {<\/span>
\n var<\/span> err =<\/span> null<\/span>;<\/span>
\n try<\/span> {<\/span>
\n reader.<\/span>setOption<\/span>(<\/span>{<\/span> dataZoom<\/span>:<\/span> [<\/span>{<\/span> type<\/span>:<\/span> 'slider'<\/span>,<\/span> xAxisIndex<\/span>:<\/span> 0<\/span>,<\/span> start<\/span>:<\/span> 20<\/span>,<\/span> end<\/span>:<\/span> 80<\/span> }<\/span>]<\/span> }<\/span>)<\/span>;<\/span>
\n }<\/span> catch<\/span> (<\/span>e)<\/span> {<\/span> err =<\/span> e.<\/span>message;<\/span> }<\/span>
\n arr.<\/span>push<\/span>(<\/span>err ?<\/span> ' \u21d2 \u7b2c\u4e8c\u6b21 setOption \u629b\u9519：'<\/span> +<\/span> err
\n :<\/span> ' \u21d2 \u53c8 setOption \u4e00\u6839\u7528\u6237 slider（merge\u3001\u4e0d replaceMerge）：\u770b\u4e0b\u9762\u5b83\u843d\u5728\u7b2c\u51e0\u69fd\u3001\u5185\u90e8\u4e24\u6839\u53bb\u54ea'<\/span>)<\/span>;<\/span>
\n }<\/span>)<\/span>;<\/span>
\n return<\/span>;<\/span>
\n }<\/span>
\n p.<\/span>run<\/span>(<\/span>V<\/span>[<\/span>idx]<\/span>[<\/span>0<\/span>]<\/span>,<\/span> V<\/span>[<\/span>idx]<\/span>[<\/span>1<\/span>]<\/span>,<\/span> std)<\/span>;<\/span>
\n }<\/span>)<\/span>;<\/span>
\n }<\/span>)<\/span>(<\/span>i)<\/span>;<\/span>
\n }<\/span>
\n p.<\/span>run<\/span>(<\/span>V<\/span>[<\/span>0<\/span>]<\/span>[<\/span>0<\/span>]<\/span>,<\/span> V<\/span>[<\/span>0<\/span>]<\/span>[<\/span>1<\/span>]<\/span>,<\/span> std)<\/span>;<\/span>
\n}<\/span><\/p>\n

\/* ===== \u9762\u677f\u5341\u4e09：\u65f6\u95f4\u8f74\u4e0a\u7684\u7f29\u653e（\u7b2c\u5341\u4e5d\u3001\u4e8c\u5341\u8282） ===== *\/<\/span><\/p>\n

function<\/span> stockTimeOpt<\/span>(<\/span>dz,<\/span> count<\/span>)<\/span> {<\/span>
\n var<\/span> rows =<\/span> (<\/span>STOCK<\/span> ||<\/span> [<\/span>]<\/span>)<\/span>.<\/span>slice<\/span>(<\/span>0<\/span>,<\/span> count ||<\/span> STOCK<\/span>.<\/span>length)<\/span>;<\/span>
\n return<\/span> \/** @type {any} *\/<\/span>(<\/span>{<\/span>
\n animation<\/span>:<\/span> false<\/span>,<\/span>
\n xAxis<\/span>:<\/span> {<\/span> type<\/span>:<\/span> 'time'<\/span> }<\/span>,<\/span> yAxis<\/span>:<\/span> {<\/span> scale<\/span>:<\/span> true<\/span> }<\/span>,<\/span>
\n series<\/span>:<\/span> [<\/span>{<\/span>
\n type<\/span>:<\/span> 'candlestick'<\/span>,<\/span>
\n data<\/span>:<\/span> rows.<\/span>map<\/span>(<\/span>function<\/span> (<\/span>r<\/span>)<\/span> {<\/span>
\n return<\/span> [<\/span>+<\/span>new<\/span> Date<\/span>(<\/span>r.<\/span>date +<\/span> 'T00:00:00Z'<\/span>)<\/span>,<\/span> r.<\/span>open,<\/span> r.<\/span>close,<\/span> r.<\/span>lowest,<\/span> r.<\/span>highest]<\/span>;<\/span>
\n }<\/span>)<\/span>
\n }<\/span>]<\/span>,<\/span>
\n dataZoom<\/span>:<\/span> dz ||<\/span> [<\/span>]<\/span>
\n }<\/span>)<\/span>;<\/span>
\n}<\/span>
\nfunction<\/span> msRow<\/span>(<\/span>v<\/span>)<\/span> {<\/span>
\n if<\/span> (<\/span>typeof<\/span> v !==<\/span> 'number'<\/span> ||<\/span> !<\/span>isFinite<\/span>(<\/span>v)<\/span>)<\/span> return<\/span> String<\/span>(<\/span>v)<\/span>;<\/span>
\n var<\/span> d =<\/span> new<\/span> Date<\/span>(<\/span>v)<\/span>;<\/span>
\n return<\/span> v +<\/span> '（UTC '<\/span> +<\/span> d.<\/span>toISOString<\/span>(<\/span>)<\/span>.<\/span>slice<\/span>(<\/span>0<\/span>,<\/span> 10<\/span>)<\/span> +<\/span> '）'<\/span>;<\/span>
\n}<\/span>
\nfunction<\/span> initPanel13<\/span>(<\/span>)<\/span> {<\/span>
\n var<\/span> p =<\/span> makePanel<\/span>(<\/span>'p13'<\/span>)<\/span>;<\/span>
\n var<\/span> rows6 =<\/span> [<\/span>
\n [<\/span>'2023-01-01'<\/span>,<\/span> 10<\/span>]<\/span>,<\/span> [<\/span>'2023-01-02'<\/span>,<\/span> 12<\/span>]<\/span>,<\/span> [<\/span>'2023-01-03'<\/span>,<\/span> 11<\/span>]<\/span>,<\/span>
\n [<\/span>'2023-02-01'<\/span>,<\/span> 30<\/span>]<\/span>,<\/span> [<\/span>'2023-02-02'<\/span>,<\/span> 28<\/span>]<\/span>,<\/span> [<\/span>'2023-03-01'<\/span>,<\/span> 40<\/span>]<\/span>
\n ]<\/span>;<\/span>
\n function<\/span> sparseOpt<\/span>(<\/span>dz,<\/span> asCategory,<\/span> list<\/span>)<\/span> {<\/span>
\n var<\/span> rows =<\/span> list ||<\/span> rows6;<\/span>
\n var<\/span> ms =<\/span> rows.<\/span>map<\/span>(<\/span>function<\/span> (<\/span>r<\/span>)<\/span> {<\/span> return<\/span> +<\/span>new<\/span> Date<\/span>(<\/span>r[<\/span>0<\/span>]<\/span> +<\/span> 'T00:00:00Z'<\/span>)<\/span>;<\/span> }<\/span>)<\/span>;<\/span>
\n return<\/span> \/** @type {any} *\/<\/span>(<\/span>{<\/span>
\n animation<\/span>:<\/span> false<\/span>,<\/span>
\n xAxis<\/span>:<\/span> asCategory ?<\/span> {<\/span> type<\/span>:<\/span> 'category'<\/span>,<\/span> data<\/span>:<\/span> rows.<\/span>map<\/span>(<\/span>function<\/span> (<\/span>r<\/span>)<\/span> {<\/span> return<\/span> r[<\/span>0<\/span>]<\/span>;<\/span> }<\/span>)<\/span> }<\/span> :<\/span> {<\/span> type<\/span>:<\/span> 'time'<\/span> }<\/span>,<\/span>
\n yAxis<\/span>:<\/span> {<\/span>}<\/span>,<\/span>
\n series<\/span>:<\/span> [<\/span>{<\/span>
\n type<\/span>:<\/span> 'line'<\/span>,<\/span> showSymbol<\/span>:<\/span> false<\/span>,<\/span>
\n data<\/span>:<\/span> rows.<\/span>map<\/span>(<\/span>function<\/span> (<\/span>r,<\/span> i<\/span>)<\/span> {<\/span> return<\/span> asCategory ?<\/span> r[<\/span>1<\/span>]<\/span> :<\/span> [<\/span>ms[<\/span>i]<\/span>,<\/span> r[<\/span>1<\/span>]<\/span>]<\/span>;<\/span> }<\/span>)<\/span>
\n }<\/span>]<\/span>,<\/span>
\n dataZoom<\/span>:<\/span> dz ||<\/span> [<\/span>]<\/span>
\n }<\/span>)<\/span>;<\/span>
\n }<\/span>
\n \/** @type {any[][]} *\/<\/span>
\n var<\/span> V<\/span> =<\/span> [<\/span>
\n [<\/span>'\u2460 time \u8f74 + 25% ~ 75%'<\/span>,<\/span> timeOpt<\/span>(<\/span>[<\/span>slider<\/span>(<\/span>25<\/span>,<\/span> 75<\/span>)<\/span>]<\/span>)<\/span>]<\/span>,<\/span>
\n [<\/span>'\u2461 \u540c\u6570\u636e\u6362 category \u8f74（\u5bf9\u7167\u53d6\u70b9）'<\/span>,<\/span> dailyOpt<\/span>(<\/span>[<\/span>{<\/span> type<\/span>:<\/span> 'slider'<\/span>,<\/span> xAxisIndex<\/span>:<\/span> 0<\/span>,<\/span> start<\/span>:<\/span> 25<\/span>,<\/span> end<\/span>:<\/span> 75<\/span> }<\/span>]<\/span>)<\/span>]<\/span>,<\/span>
\n [<\/span>'\u2462 \u6545\u610f\u4e0d\u7b49\u8ddd：time \u8f74\u7684 x \u5217'<\/span>,<\/span> sparseOpt<\/span>(<\/span>[<\/span>{<\/span> type<\/span>:<\/span> 'slider'<\/span>,<\/span> xAxisIndex<\/span>:<\/span> 0<\/span>,<\/span> start<\/span>:<\/span> 0<\/span>,<\/span> end<\/span>:<\/span> 100<\/span> }<\/span>]<\/span>)<\/span>]<\/span>,<\/span>
\n [<\/span>'\u2463 startValue\/endValue \u5199\u6210\u65e5\u671f\u4e32'<\/span>,<\/span> timeOpt<\/span>(<\/span>[<\/span>{<\/span> type<\/span>:<\/span> 'slider'<\/span>,<\/span> xAxisIndex<\/span>:<\/span> 0<\/span>,<\/span> startValue<\/span>:<\/span> '2023-06-01'<\/span>,<\/span> endValue<\/span>:<\/span> '2024-06-01'<\/span> }<\/span>]<\/span>)<\/span>]<\/span>,<\/span>
\n [<\/span>'\u2464 \u540c\u4e00\u6863\u6539\u6210\u6beb\u79d2\u6570'<\/span>,<\/span> (<\/span>function<\/span> (<\/span>)<\/span> {<\/span>
\n var<\/span> a =<\/span> +<\/span>new<\/span> Date<\/span>(<\/span>'2023-06-01T00:00:00Z'<\/span>)<\/span>,<\/span> b =<\/span> +<\/span>new<\/span> Date<\/span>(<\/span>'2024-06-01T00:00:00Z'<\/span>)<\/span>;<\/span>
\n return<\/span> timeOpt<\/span>(<\/span>[<\/span>{<\/span> type<\/span>:<\/span> 'slider'<\/span>,<\/span> xAxisIndex<\/span>:<\/span> 0<\/span>,<\/span> startValue<\/span>:<\/span> a,<\/span> endValue<\/span>:<\/span> b }<\/span>]<\/span>)<\/span>;<\/span>
\n }<\/span>)<\/span>(<\/span>)<\/span>]<\/span>,<\/span>
\n [<\/span>'\u2465 useUTC:false vs true'<\/span>,<\/span> timeOpt<\/span>(<\/span>[<\/span>slider<\/span>(<\/span>25<\/span>,<\/span> 75<\/span>)<\/span>]<\/span>,<\/span> null<\/span>,<\/span> {<\/span> useUTC<\/span>:<\/span> false<\/span> }<\/span>)<\/span>]<\/span>,<\/span>
\n [<\/span>'\u2466 261 \u5929 K \u7ebf\u7f29\u5230 5% \u7a97\u53e3'<\/span>,<\/span> stockTimeOpt<\/span>(<\/span>[<\/span>{<\/span> type<\/span>:<\/span> 'slider'<\/span>,<\/span> xAxisIndex<\/span>:<\/span> 0<\/span>,<\/span> start<\/span>:<\/span> 5<\/span>,<\/span> end<\/span>:<\/span> 100<\/span> }<\/span>]<\/span>)<\/span>]<\/span>,<\/span>
\n [<\/span>'\u2467 minValueSpan \/ maxValueSpan \u6309\u6beb\u79d2\u5939'<\/span>,<\/span> timeOpt<\/span>(<\/span>[<\/span>{<\/span>
\n type<\/span>:<\/span> 'slider'<\/span>,<\/span> xAxisIndex<\/span>:<\/span> 0<\/span>,<\/span> start<\/span>:<\/span> 0<\/span>,<\/span> end<\/span>:<\/span> 100<\/span>,<\/span>
\n minValueSpan<\/span>:<\/span> 86400000<\/span> *<\/span> 30<\/span>
\n }<\/span>]<\/span>)<\/span>]<\/span>,<\/span>
\n [<\/span>'\u2468 \u53ea\u6709\u4e00\u5929：time \u8f74\u96f6\u8de8\u5ea6，\u5f71\u5b50\u6574\u6761 NaN'<\/span>,<\/span> sparseOpt<\/span>(<\/span>
\n [<\/span>{<\/span> type<\/span>:<\/span> 'slider'<\/span>,<\/span> xAxisIndex<\/span>:<\/span> 0<\/span>,<\/span> start<\/span>:<\/span> 0<\/span>,<\/span> end<\/span>:<\/span> 100<\/span> }<\/span>]<\/span>,<\/span> false<\/span>,<\/span> [<\/span>[<\/span>'2023-01-01'<\/span>,<\/span> 10<\/span>]<\/span>]<\/span>)<\/span>]<\/span>
\n ]<\/span>;<\/span>
\n function<\/span> std<\/span>(<\/span>svg,<\/span> c<\/span>)<\/span> {<\/span>
\n var<\/span> d =<\/span> dzInfo<\/span>(<\/span>c,<\/span> 0<\/span>)<\/span> ||<\/span> {<\/span>}<\/span>;<\/span>
\n return<\/span> [<\/span>dzRow<\/span>(<\/span>c,<\/span> 0<\/span>)<\/span>,<\/span>
\n ' \u751f\u6548\u7a97\u6362\u56de\u65e5\u671f='<\/span> +<\/span> (<\/span>d.<\/span>wv ?<\/span> msRow<\/span>(<\/span>d.<\/span>wv[<\/span>0<\/span>]<\/span>)<\/span> +<\/span> ' ~ '<\/span> +<\/span> msRow<\/span>(<\/span>d.<\/span>wv[<\/span>1<\/span>]<\/span>)<\/span> :<\/span> 'null'<\/span>)<\/span>,<\/span>
\n ' \u4f60\u5199\u7684\u56db\u952e='<\/span> +<\/span> JSON<\/span>.<\/span>stringify<\/span>(<\/span>d.<\/span>\u5199)<\/span>,<\/span>
\n backRow<\/span>(<\/span>c,<\/span> 0<\/span>)<\/span>,<\/span> axisRow<\/span>(<\/span>c,<\/span> 'x'<\/span>,<\/span> 0<\/span>)<\/span>,<\/span> shadowXRow<\/span>(<\/span>svg)<\/span>,<\/span> shadowRow<\/span>(<\/span>svg)<\/span>,<\/span> countRow<\/span>(<\/span>c)<\/span>]<\/span>;<\/span>
\n }<\/span>
\n \/\/ \u523b\u5ea6\u7684 UTC \u65f6\u523b（\u5e26\u5230\u5c0f\u65f6，\u65e5\u754c\u5dee\u51e0\u5929\u5c31\u4e00\u773c\u770b\u5f97\u89c1）<\/span>
\n function<\/span> tickUtcRow<\/span>(<\/span>c<\/span>)<\/span> {<\/span>
\n var<\/span> a =<\/span> axisInfo<\/span>(<\/span>c,<\/span> 'x'<\/span>,<\/span> 0<\/span>)<\/span>;<\/span>
\n if<\/span> (<\/span>!<\/span>a ||<\/span> !<\/span>a.<\/span>ticks)<\/span> return<\/span> ' \u523b\u5ea6\u6362 UTC \u65f6\u523b=（\u8bfb\u4e0d\u5230）'<\/span>;<\/span>
\n return<\/span> ' \u523b\u5ea6\u6362 UTC \u65f6\u523b='<\/span> +<\/span> a.<\/span>ticks.<\/span>map<\/span>(<\/span>function<\/span> (<\/span>v<\/span>)<\/span> {<\/span>
\n return<\/span> new<\/span> Date<\/span>(<\/span>v)<\/span>.<\/span>toISOString<\/span>(<\/span>)<\/span>.<\/span>slice<\/span>(<\/span>0<\/span>,<\/span> 10<\/span>)<\/span> +<\/span> 'T'<\/span> +<\/span> new<\/span> Date<\/span>(<\/span>v)<\/span>.<\/span>toISOString<\/span>(<\/span>)<\/span>.<\/span>slice<\/span>(<\/span>11<\/span>,<\/span> 13<\/span>)<\/span> +<\/span> '\u65f6'<\/span>;<\/span>
\n }<\/span>)<\/span>.<\/span>join<\/span>(<\/span>' '<\/span>)<\/span>;<\/span>
\n }<\/span>
\n function<\/span> stdUtc<\/span>(<\/span>svg,<\/span> c<\/span>)<\/span> {<\/span>
\n return<\/span> std<\/span>(<\/span>svg,<\/span> c)<\/span>.<\/span>concat<\/span>(<\/span>[<\/span>tickUtcRow<\/span>(<\/span>c)<\/span>]<\/span>)<\/span>;<\/span>
\n }<\/span>
\n for<\/span> (<\/span>var<\/span> i =<\/span> 0<\/span>;<\/span> i <<\/span> V<\/span>.<\/span>length;<\/span> i++<\/span>)<\/span> {<\/span>
\n (<\/span>function<\/span> (<\/span>idx<\/span>)<\/span> {<\/span>
\n bind<\/span>(<\/span>'b13'<\/span> +<\/span> String.<\/span>fromCharCode<\/span>(<\/span>97<\/span> +<\/span> idx)<\/span>,<\/span> function<\/span> (<\/span>)<\/span> {<\/span>
\n if<\/span> (<\/span>idx ===<\/span> 2<\/span>)<\/span> {<\/span>
\n p.<\/span>runMany<\/span>(<\/span>[<\/span>
\n {<\/span>
\n label<\/span>:<\/span> '\u2462-a time \u8f74（\u6309\u771f\u5b9e\u65f6\u95f4\u5dee\u6446）'<\/span>,<\/span> o<\/span>:<\/span> V<\/span>[<\/span>2<\/span>]<\/span>[<\/span>1<\/span>]<\/span>,<\/span>
\n build<\/span>:<\/span> function<\/span> (<\/span>svg<\/span>)<\/span> {<\/span>
\n var<\/span> xs =<\/span> shadowXs<\/span>(<\/span>svg)<\/span>,<\/span> g =<\/span> [<\/span>]<\/span>;<\/span>
\n for<\/span> (<\/span>var<\/span> k =<\/span> 1<\/span>;<\/span> k <<\/span> xs.<\/span>length;<\/span> k++<\/span>)<\/span> g.<\/span>push<\/span>(<\/span>r2<\/span>(<\/span>xs[<\/span>k]<\/span> –<\/span> xs[<\/span>k –<\/span> 1<\/span>]<\/span>)<\/span>)<\/span>;<\/span>
\n return<\/span> [<\/span>shadowXRow<\/span>(<\/span>svg)<\/span>,<\/span>
\n ' \u76f8\u90bb\u4e24\u70b9\u4e4b\u95f4\u7684 px \u95f4\u9694='<\/span> +<\/span> JSON<\/span>.<\/span>stringify<\/span>(<\/span>g)<\/span> +<\/span>
\n '（\u5f71\u5b50\u5bbd 300 \u00f7 \u5168\u8de8\u5ea6 59 \u5929 = \u4e00\u5929 5.08px；01-03\u219202-01 \u90a3\u4e00\u8df3 29 \u5929 \u21d2 147.4px）'<\/span>,<\/span>
\n ' \u21d2 time \u8f74\u6446\u70b9\u770b\u7684\u662f\u6beb\u79d2\u5dee，\u4e0d\u662f\u300c\u7b2c\u51e0\u4e2a\u70b9\u300d'<\/span>]<\/span>;<\/span>
\n }<\/span>
\n }<\/span>,<\/span>
\n {<\/span>
\n label<\/span>:<\/span> '\u2462-b category \u8f74（\u6c38\u8fdc\u7b49\u8ddd）'<\/span>,<\/span> o<\/span>:<\/span> sparseOpt<\/span>(<\/span>[<\/span>{<\/span> type<\/span>:<\/span> 'slider'<\/span>,<\/span> xAxisIndex<\/span>:<\/span> 0<\/span>,<\/span> start<\/span>:<\/span> 0<\/span>,<\/span> end<\/span>:<\/span> 100<\/span> }<\/span>]<\/span>,<\/span> true<\/span>)<\/span>,<\/span>
\n build<\/span>:<\/span> function<\/span> (<\/span>svg<\/span>)<\/span> {<\/span>
\n var<\/span> xs =<\/span> shadowXs<\/span>(<\/span>svg)<\/span>,<\/span> g =<\/span> [<\/span>]<\/span>;<\/span>
\n for<\/span> (<\/span>var<\/span> k =<\/span> 1<\/span>;<\/span> k <<\/span> xs.<\/span>length;<\/span> k++<\/span>)<\/span> g.<\/span>push<\/span>(<\/span>r2<\/span>(<\/span>xs[<\/span>k]<\/span> –<\/span> xs[<\/span>k –<\/span> 1<\/span>]<\/span>)<\/span>)<\/span>;<\/span>
\n return<\/span> [<\/span>shadowXRow<\/span>(<\/span>svg)<\/span>,<\/span>
\n ' \u76f8\u90bb\u4e24\u70b9\u4e4b\u95f4\u7684 px \u95f4\u9694='<\/span> +<\/span> JSON<\/span>.<\/span>stringify<\/span>(<\/span>g)<\/span> +<\/span> ' \u21d2 \u7c7b\u76ee\u8f74\u6b65\u957f = \u5f71\u5b50\u5bbd \u00f7 (\u6761\u6570\u22121)，\u8ddf\u65e5\u671f\u5dee\u65e0\u5173'<\/span>]<\/span>;<\/span>
\n }<\/span>
\n }<\/span>
\n ]<\/span>)<\/span>;<\/span>
\n return<\/span>;<\/span>
\n }<\/span>
\n if<\/span> (<\/span>idx ===<\/span> 4<\/span>)<\/span> {<\/span>
\n p.<\/span>run<\/span>(<\/span>V<\/span>[<\/span>idx]<\/span>[<\/span>0<\/span>]<\/span>,<\/span> V<\/span>[<\/span>idx]<\/span>[<\/span>1<\/span>]<\/span>,<\/span> function<\/span> (<\/span>svg,<\/span> c<\/span>)<\/span> {<\/span>
\n var<\/span> d =<\/span> dzInfo<\/span>(<\/span>c,<\/span> 0<\/span>)<\/span> ||<\/span> {<\/span>}<\/span>;<\/span>
\n var<\/span> utcMs =<\/span> +<\/span>new<\/span> Date<\/span>(<\/span>'2023-06-01T00:00:00Z'<\/span>)<\/span>;<\/span>
\n var<\/span> localMs =<\/span> +<\/span>new<\/span> Date<\/span>(<\/span>2023<\/span>,<\/span> 5<\/span>,<\/span> 1<\/span>)<\/span>;<\/span>
\n return<\/span> std<\/span>(<\/span>svg,<\/span> c)<\/span>.<\/span>concat<\/span>(<\/span>[<\/span>tickUtcRow<\/span>(<\/span>c)<\/span>,<\/span>
\n ' \u672c\u6863 startValue='<\/span> +<\/span> (<\/span>d.<\/span>\u5199 ?<\/span> d.<\/span>\u5199.<\/span>startValue :<\/span> '?'<\/span>)<\/span> +<\/span> '（\u81ea\u5df1 new Date("2023-06-01T00:00:00Z") \u62ff\u7684\u6beb\u79d2，\u5e26 Z \u21d2 UTC \u96f6\u70b9）；'<\/span>
\n +<\/span> '\u2463 \u6863\u628a\u540c\u4e00\u4e2a\u65e5\u671f\u5199\u6210\u4e32 \u21d2 ECharts \u7684 parseDate \u8d70\u300c\u6ca1\u6709\u65f6\u533a\u540e\u7f00\u5c31\u6309\u672c\u5730\u300d\u90a3\u6761\u5206\u652f（util\/number.js:442-446），'<\/span>
\n +<\/span> '\u843d\u51fa\u6765\u662f '<\/span> +<\/span> localMs +<\/span> '，\u4e24\u6863\u5dee '<\/span> +<\/span> (<\/span>utcMs –<\/span> localMs)<\/span> +<\/span> ' ms（\u672c\u673a\u65f6\u533a\u504f\u79fb '<\/span> +<\/span> (<\/span>–<\/span>new<\/span> Date<\/span>(<\/span>)<\/span>.<\/span>getTimezoneOffset<\/span>(<\/span>)<\/span> \/<\/span> 60<\/span>)<\/span> +<\/span> ' \u5c0f\u65f6）'<\/span>,<\/span>
\n ' \u21d2 \u6570\u5b57（rangePropMode \u91cc\u7684 value）\u4e00\u65e6\u8fdb\u4e86 proxy，\u540e\u9762\u6240\u6709\u8d26\u90fd\u6309\u8fd9\u4e2a\u6beb\u79d2\u6570\u7b97，\u4e32\u53ea\u662f\u8fdb\u95e8\u65f6\u88ab\u7ffb\u8bd1\u4e86\u4e00\u6b21'<\/span>]<\/span>)<\/span>;<\/span>
\n }<\/span>)<\/span>;<\/span>
\n return<\/span>;<\/span>
\n }<\/span>
\n if<\/span> (<\/span>idx ===<\/span> 5<\/span>)<\/span> {<\/span>
\n p.<\/span>runMany<\/span>(<\/span>[<\/span>
\n {<\/span> label<\/span>:<\/span> '\u2465-a useUTC:false（\u9ed8\u8ba4：\u6708\u754c\u6309\u672c\u673a\u65f6\u533a\u5207）'<\/span>,<\/span> o<\/span>:<\/span> timeOpt<\/span>(<\/span>[<\/span>slider<\/span>(<\/span>25<\/span>,<\/span> 75<\/span>)<\/span>]<\/span>,<\/span> null<\/span>,<\/span> {<\/span> useUTC<\/span>:<\/span> false<\/span> }<\/span>)<\/span>,<\/span> build<\/span>:<\/span> stdUtc }<\/span>,<\/span>
\n {<\/span> label<\/span>:<\/span> '\u2465-b useUTC:true（\u6708\u754c\u6309 UTC \u5207）'<\/span>,<\/span> o<\/span>:<\/span> timeOpt<\/span>(<\/span>[<\/span>slider<\/span>(<\/span>25<\/span>,<\/span> 75<\/span>)<\/span>]<\/span>,<\/span> null<\/span>,<\/span> {<\/span> useUTC<\/span>:<\/span> true<\/span> }<\/span>)<\/span>,<\/span> build<\/span>:<\/span> stdUtc }<\/span>
\n ]<\/span>)<\/span>;<\/span>
\n return<\/span>;<\/span>
\n }<\/span>
\n if<\/span> (<\/span>idx ===<\/span> 7<\/span>)<\/span> {<\/span>
\n p.<\/span>runMany<\/span>(<\/span>[<\/span>
\n {<\/span>
\n label<\/span>:<\/span> '\u2467-a minValueSpan:30 \u5929，\u7a97\u53e3\u5199 0~0.1%（\u6bd4 30 \u5929\u7a84）'<\/span>,<\/span>
\n o<\/span>:<\/span> timeOpt<\/span>(<\/span>[<\/span>{<\/span> type<\/span>:<\/span> 'slider'<\/span>,<\/span> xAxisIndex<\/span>:<\/span> 0<\/span>,<\/span> start<\/span>:<\/span> 0<\/span>,<\/span> end<\/span>:<\/span> 0.1<\/span>,<\/span> minValueSpan<\/span>:<\/span> 86400000<\/span> *<\/span> 30<\/span> }<\/span>]<\/span>)<\/span>,<\/span>
\n build<\/span>:<\/span> std
\n }<\/span>,<\/span>
\n {<\/span>
\n label<\/span>:<\/span> '\u2467-b maxValueSpan:60 \u5929，\u7a97\u53e3\u5199 0~100%（\u6bd4 60 \u5929\u5bbd）'<\/span>,<\/span>
\n o<\/span>:<\/span> timeOpt<\/span>(<\/span>[<\/span>{<\/span> type<\/span>:<\/span> 'slider'<\/span>,<\/span> xAxisIndex<\/span>:<\/span> 0<\/span>,<\/span> start<\/span>:<\/span> 0<\/span>,<\/span> end<\/span>:<\/span> 100<\/span>,<\/span> maxValueSpan<\/span>:<\/span> 86400000<\/span> *<\/span> 60<\/span> }<\/span>]<\/span>)<\/span>,<\/span>
\n build<\/span>:<\/span> std
\n }<\/span>
\n ]<\/span>)<\/span>;<\/span>
\n return<\/span>;<\/span>
\n }<\/span>
\n if<\/span> (<\/span>idx ===<\/span> 8<\/span>)<\/span> {<\/span>
\n p.<\/span>runMany<\/span>(<\/span>[<\/span>
\n {<\/span>
\n label<\/span>:<\/span> '\u2468-a time \u8f74，\u53ea\u6709 2023-01-01 \u8fd9\u4e00\u5929'<\/span>,<\/span> o<\/span>:<\/span> V<\/span>[<\/span>8<\/span>]<\/span>[<\/span>1<\/span>]<\/span>,<\/span>
\n build<\/span>:<\/span> function<\/span> (<\/span>svg<\/span>)<\/span> {<\/span>
\n return<\/span> [<\/span>nanTagRow<\/span>(<\/span>svg)<\/span>,<\/span> shadowRow<\/span>(<\/span>svg)<\/span>,<\/span>
\n ' \u5f71\u5b50 x \u7684\u95ed\u5f0f（SliderZoomView.js:286,299）：(v \u2212 x\u6700\u5c0f) \u00d7 (\u5f71\u5b50\u5bbd \u00f7 (x\u6700\u5927 \u2212 x\u6700\u5c0f))'<\/span>,<\/span>
\n ' \u21d2 \u96f6\u8de8\u5ea6 \u21d2 \u9664\u6570\u662f 0 \u21d2 \u7cfb\u6570 Infinity \u21d2 0\u00d7Infinity = NaN'<\/span>,<\/span>
\n ' \u21d2 \u70b9\u6570 1 \u00d7 (polygon + polyline) \u00d7 3 \u7ec4 = 6 \u4e2a NaN；\u6298\u7ebf\u672c\u4f53\u3001\u8f74\u3001\u624b\u67c4\u5168\u90fd\u6b63\u5e38，\u53ea\u6709\u5f71\u5b50\u574f'<\/span>,<\/span>
\n ' \u21d2 \u8865\u4e00\u62db：`showDataShadow:false` \u6216\u7ed9 x \u8f74\u5199 min\/max，\u8ba9\u5b83\u6709\u8de8\u5ea6'<\/span>]<\/span>
\n }<\/span>
\n }<\/span>,<\/span>
\n {<\/span>
\n label<\/span>:<\/span> '\u2468-b \u540c\u4e00\u4efd\u6570\u636e\u6362 category \u8f74（\u4e0b\u6807\u6709\u8de8\u5ea6）'<\/span>,<\/span>
\n o<\/span>:<\/span> sparseOpt<\/span>(<\/span>[<\/span>{<\/span> type<\/span>:<\/span> 'slider'<\/span>,<\/span> xAxisIndex<\/span>:<\/span> 0<\/span>,<\/span> start<\/span>:<\/span> 0<\/span>,<\/span> end<\/span>:<\/span> 100<\/span> }<\/span>]<\/span>,<\/span> true<\/span>,<\/span> [<\/span>[<\/span>'2023-01-01'<\/span>,<\/span> 10<\/span>]<\/span>]<\/span>)<\/span>,<\/span>
\n build<\/span>:<\/span> function<\/span> (<\/span>svg<\/span>)<\/span> {<\/span> return<\/span> [<\/span>nanTagRow<\/span>(<\/span>svg)<\/span>,<\/span> shadowRow<\/span>(<\/span>svg)<\/span>]<\/span>;<\/span> }<\/span>
\n }<\/span>
\n ]<\/span>)<\/span>;<\/span>
\n return<\/span>;<\/span>
\n }<\/span>
\n p.<\/span>run<\/span>(<\/span>V<\/span>[<\/span>idx]<\/span>[<\/span>0<\/span>]<\/span>,<\/span> V<\/span>[<\/span>idx]<\/span>[<\/span>1<\/span>]<\/span>,<\/span> std)<\/span>;<\/span>
\n }<\/span>)<\/span>;<\/span>
\n }<\/span>)<\/span>(<\/span>i)<\/span>;<\/span>
\n }<\/span>
\n p.<\/span>run<\/span>(<\/span>V<\/span>[<\/span>0<\/span>]<\/span>[<\/span>0<\/span>]<\/span>,<\/span> V<\/span>[<\/span>0<\/span>]<\/span>[<\/span>1<\/span>]<\/span>,<\/span> std)<\/span>;<\/span>
\n}<\/span><\/p>\n

\/* ===== \u9762\u677f\u5341\u56db：timeline \u53e6\u4e00\u6839\u8f74\u3001\u53e6\u4e00\u5957\u72b6\u6001（\u7b2c\u4e8c\u5341\u4e00\u8282） ===== *\/<\/span><\/p>\n

function<\/span> initPanel14<\/span>(<\/span>)<\/span> {<\/span>
\n var<\/span> p =<\/span> makePanel<\/span>(<\/span>'p14'<\/span>)<\/span>;<\/span>
\n \/** @type {any[][]} *\/<\/span>
\n var<\/span> V<\/span> =<\/span> [<\/span>
\n [<\/span>'\u2460 \u56db\u5e27（category，\u6700\u5c0f\u53ef\u8dd1）'<\/span>,<\/span> tlOpt<\/span>(<\/span>{<\/span> currentIndex<\/span>:<\/span> 1<\/span> }<\/span>,<\/span> null<\/span>,<\/span> [<\/span>'2023'<\/span>,<\/span> '2024'<\/span>,<\/span> '2025'<\/span>,<\/span> '2026'<\/span>]<\/span>)<\/span>]<\/span>,<\/span>
\n [<\/span>'\u2461 currentIndex:7（\u5e27\u53ea\u6709 3 \u4e2a）'<\/span>,<\/span> tlOpt<\/span>(<\/span>{<\/span> currentIndex<\/span>:<\/span> 7<\/span> }<\/span>)<\/span>]<\/span>,<\/span>
\n [<\/span>'\u2462 controlPosition:"none"'<\/span>,<\/span> tlOpt<\/span>(<\/span>{<\/span> controlPosition<\/span>:<\/span> 'none'<\/span> }<\/span>)<\/span>]<\/span>,<\/span>
\n [<\/span>'\u2463 controlPosition:"right"'<\/span>,<\/span> tlOpt<\/span>(<\/span>{<\/span> controlPosition<\/span>:<\/span> 'right'<\/span> }<\/span>)<\/span>]<\/span>,<\/span>
\n [<\/span>'\u2464 axisType:"value"：\u5343\u5206\u4f4d\u6bc1\u5e27\u540d \/ \u6574\u6761 NaN'<\/span>,<\/span> tlOpt<\/span>(<\/span>{<\/span> axisType<\/span>:<\/span> 'value'<\/span>,<\/span> data<\/span>:<\/span> [<\/span>'2023'<\/span>,<\/span> '2024'<\/span>,<\/span> '2025'<\/span>]<\/span> }<\/span>)<\/span>]<\/span>,<\/span>
\n [<\/span>'\u2465 axisType:"time"（\u9ed8\u8ba4）：ISO \u5e27 \/ \u4e2d\u6587\u5e27'<\/span>,<\/span> tlOpt<\/span>(<\/span>{<\/span> axisType<\/span>:<\/span> 'time'<\/span>,<\/span> data<\/span>:<\/span> [<\/span>'2023-01-01'<\/span>,<\/span> '2023-07-01'<\/span>,<\/span> '2024-01-01'<\/span>]<\/span> }<\/span>)<\/span>]<\/span>,<\/span>
\n [<\/span>'\u2466 timeline + slider \u5171\u5b58'<\/span>,<\/span> (<\/span>function<\/span> (<\/span>)<\/span> {<\/span>
\n var<\/span> o =<\/span> tlOpt<\/span>(<\/span>)<\/span>;<\/span>
\n o.<\/span>baseOption.<\/span>dataZoom =<\/span> [<\/span>{<\/span> type<\/span>:<\/span> 'slider'<\/span>,<\/span> xAxisIndex<\/span>:<\/span> 0<\/span>,<\/span> start<\/span>:<\/span> 25<\/span>,<\/span> end<\/span>:<\/span> 75<\/span> }<\/span>]<\/span>;<\/span>
\n return<\/span> o;<\/span>
\n }<\/span>)<\/span>(<\/span>)<\/span>]<\/span>,<\/span>
\n [<\/span>'\u2467 dispatchAction(timelineChange) \u4e0e\u4e8b\u4ef6\u540d'<\/span>,<\/span> tlOpt<\/span>(<\/span>)<\/span>]<\/span>,<\/span>
\n [<\/span>'\u2468 \u5207\u5e27\u4e4b\u540e\u7684\u6b8b\u7559'<\/span>,<\/span> tlOpt<\/span>(<\/span>)<\/span>]<\/span>
\n ]<\/span>;<\/span>
\n function<\/span> std<\/span>(<\/span>svg,<\/span> c<\/span>)<\/span> {<\/span>
\n return<\/span> [<\/span>timelineRow<\/span>(<\/span>c)<\/span>,<\/span> controlRow<\/span>(<\/span>svg)<\/span>,<\/span> tickLabelRow<\/span>(<\/span>svg)<\/span>,<\/span>
\n ' \u843d\u76d8 path='<\/span> +<\/span> countTag<\/span>(<\/span>svg,<\/span> 'path'<\/span>)<\/span> +<\/span> ' circle='<\/span> +<\/span> countTag<\/span>(<\/span>svg,<\/span> 'circle'<\/span>)<\/span> +<\/span> ' text='<\/span> +<\/span> countTag<\/span>(<\/span>svg,<\/span> 'text'<\/span>)<\/span> +<\/span>
\n ' \u5b57\u8282='<\/span> +<\/span> svg.<\/span>length +<\/span> ' NaN='<\/span> +<\/span> (<\/span>(<\/span>svg.<\/span>match<\/span>(<\/span>\/<\/span>NaN<\/span>\/<\/span>g<\/span><\/span>)<\/span> ||<\/span> [<\/span>]<\/span>)<\/span>.<\/span>length)<\/span>,<\/span>
\n nanTagRow<\/span>(<\/span>svg)<\/span>,<\/span>
\n ' \u7cfb\u5217='<\/span> +<\/span> JSON<\/span>.<\/span>stringify<\/span>(<\/span>(<\/span>function<\/span> (<\/span>)<\/span> {<\/span>
\n try<\/span> {<\/span> return<\/span> (<\/span>c.<\/span>getOption<\/span>(<\/span>)<\/span>.<\/span>series ||<\/span> [<\/span>]<\/span>)<\/span>.<\/span>map<\/span>(<\/span>function<\/span> (<\/span>s<\/span>)<\/span> {<\/span> return<\/span> s.<\/span>type +<\/span> ':'<\/span> +<\/span> (<\/span>s.<\/span>data ||<\/span> [<\/span>]<\/span>)<\/span>.<\/span>length;<\/span> }<\/span>)<\/span>;<\/span> }<\/span>
\n catch<\/span> (<\/span>e)<\/span> {<\/span> return<\/span> '\u8bfb\u4e0d\u5230'<\/span>;<\/span> }<\/span>
\n }<\/span>)<\/span>(<\/span>)<\/span>)<\/span>]<\/span>;<\/span>
\n }<\/span>
\n for<\/span> (<\/span>var<\/span> i =<\/span> 0<\/span>;<\/span> i <<\/span> V<\/span>.<\/span>length;<\/span> i++<\/span>)<\/span> {<\/span>
\n (<\/span>function<\/span> (<\/span>idx<\/span>)<\/span> {<\/span>
\n bind<\/span>(<\/span>'b14'<\/span> +<\/span> String.<\/span>fromCharCode<\/span>(<\/span>97<\/span> +<\/span> idx)<\/span>,<\/span> function<\/span> (<\/span>)<\/span> {<\/span>
\n if<\/span> (<\/span>idx ===<\/span> 7<\/span>)<\/span> {<\/span>
\n var<\/span> S<\/span> =<\/span> {<\/span> got<\/span>:<\/span> {<\/span>}<\/span>,<\/span> eType<\/span>:<\/span> '\u2014'<\/span>,<\/span> eIdx<\/span>:<\/span> '\u2014'<\/span> }<\/span>;<\/span>
\n p.<\/span>runMany<\/span>(<\/span>[<\/span>
\n {<\/span>
\n label<\/span>:<\/span> '\u2467-a \u56db\u4e2a\u540d\u5b57\u4e00\u8d77\u6302，\u53d1\u4e00\u6b21 type:"timelineChange"'<\/span>,<\/span>
\n o<\/span>:<\/span> tlOpt<\/span>(<\/span>)<\/span>,<\/span> build<\/span>:<\/span> std,<\/span>
\n act<\/span>:<\/span> function<\/span> (<\/span>chart,<\/span> reader,<\/span> arr<\/span>)<\/span> {<\/span>
\n var<\/span> names =<\/span> [<\/span>'timelineChange'<\/span>,<\/span> 'timelineChanged'<\/span>,<\/span> 'timelinechanged'<\/span>,<\/span> 'TimelineChanged'<\/span>]<\/span>;<\/span>
\n S<\/span>.<\/span>got =<\/span> {<\/span>}<\/span>;<\/span> S<\/span>.<\/span>eType =<\/span> '\u2014'<\/span>;<\/span> S<\/span>.<\/span>eIdx =<\/span> '\u2014'<\/span>;<\/span>
\n for<\/span> (<\/span>var<\/span> k =<\/span> 0<\/span>;<\/span> k <<\/span> names.<\/span>length;<\/span> k++<\/span>)<\/span> {<\/span>
\n (<\/span>function<\/span> (<\/span>nm<\/span>)<\/span> {<\/span>
\n S<\/span>.<\/span>got[<\/span>nm]<\/span> =<\/span> 0<\/span>;<\/span>
\n try<\/span> {<\/span>
\n reader.<\/span>on<\/span>(<\/span>nm,<\/span> function<\/span> (<\/span>e<\/span>)<\/span> {<\/span> S<\/span>.<\/span>got[<\/span>nm]<\/span>++<\/span>;<\/span> S<\/span>.<\/span>eType =<\/span> e &&<\/span> e.<\/span>type;<\/span> S<\/span>.<\/span>eIdx =<\/span> e &&<\/span> e.<\/span>currentIndex;<\/span> }<\/span>)<\/span>;<\/span>
\n }<\/span> catch<\/span> (<\/span>err)<\/span> {<\/span> }<\/span>
\n }<\/span>)<\/span>(<\/span>names[<\/span>k]<\/span>)<\/span>;<\/span>
\n }<\/span>
\n try<\/span> {<\/span> reader.<\/span>dispatchAction<\/span>(<\/span>{<\/span> type<\/span>:<\/span> 'timelineChange'<\/span>,<\/span> currentIndex<\/span>:<\/span> 1<\/span> }<\/span>)<\/span>;<\/span> }<\/span>
\n catch<\/span> (<\/span>err2)<\/span> {<\/span> arr.<\/span>push<\/span>(<\/span>' \u21d2 \u52a8\u4f5c\u629b\u9519：'<\/span> +<\/span> err2.<\/span>message)<\/span>;<\/span> }<\/span>
\n for<\/span> (<\/span>var<\/span> k2 =<\/span> 0<\/span>;<\/span> k2 <<\/span> names.<\/span>length;<\/span> k2++<\/span>)<\/span> {<\/span> try<\/span> {<\/span> reader.<\/span>off<\/span>(<\/span>names[<\/span>k2]<\/span>)<\/span>;<\/span> }<\/span> catch<\/span> (<\/span>err3)<\/span> {<\/span> }<\/span> }<\/span>
\n try<\/span> {<\/span> chart.<\/span>dispatchAction<\/span>(<\/span>{<\/span> type<\/span>:<\/span> 'timelineChange'<\/span>,<\/span> currentIndex<\/span>:<\/span> 1<\/span> }<\/span>)<\/span>;<\/span> }<\/span> catch<\/span> (<\/span>err4)<\/span> {<\/span> }<\/span>
\n }<\/span>,<\/span>
\n after<\/span>:<\/span> function<\/span> (<\/span>svg,<\/span> c<\/span>)<\/span> {<\/span>
\n return<\/span> [<\/span>' \u4e8b\u4ef6\u547d\u4e2d='<\/span> +<\/span> JSON<\/span>.<\/span>stringify<\/span>(<\/span>S<\/span>.<\/span>got)<\/span> +<\/span> ' \u56de\u8c03\u91cc e.type='<\/span> +<\/span> JSON<\/span>.<\/span>stringify<\/span>(<\/span>S<\/span>.<\/span>eType)<\/span> +<\/span>
\n ' e.currentIndex='<\/span> +<\/span> JSON<\/span>.<\/span>stringify<\/span>(<\/span>S<\/span>.<\/span>eIdx)<\/span>,<\/span>
\n ' \u21d2 chart.on \u7684\u540d\u5b57\u5927\u5c0f\u5199\u4e0d\u654f\u611f（\u6302\u4e0a\u53bb\u4e4b\u524d\u5148 toLowerCase：echarts.js:245-248），'<\/span>
\n +<\/span> '\u4f46\u8ba4\u7684\u662f timelineChanged \u8fd9\u4e2a\u8bcd；timelineChange \u662f\u52a8\u4f5c\u7684 type\u3001\u4e0d\u662f\u4e8b\u4ef6\u540d，\u547d\u4e2d\u6052 0'<\/span>,<\/span>
\n ' \u21d2 \u56de\u8c03\u91cc e.type \u662f\u5168\u5c0f\u5199 "timelinechanged"：\u4e8b\u4ef6\u540d\u5728 timelineAction.js:48 \u6ce8\u518c\u6210 timelineChanged，'<\/span>
\n +<\/span> '\u6d3e\u53d1\u524d\u8fc7 createEventType \u7684 toLowerCase（echarts.js:2288-2292）'<\/span>,<\/span>
\n timelineRow<\/span>(<\/span>c)<\/span>]<\/span>;<\/span>
\n }<\/span>
\n }<\/span>,<\/span>
\n {<\/span>
\n label<\/span>:<\/span> '\u2467-b \u628a type \u5199\u6210\u5c0f\u5199 timelinechange'<\/span>,<\/span>
\n o<\/span>:<\/span> tlOpt<\/span>(<\/span>)<\/span>,<\/span> build<\/span>:<\/span> std,<\/span>
\n act<\/span>:<\/span> function<\/span> (<\/span>chart,<\/span> reader,<\/span> arr<\/span>)<\/span> {<\/span>
\n var<\/span> hits =<\/span> 0<\/span>;<\/span>
\n try<\/span> {<\/span> reader.<\/span>on<\/span>(<\/span>'timelineChanged'<\/span>,<\/span> function<\/span> (<\/span>)<\/span> {<\/span> hits++<\/span>;<\/span> }<\/span>)<\/span>;<\/span> }<\/span> catch<\/span> (<\/span>e0)<\/span> {<\/span> }<\/span>
\n try<\/span> {<\/span> reader.<\/span>dispatchAction<\/span>(<\/span>{<\/span> type<\/span>:<\/span> 'timelinechange'<\/span>,<\/span> currentIndex<\/span>:<\/span> 2<\/span> }<\/span>)<\/span>;<\/span> }<\/span>
\n catch<\/span> (<\/span>e1)<\/span> {<\/span> arr.<\/span>push<\/span>(<\/span>' \u21d2 dispatchAction \u5f53\u573a\u629b：'<\/span> +<\/span> e1.<\/span>message)<\/span>;<\/span> }<\/span>
\n try<\/span> {<\/span> chart.<\/span>dispatchAction<\/span>(<\/span>{<\/span> type<\/span>:<\/span> 'timelinechange'<\/span>,<\/span> currentIndex<\/span>:<\/span> 2<\/span> }<\/span>)<\/span>;<\/span> }<\/span> catch<\/span> (<\/span>e2)<\/span> {<\/span> }<\/span>
\n arr.<\/span>push<\/span>(<\/span>' \u5c0f\u5199 type \u8fd9\u4e00\u6b21：\u4e8b\u4ef6\u547d\u4e2d='<\/span> +<\/span> hits +<\/span> '（dispatchAction \u7684 type \u67e5\u8868\u4e0d lowerCase \u21d2 \u5927\u5c0f\u5199\u654f\u611f）'<\/span>)<\/span>;<\/span>
\n try<\/span> {<\/span> reader.<\/span>off<\/span>(<\/span>'timelineChanged'<\/span>)<\/span>;<\/span> }<\/span> catch<\/span> (<\/span>e3)<\/span> {<\/span> }<\/span>
\n }<\/span>,<\/span>
\n after<\/span>:<\/span> function<\/span> (<\/span>svg,<\/span> c<\/span>)<\/span> {<\/span> return<\/span> [<\/span>timelineRow<\/span>(<\/span>c)<\/span>]<\/span>;<\/span> }<\/span>
\n }<\/span>,<\/span>
\n {<\/span>
\n label<\/span>:<\/span> '\u2467-c \u5e27\u53ea\u6709 3 \u4e2a，\u7528\u52a8\u4f5c\u63a8 currentIndex:7（loop:true）'<\/span>,<\/span>
\n o<\/span>:<\/span> tlOpt<\/span>(<\/span>)<\/span>,<\/span> build<\/span>:<\/span> std,<\/span>
\n act<\/span>:<\/span> function<\/span> (<\/span>chart,<\/span> reader,<\/span> arr<\/span>)<\/span> {<\/span>
\n try<\/span> {<\/span> reader.<\/span>dispatchAction<\/span>(<\/span>{<\/span> type<\/span>:<\/span> 'timelineChange'<\/span>,<\/span> currentIndex<\/span>:<\/span> 7<\/span> }<\/span>)<\/span>;<\/span> }<\/span> catch<\/span> (<\/span>e)<\/span> {<\/span> arr.<\/span>push<\/span>(<\/span>' \u21d2 '<\/span> +<\/span> e.<\/span>message)<\/span>;<\/span> }<\/span>
\n try<\/span> {<\/span> chart.<\/span>dispatchAction<\/span>(<\/span>{<\/span> type<\/span>:<\/span> 'timelineChange'<\/span>,<\/span> currentIndex<\/span>:<\/span> 7<\/span> }<\/span>)<\/span>;<\/span> }<\/span> catch<\/span> (<\/span>e2)<\/span> {<\/span> }<\/span>
\n arr.<\/span>push<\/span>(<\/span>' \u21d2 \u540c\u4e00\u4e2a 7：\u5199\u8fdb option \u4e0d\u5939（\u2461 \u90a3\u4e00\u6863\u7559\u7740 7\u3001\u68c0\u67e5\u70b9\u98de\u6210 NaN），\u8d70\u52a8\u4f5c\u8981\u8fc7 setCurrentIndex \u21d2 loop:true \u65f6 7%3=1'<\/span>)<\/span>;<\/span>
\n }<\/span>,<\/span>
\n after<\/span>:<\/span> function<\/span> (<\/span>svg,<\/span> c<\/span>)<\/span> {<\/span> return<\/span> [<\/span>timelineRow<\/span>(<\/span>c)<\/span>,<\/span> ' （\u5939\u4e0e\u53d6\u6a21\u53d1\u751f\u5728 TimelineModel.js:76-83，getCurrentIndex \u53ea\u662f\u539f\u6837\u8bfb option.currentIndex）'<\/span>]<\/span>;<\/span> }<\/span>
\n }<\/span>,<\/span>
\n {<\/span>
\n label<\/span>:<\/span> '\u2467-d \u540c\u4e0a，loop:false'<\/span>,<\/span>
\n o<\/span>:<\/span> tlOpt<\/span>(<\/span>{<\/span> loop<\/span>:<\/span> false<\/span> }<\/span>)<\/span>,<\/span> build<\/span>:<\/span> std,<\/span>
\n act<\/span>:<\/span> function<\/span> (<\/span>chart,<\/span> reader,<\/span> arr<\/span>)<\/span> {<\/span>
\n try<\/span> {<\/span> reader.<\/span>dispatchAction<\/span>(<\/span>{<\/span> type<\/span>:<\/span> 'timelineChange'<\/span>,<\/span> currentIndex<\/span>:<\/span> 7<\/span> }<\/span>)<\/span>;<\/span> }<\/span> catch<\/span> (<\/span>e)<\/span> {<\/span> arr.<\/span>push<\/span>(<\/span>' \u21d2 '<\/span> +<\/span> e.<\/span>message)<\/span>;<\/span> }<\/span>
\n try<\/span> {<\/span> chart.<\/span>dispatchAction<\/span>(<\/span>{<\/span> type<\/span>:<\/span> 'timelineChange'<\/span>,<\/span> currentIndex<\/span>:<\/span> 7<\/span> }<\/span>)<\/span>;<\/span> }<\/span> catch<\/span> (<\/span>e2)<\/span> {<\/span> }<\/span>
\n arr.<\/span>push<\/span>(<\/span>' \u21d2 loop:false \u21d2 \u5939\u5230 count-1 = 2'<\/span>)<\/span>;<\/span>
\n }<\/span>,<\/span>
\n after<\/span>:<\/span> function<\/span> (<\/span>svg,<\/span> c<\/span>)<\/span> {<\/span> return<\/span> [<\/span>timelineRow<\/span>(<\/span>c)<\/span>]<\/span>;<\/span> }<\/span>
\n }<\/span>
\n ]<\/span>)<\/span>;<\/span>
\n return<\/span>;<\/span>
\n }<\/span>
\n if<\/span> (<\/span>idx ===<\/span> 8<\/span>)<\/span> {<\/span>
\n function<\/span> ser<\/span>(<\/span>inst<\/span>)<\/span> {<\/span>
\n try<\/span> {<\/span> return<\/span> (<\/span>inst.<\/span>getOption<\/span>(<\/span>)<\/span>.<\/span>series ||<\/span> [<\/span>]<\/span>)<\/span>.<\/span>map<\/span>(<\/span>function<\/span> (<\/span>s<\/span>)<\/span> {<\/span> return<\/span> (<\/span>s.<\/span>data ||<\/span> [<\/span>]<\/span>)<\/span>.<\/span>slice<\/span>(<\/span>0<\/span>,<\/span> 4<\/span>)<\/span>;<\/span> }<\/span>)<\/span>;<\/span> }<\/span>
\n catch<\/span> (<\/span>e)<\/span> {<\/span> return<\/span> '\u8bfb\u4e0d\u5230'<\/span>;<\/span> }<\/span>
\n }<\/span>
\n function<\/span> skel<\/span>(<\/span>inst<\/span>)<\/span> {<\/span>
\n try<\/span> {<\/span>
\n return<\/span> 'xAxis[0].data \u957f\u5ea6='<\/span> +<\/span> (<\/span>(<\/span>inst.<\/span>getOption<\/span>(<\/span>)<\/span>.<\/span>xAxis[<\/span>0<\/span>]<\/span> ||<\/span> {<\/span>}<\/span>)<\/span>.<\/span>data ||<\/span> [<\/span>]<\/span>)<\/span>.<\/span>length +<\/span>
\n ' \u7cfb\u5217\u6570='<\/span> +<\/span> (<\/span>inst.<\/span>getOption<\/span>(<\/span>)<\/span>.<\/span>series ||<\/span> [<\/span>]<\/span>)<\/span>.<\/span>length;<\/span>
\n }<\/span> catch<\/span> (<\/span>e)<\/span> {<\/span> return<\/span> '\u8bfb\u4e0d\u5230'<\/span>;<\/span> }<\/span>
\n }<\/span>
\n p.<\/span>runMany<\/span>(<\/span>[<\/span>{<\/span>
\n label<\/span>:<\/span> V<\/span>[<\/span>idx]<\/span>[<\/span>0<\/span>]<\/span>,<\/span> o<\/span>:<\/span> V<\/span>[<\/span>idx]<\/span>[<\/span>1<\/span>]<\/span>,<\/span> build<\/span>:<\/span> std,<\/span>
\n act<\/span>:<\/span> function<\/span> (<\/span>chart,<\/span> reader,<\/span> arr<\/span>)<\/span> {<\/span>
\n arr.<\/span>push<\/span>(<\/span>' \u5207\u5e27\u524d\u7cfb\u5217='<\/span> +<\/span> JSON<\/span>.<\/span>stringify<\/span>(<\/span>ser<\/span>(<\/span>reader)<\/span>)<\/span> +<\/span> ' '<\/span> +<\/span> skel<\/span>(<\/span>reader)<\/span>)<\/span>;<\/span>
\n try<\/span> {<\/span> reader.<\/span>dispatchAction<\/span>(<\/span>{<\/span> type<\/span>:<\/span> 'timelineChange'<\/span>,<\/span> currentIndex<\/span>:<\/span> 1<\/span> }<\/span>)<\/span>;<\/span> }<\/span> catch<\/span> (<\/span>e)<\/span> {<\/span> arr.<\/span>push<\/span>(<\/span>' \u21d2 '<\/span> +<\/span> e.<\/span>message)<\/span>;<\/span> }<\/span>
\n try<\/span> {<\/span> chart.<\/span>dispatchAction<\/span>(<\/span>{<\/span> type<\/span>:<\/span> 'timelineChange'<\/span>,<\/span> currentIndex<\/span>:<\/span> 1<\/span> }<\/span>)<\/span>;<\/span> }<\/span> catch<\/span> (<\/span>e0)<\/span> {<\/span> }<\/span>
\n arr.<\/span>push<\/span>(<\/span>' \u5207\u5e27\u540e\u7cfb\u5217='<\/span> +<\/span> JSON<\/span>.<\/span>stringify<\/span>(<\/span>ser<\/span>(<\/span>reader)<\/span>)<\/span> +<\/span> ' '<\/span> +<\/span> skel<\/span>(<\/span>reader)<\/span>)<\/span>;<\/span>
\n try<\/span> {<\/span> reader.<\/span>dispatchAction<\/span>(<\/span>{<\/span> type<\/span>:<\/span> 'timelineChange'<\/span>,<\/span> currentIndex<\/span>:<\/span> 2<\/span> }<\/span>)<\/span>;<\/span> }<\/span> catch<\/span> (<\/span>e2)<\/span> {<\/span> }<\/span>
\n try<\/span> {<\/span> chart.<\/span>dispatchAction<\/span>(<\/span>{<\/span> type<\/span>:<\/span> 'timelineChange'<\/span>,<\/span> currentIndex<\/span>:<\/span> 2<\/span> }<\/span>)<\/span>;<\/span> }<\/span> catch<\/span> (<\/span>e3)<\/span> {<\/span> }<\/span>
\n arr.<\/span>push<\/span>(<\/span>' \u518d\u5207\u4e00\u5e27='<\/span> +<\/span> JSON<\/span>.<\/span>stringify<\/span>(<\/span>ser<\/span>(<\/span>reader)<\/span>)<\/span> +<\/span> ' '<\/span> +<\/span> skel<\/span>(<\/span>reader)<\/span>)<\/span>;<\/span>
\n }<\/span>,<\/span>
\n after<\/span>:<\/span> function<\/span> (<\/span>svg,<\/span> c<\/span>)<\/span> {<\/span>
\n return<\/span> [<\/span>timelineRow<\/span>(<\/span>c)<\/span>,<\/span>
\n ' \u21d2 \u5e27\u662f**\u589e\u91cf\u5408\u5e76**\u7684：\u4e09\u5e27\u5404\u53ea\u5199 series.data，\u8f74\u4e0e\u9aa8\u67b6\u9010\u6863\u4e0d\u53d8（\u63a2\u9488 D9a\/D11a：\u5199 name \u7684\u5e27\u6539\u6389\u4e86\u540d，'<\/span>
\n +<\/span> '\u7a7a\u5bf9\u8c61\u5e27\u4ec0\u4e48\u90fd\u4e0d\u6539；\u8981\u9760 replaceMerge \u624d\u5207\u5f97\u52a8\u7cfb\u5217\u6570）'<\/span>]<\/span>;<\/span>
\n }<\/span>
\n }<\/span>]<\/span>)<\/span>;<\/span>
\n return<\/span>;<\/span>
\n }<\/span>
\n if<\/span> (<\/span>idx ===<\/span> 4<\/span>)<\/span> {<\/span>
\n p.<\/span>runMany<\/span>(<\/span>[<\/span>
\n {<\/span>
\n label<\/span>:<\/span> '\u2464-a axisType:"value" + \u7eaf\u5e74\u4e32（\u4e0d\u629b\u9519，\u4f46\u88ab\u5343\u5206\u4f4d\u6bc1\u4e86）'<\/span>,<\/span>
\n o<\/span>:<\/span> tlOpt<\/span>(<\/span>{<\/span> axisType<\/span>:<\/span> 'value'<\/span>,<\/span> data<\/span>:<\/span> [<\/span>'2023'<\/span>,<\/span> '2024'<\/span>,<\/span> '2025'<\/span>]<\/span> }<\/span>)<\/span>,<\/span> build<\/span>:<\/span> std
\n }<\/span>,<\/span>
\n {<\/span>
\n label<\/span>:<\/span> '\u2464-b axisType:"value" + ISO \u4e32（\u5e27\u540d\u8bfb\u6210 null \u21d2 \u6574\u6761 NaN）'<\/span>,<\/span>
\n o<\/span>:<\/span> tlOpt<\/span>(<\/span>{<\/span> axisType<\/span>:<\/span> 'value'<\/span>,<\/span> data<\/span>:<\/span> [<\/span>'2023-01-01'<\/span>,<\/span> '2023-07-01'<\/span>,<\/span> '2024-01-01'<\/span>]<\/span> }<\/span>)<\/span>,<\/span> build<\/span>:<\/span> std
\n }<\/span>
\n ]<\/span>)<\/span>;<\/span>
\n return<\/span>;<\/span>
\n }<\/span>
\n if<\/span> (<\/span>idx ===<\/span> 5<\/span>)<\/span> {<\/span>
\n p.<\/span>runMany<\/span>(<\/span>[<\/span>
\n {<\/span>
\n label<\/span>:<\/span> '\u2465-a axisType:"time"（\u9ed8\u8ba4）+ ISO \u4e32（\u6807\u7b7e\u88ab\u523b\u5ea6\u683c\u5f0f\u5316\u63a5\u7ba1）'<\/span>,<\/span>
\n o<\/span>:<\/span> tlOpt<\/span>(<\/span>{<\/span> axisType<\/span>:<\/span> 'time'<\/span>,<\/span> data<\/span>:<\/span> [<\/span>'2023-01-01'<\/span>,<\/span> '2023-07-01'<\/span>,<\/span> '2024-01-01'<\/span>]<\/span> }<\/span>)<\/span>,<\/span> build<\/span>:<\/span> std
\n }<\/span>,<\/span>
\n {<\/span>
\n label<\/span>:<\/span> '\u2465-b \u538b\u6839\u4e0d\u5199 axisType（\u5e93\u8865\u9ed8\u8ba4\u503c time）+ \u4e2d\u6587\u5e27\u540d'<\/span>,<\/span>
\n o<\/span>:<\/span> (<\/span>function<\/span> (<\/span>)<\/span> {<\/span> var<\/span> oo =<\/span> tlOpt<\/span>(<\/span>{<\/span> data<\/span>:<\/span> [<\/span>'\u7532'<\/span>,<\/span> '\u4e59'<\/span>,<\/span> '\u4e19'<\/span>]<\/span> }<\/span>)<\/span>;<\/span> delete<\/span> oo.<\/span>timeline.<\/span>axisType;<\/span> return<\/span> oo;<\/span> }<\/span>)<\/span>(<\/span>)<\/span>,<\/span>
\n build<\/span>:<\/span> std
\n }<\/span>
\n ]<\/span>)<\/span>;<\/span>
\n return<\/span>;<\/span>
\n }<\/span>
\n p.<\/span>run<\/span>(<\/span>V<\/span>[<\/span>idx]<\/span>[<\/span>0<\/span>]<\/span>,<\/span> V<\/span>[<\/span>idx]<\/span>[<\/span>1<\/span>]<\/span>,<\/span> std)<\/span>;<\/span>
\n }<\/span>)<\/span>;<\/span>
\n }<\/span>)<\/span>(<\/span>i)<\/span>;<\/span>
\n }<\/span>
\n p.<\/span>run<\/span>(<\/span>V<\/span>[<\/span>0<\/span>]<\/span>[<\/span>0<\/span>]<\/span>,<\/span> V<\/span>[<\/span>0<\/span>]<\/span>[<\/span>1<\/span>]<\/span>,<\/span> std)<\/span>;<\/span>
\n}<\/span><\/p>\n

\/* ===== \u9762\u677f\u5341\u4e94：\u4e09\u5e74\u65e5\u7ebf\u770b\u677f（\u7b2c\u4e8c\u5341\u4e8c\u8282，\u6536\u53e3\u6863，800\u00d7360） ===== *\/<\/span><\/p>\n

function<\/span> quarterAgg<\/span>(<\/span>)<\/span> {<\/span>
\n var<\/span> map =<\/span> {<\/span>}<\/span>,<\/span> order =<\/span> [<\/span>]<\/span>;<\/span>
\n for<\/span> (<\/span>var<\/span> i =<\/span> 0<\/span>;<\/span> i <<\/span> DAILY<\/span>.<\/span>length;<\/span> i++<\/span>)<\/span> {<\/span>
\n var<\/span> y =<\/span> DAILY<\/span>[<\/span>i]<\/span>.<\/span>date.<\/span>slice<\/span>(<\/span>0<\/span>,<\/span> 4<\/span>)<\/span>,<\/span> q =<\/span> Math.<\/span>floor<\/span>(<\/span>(<\/span>+<\/span>DAILY<\/span>[<\/span>i]<\/span>.<\/span>date.<\/span>slice<\/span>(<\/span>5<\/span>,<\/span> 7<\/span>)<\/span> –<\/span> 1<\/span>)<\/span> \/<\/span> 3<\/span>)<\/span> +<\/span> 1<\/span>;<\/span>
\n var<\/span> k =<\/span> y +<\/span> 'Q'<\/span> +<\/span> q;<\/span>
\n if<\/span> (<\/span>map[<\/span>k]<\/span> ==<\/span> null<\/span>)<\/span> {<\/span> map[<\/span>k]<\/span> =<\/span> 0<\/span>;<\/span> order.<\/span>push<\/span>(<\/span>k)<\/span>;<\/span> }<\/span>
\n map[<\/span>k]<\/span> +=<\/span> DAILY<\/span>[<\/span>i]<\/span>.<\/span>sales;<\/span>
\n }<\/span>
\n return<\/span> {<\/span> names<\/span>:<\/span> order,<\/span> sums<\/span>:<\/span> order.<\/span>map<\/span>(<\/span>function<\/span> (<\/span>k<\/span>)<\/span> {<\/span> return<\/span> Math.<\/span>round<\/span>(<\/span>map[<\/span>k]<\/span> *<\/span> 100<\/span>)<\/span> \/<\/span> 100<\/span>;<\/span> }<\/span>)<\/span> }<\/span>;<\/span>
\n}<\/span>
\nfunction<\/span> dashBoardOpt<\/span>(<\/span>which<\/span>)<\/span> {<\/span>
\n var<\/span> dates =<\/span> DAILY<\/span>.<\/span>map<\/span>(<\/span>function<\/span> (<\/span>r<\/span>)<\/span> {<\/span> return<\/span> r.<\/span>date;<\/span> }<\/span>)<\/span>;<\/span>
\n var<\/span> sales =<\/span> DAILY<\/span>.<\/span>map<\/span>(<\/span>function<\/span> (<\/span>r<\/span>)<\/span> {<\/span> return<\/span> r.<\/span>sales;<\/span> }<\/span>)<\/span>;<\/span>
\n var<\/span> qa =<\/span> quarterAgg<\/span>(<\/span>)<\/span>;<\/span>
\n var<\/span> base =<\/span> {<\/span>
\n animation<\/span>:<\/span> false<\/span>,<\/span>
\n title<\/span>:<\/span> {<\/span> text<\/span>:<\/span> '\u4e09\u5e74\u65e5\u9500\u770b\u677f'<\/span>,<\/span> left<\/span>:<\/span> 12<\/span>,<\/span> top<\/span>:<\/span> 6<\/span> }<\/span>,<\/span>
\n grid<\/span>:<\/span> {<\/span> left<\/span>:<\/span> 70<\/span>,<\/span> right<\/span>:<\/span> 30<\/span>,<\/span> top<\/span>:<\/span> 40<\/span>,<\/span> height<\/span>:<\/span> 150<\/span> }<\/span>,<\/span>
\n xAxis<\/span>:<\/span> {<\/span> type<\/span>:<\/span> 'category'<\/span>,<\/span> data<\/span>:<\/span> dates }<\/span>,<\/span>
\n yAxis<\/span>:<\/span> [<\/span>{<\/span> type<\/span>:<\/span> 'value'<\/span>,<\/span> name<\/span>:<\/span> '\u9500\u552e\u989d'<\/span> }<\/span>]<\/span>,<\/span>
\n series<\/span>:<\/span> [<\/span>{<\/span> type<\/span>:<\/span> 'line'<\/span>,<\/span> data<\/span>:<\/span> sales,<\/span> showSymbol<\/span>:<\/span> false<\/span> }<\/span>]<\/span>,<\/span>
\n dataZoom<\/span>:<\/span> [<\/span>]<\/span>
\n }<\/span>;<\/span>
\n if<\/span> (<\/span>which ===<\/span> 0<\/span>)<\/span> {<\/span>
\n base.<\/span>dataZoom =<\/span> [<\/span>
\n {<\/span> type<\/span>:<\/span> 'slider'<\/span>,<\/span> xAxisIndex<\/span>:<\/span> 0<\/span>,<\/span> start<\/span>:<\/span> 60<\/span>,<\/span> end<\/span>:<\/span> 100<\/span>,<\/span> height<\/span>:<\/span> 24<\/span>,<\/span> bottom<\/span>:<\/span> 8<\/span> }<\/span>,<\/span>
\n {<\/span> type<\/span>:<\/span> 'slider'<\/span>,<\/span> yAxisIndex<\/span>:<\/span> 0<\/span>,<\/span> orient<\/span>:<\/span> 'vertical'<\/span>,<\/span> start<\/span>:<\/span> 0<\/span>,<\/span> end<\/span>:<\/span> 100<\/span>,<\/span> right<\/span>:<\/span> 8<\/span>,<\/span> top<\/span>:<\/span> 40<\/span>,<\/span> height<\/span>:<\/span> 150<\/span> }<\/span>
\n ]<\/span>;<\/span>
\n }<\/span> else<\/span> if<\/span> (<\/span>which ===<\/span> 2<\/span>)<\/span> {<\/span>
\n base.<\/span>dataZoom =<\/span> [<\/span>{<\/span> type<\/span>:<\/span> 'inside'<\/span>,<\/span> xAxisIndex<\/span>:<\/span> 0<\/span>,<\/span> start<\/span>:<\/span> 60<\/span>,<\/span> end<\/span>:<\/span> 100<\/span>,<\/span> filterMode<\/span>:<\/span> 'none'<\/span> }<\/span>,<\/span>
\n {<\/span> type<\/span>:<\/span> 'slider'<\/span>,<\/span> xAxisIndex<\/span>:<\/span> 0<\/span>,<\/span> start<\/span>:<\/span> 60<\/span>,<\/span> end<\/span>:<\/span> 100<\/span>,<\/span> height<\/span>:<\/span> 24<\/span>,<\/span> bottom<\/span>:<\/span> 8<\/span> }<\/span>]<\/span>;<\/span>
\n }<\/span> else<\/span> if<\/span> (<\/span>which ===<\/span> 3<\/span>)<\/span> {<\/span>
\n base.<\/span>toolbox =<\/span> {<\/span> feature<\/span>:<\/span> {<\/span> dataZoom<\/span>:<\/span> {<\/span> yAxisIndex<\/span>:<\/span> 'none'<\/span> }<\/span>,<\/span> restore<\/span>:<\/span> {<\/span>}<\/span> }<\/span>,<\/span> left<\/span>:<\/span> 'center'<\/span>,<\/span> top<\/span>:<\/span> 4<\/span> }<\/span>;<\/span>
\n base.<\/span>dataZoom =<\/span> [<\/span>{<\/span> type<\/span>:<\/span> 'slider'<\/span>,<\/span> xAxisIndex<\/span>:<\/span> 0<\/span>,<\/span> start<\/span>:<\/span> 60<\/span>,<\/span> end<\/span>:<\/span> 100<\/span>,<\/span> height<\/span>:<\/span> 24<\/span>,<\/span> bottom<\/span>:<\/span> 8<\/span> }<\/span>]<\/span>;<\/span>
\n }<\/span> else<\/span> if<\/span> (<\/span>which ===<\/span> 4<\/span>)<\/span> {<\/span>
\n base.<\/span>dataZoom =<\/span> [<\/span>{<\/span> type<\/span>:<\/span> 'slider'<\/span>,<\/span> xAxisIndex<\/span>:<\/span> 0<\/span>,<\/span> start<\/span>:<\/span> 60<\/span>,<\/span> end<\/span>:<\/span> 100<\/span>,<\/span> minSpan<\/span>:<\/span> 100<\/span> \/<\/span> 1096<\/span> *<\/span> 182<\/span>,<\/span> height<\/span>:<\/span> 24<\/span>,<\/span> bottom<\/span>:<\/span> 8<\/span> }<\/span>]<\/span>;<\/span>
\n }<\/span> else<\/span> {<\/span>
\n base.<\/span>dataZoom =<\/span> [<\/span>{<\/span> type<\/span>:<\/span> 'slider'<\/span>,<\/span> xAxisIndex<\/span>:<\/span> 0<\/span>,<\/span> start<\/span>:<\/span> 60<\/span>,<\/span> end<\/span>:<\/span> 100<\/span>,<\/span> height<\/span>:<\/span> 24<\/span>,<\/span> bottom<\/span>:<\/span> 8<\/span> }<\/span>]<\/span>;<\/span>
\n }<\/span>
\n if<\/span> (<\/span>which ===<\/span> 1<\/span> ||<\/span> which ===<\/span> 5<\/span>)<\/span> {<\/span>
\n \/\/ \u5e27\u53ea\u70b9\u4eae\u300c\u5f53\u5b63\u90a3\u4e00\u6bb5\u300d\u7684\u67f1\u5b50：data \u957f\u5ea6\u5fc5\u987b\u7b49\u4e8e 1096（\u4e0e x \u8f74\u7c7b\u76ee\u9010\u683c\u5bf9\u9f50），<\/span>
\n \/\/ \u4e14\u8981\u7528 [{}, {…}] \u7ed9\u7b2c\u4e00\u4e2a\u7cfb\u5217\u5360\u4f4d\u2014\u2014\u5e27\u91cc\u7684 series \u662f\u6309\u4e0b\u6807\u5408\u5e76\u7684\u3002<\/span>
\n var<\/span> qOf =<\/span> DAILY<\/span>.<\/span>map<\/span>(<\/span>function<\/span> (<\/span>r<\/span>)<\/span> {<\/span>
\n return<\/span> r.<\/span>date.<\/span>slice<\/span>(<\/span>0<\/span>,<\/span> 4<\/span>)<\/span> +<\/span> 'Q'<\/span> +<\/span> (<\/span>Math.<\/span>floor<\/span>(<\/span>(<\/span>+<\/span>r.<\/span>date.<\/span>slice<\/span>(<\/span>5<\/span>,<\/span> 7<\/span>)<\/span> –<\/span> 1<\/span>)<\/span> \/<\/span> 3<\/span>)<\/span> +<\/span> 1<\/span>)<\/span>;<\/span>
\n }<\/span>)<\/span>;<\/span>
\n var<\/span> frames =<\/span> qa.<\/span>names.<\/span>map<\/span>(<\/span>function<\/span> (<\/span>k<\/span>)<\/span> {<\/span>
\n return<\/span> {<\/span> series<\/span>:<\/span> [<\/span>{<\/span>}<\/span>,<\/span> {<\/span> data<\/span>:<\/span> DAILY<\/span>.<\/span>map<\/span>(<\/span>function<\/span> (<\/span>r,<\/span> i<\/span>)<\/span> {<\/span> return<\/span> qOf[<\/span>i]<\/span> ===<\/span> k ?<\/span> r.<\/span>sales :<\/span> null<\/span>;<\/span> }<\/span>)<\/span> }<\/span>]<\/span> }<\/span>;<\/span>
\n }<\/span>)<\/span>;<\/span>
\n return<\/span> \/** @type {any} *\/<\/span>(<\/span>{<\/span>
\n animation<\/span>:<\/span> false<\/span>,<\/span>
\n baseOption<\/span>:<\/span> mix<\/span>(<\/span>base,<\/span> {<\/span>
\n series<\/span>:<\/span> [<\/span>{<\/span> type<\/span>:<\/span> 'line'<\/span>,<\/span> data<\/span>:<\/span> sales,<\/span> showSymbol<\/span>:<\/span> false<\/span> }<\/span>,<\/span>
\n {<\/span> type<\/span>:<\/span> 'bar'<\/span>,<\/span> data<\/span>:<\/span> DAILY<\/span>.<\/span>map<\/span>(<\/span>function<\/span> (<\/span>r,<\/span> i<\/span>)<\/span> {<\/span> return<\/span> qOf[<\/span>i]<\/span> ===<\/span> qa.<\/span>names[<\/span>0<\/span>]<\/span> ?<\/span> r.<\/span>sales :<\/span> null<\/span>;<\/span> }<\/span>)<\/span>,<\/span>
\n xAxisIndex<\/span>:<\/span> 0<\/span>,<\/span> yAxisIndex<\/span>:<\/span> 0<\/span>,<\/span> barWidth<\/span>:<\/span> '80%'<\/span> }<\/span>]<\/span>,<\/span>
\n grid<\/span>:<\/span> {<\/span> left<\/span>:<\/span> 70<\/span>,<\/span> right<\/span>:<\/span> 30<\/span>,<\/span> top<\/span>:<\/span> 40<\/span>,<\/span> height<\/span>:<\/span> 150<\/span> }<\/span>,<\/span>
\n dataZoom<\/span>:<\/span> [<\/span>{<\/span> type<\/span>:<\/span> 'slider'<\/span>,<\/span> xAxisIndex<\/span>:<\/span> 0<\/span>,<\/span> height<\/span>:<\/span> 24<\/span>,<\/span> bottom<\/span>:<\/span> 8<\/span> }<\/span>]<\/span>
\n }<\/span>)<\/span>,<\/span>
\n timeline<\/span>:<\/span> {<\/span>
\n axisType<\/span>:<\/span> 'category'<\/span>,<\/span> data<\/span>:<\/span> qa.<\/span>names,<\/span> bottom<\/span>:<\/span> 40<\/span>,<\/span> height<\/span>:<\/span> 40<\/span>,<\/span>
\n label<\/span>:<\/span> {<\/span> interval<\/span>:<\/span> 1<\/span> }<\/span>,<\/span> playInterval<\/span>:<\/span> 400<\/span>
\n }<\/span>,<\/span>
\n options<\/span>:<\/span> frames
\n }<\/span>)<\/span>;<\/span>
\n }<\/span>
\n return<\/span> \/** @type {any} *\/<\/span>(<\/span>base)<\/span>;<\/span>
\n}<\/span><\/p>\n

function<\/span> initPanel15<\/span>(<\/span>)<\/span> {<\/span>
\n var<\/span> p =<\/span> makePanel<\/span>(<\/span>'p15'<\/span>)<\/span>;<\/span>
\n var<\/span> V<\/span> =<\/span> [<\/span>'\u2460 \u53cc slider：\u4e0a\u9762\u7ba1\u65e5\u671f\u3001\u4e0b\u9762\u7ba1\u6570\u503c'<\/span>,<\/span> '\u2461 + timeline \u6309\u5b63\u5ea6 12 \u5e27（\u5e27\u70b9\u4eae\u5f53\u5b63\u67f1）'<\/span>,<\/span>
\n '\u2462 + inside \u6eda\u8f6e，filterMode:"none"'<\/span>,<\/span> '\u2463 + toolbox \u6846\u9009\u4e0e restore'<\/span>,<\/span>
\n '\u2464 minSpan \u534a\u5e74 + \u624b\u7b97\u5b63\u5ea6\u805a\u5408\u8868'<\/span>,<\/span> '\u2465 \u9010\u5e27\u64ad\u653e\u65f6\u7684\u7a97\u53e3\u8bfb\u6570'<\/span>]<\/span>;<\/span>
\n function<\/span> std<\/span>(<\/span>svg,<\/span> c<\/span>)<\/span> {<\/span>
\n return<\/span> [<\/span>dzListModel<\/span>(<\/span>c)<\/span>,<\/span> dzRow<\/span>(<\/span>c,<\/span> 0<\/span>)<\/span>,<\/span> dzCount<\/span>(<\/span>c)<\/span> ><\/span> 1<\/span> ?<\/span> dzRow<\/span>(<\/span>c,<\/span> 1<\/span>)<\/span> :<\/span> ' dz1 =（\u53ea\u6709\u4e00\u6839）'<\/span>,<\/span>
\n axisRow<\/span>(<\/span>c,<\/span> 'x'<\/span>,<\/span> 0<\/span>)<\/span>,<\/span> axisRow<\/span>(<\/span>c,<\/span> 'y'<\/span>,<\/span> 0<\/span>)<\/span>,<\/span> gridRow<\/span>(<\/span>c)<\/span>,<\/span> countRow<\/span>(<\/span>c)<\/span>,<\/span>
\n timelineRow<\/span>(<\/span>c)<\/span>,<\/span> shadowRow<\/span>(<\/span>svg)<\/span>,<\/span>
\n ' \u843d\u76d8 path='<\/span> +<\/span> countTag<\/span>(<\/span>svg,<\/span> 'path'<\/span>)<\/span> +<\/span> ' text='<\/span> +<\/span> countTag<\/span>(<\/span>svg,<\/span> 'text'<\/span>)<\/span> +<\/span> ' \u5b57\u8282='<\/span> +<\/span> svg.<\/span>length +<\/span>
\n ' NaN='<\/span> +<\/span> (<\/span>(<\/span>svg.<\/span>match<\/span>(<\/span>\/<\/span>NaN<\/span>\/<\/span>g<\/span><\/span>)<\/span> ||<\/span> [<\/span>]<\/span>)<\/span>.<\/span>length)<\/span>]<\/span>;<\/span>
\n }<\/span>
\n for<\/span> (<\/span>var<\/span> i =<\/span> 0<\/span>;<\/span> i <<\/span> V<\/span>.<\/span>length;<\/span> i++<\/span>)<\/span> {<\/span>
\n (<\/span>function<\/span> (<\/span>idx<\/span>)<\/span> {<\/span>
\n bind<\/span>(<\/span>'b15'<\/span> +<\/span> String.<\/span>fromCharCode<\/span>(<\/span>97<\/span> +<\/span> idx)<\/span>,<\/span> function<\/span> (<\/span>)<\/span> {<\/span>
\n if<\/span> (<\/span>idx ===<\/span> 4<\/span>)<\/span> {<\/span>
\n p.<\/span>run<\/span>(<\/span>V<\/span>[<\/span>idx]<\/span>,<\/span> dashBoardOpt<\/span>(<\/span>4<\/span>)<\/span>,<\/span> std,<\/span> function<\/span> (<\/span>chart,<\/span> reader,<\/span> arr<\/span>)<\/span> {<\/span>
\n var<\/span> p1 =<\/span> {<\/span> type<\/span>:<\/span> 'dataZoom'<\/span>,<\/span> dataZoomIndex<\/span>:<\/span> 0<\/span>,<\/span> start<\/span>:<\/span> 0<\/span>,<\/span> end<\/span>:<\/span> 3<\/span> }<\/span>;<\/span>
\n var<\/span> err =<\/span> fire<\/span>(<\/span>reader,<\/span> p1)<\/span>;<\/span>
\n fire<\/span>(<\/span>chart,<\/span> p1)<\/span>;<\/span>
\n arr.<\/span>push<\/span>(<\/span>' \u21d2 \u60f3\u538b\u5230 3%（\u6bd4\u534a\u5e74\u7a84）：'<\/span> +<\/span> (<\/span>err ?<\/span> '\u8fd9\u4e00\u8d9f\u52a8\u4f5c\u88ab\u62d2：'<\/span> +<\/span> err :<\/span> '\u52a8\u4f5c\u6b63\u5e38\u9001\u8fbe，\u662f minSpan \u628a\u7a97\u53e3\u9876\u56de\u4e86\u534a\u5e74'<\/span>)<\/span>)<\/span>;<\/span>
\n arr.<\/span>push<\/span>(<\/span>' \u21d2 \u538b\u5b8c\u4e4b\u540e\u7a97\u53e3\u8bfb\u6570\u89c1\u4e0b（minSpan \u628a\u5b83\u9876\u56de\u534a\u5e74，\u770b dz0 \u7684\u300c\u751f\u6548\u7a97\u300d\u4e0e span \u65cf\u91cc\u7684 minSpan）'<\/span>)<\/span>;<\/span>
\n }<\/span>,<\/span> function<\/span> (<\/span>svg,<\/span> c<\/span>)<\/span> {<\/span>
\n return<\/span> [<\/span>dzRow<\/span>(<\/span>c,<\/span> 0<\/span>)<\/span>,<\/span> axisRow<\/span>(<\/span>c,<\/span> 'x'<\/span>,<\/span> 0<\/span>)<\/span>,<\/span> countRow<\/span>(<\/span>c)<\/span>,<\/span> quarterRows<\/span>(<\/span>)<\/span>]<\/span>;<\/span>
\n }<\/span>)<\/span>;<\/span>
\n return<\/span>;<\/span>
\n }<\/span>
\n if<\/span> (<\/span>idx ===<\/span> 5<\/span>)<\/span> {<\/span>
\n var<\/span> got =<\/span> 0<\/span>;<\/span>
\n p.<\/span>run<\/span>(<\/span>V<\/span>[<\/span>idx]<\/span>,<\/span> dashBoardOpt<\/span>(<\/span>1<\/span>)<\/span>,<\/span> std,<\/span> function<\/span> (<\/span>chart,<\/span> reader,<\/span> arr<\/span>)<\/span> {<\/span>
\n try<\/span> {<\/span> reader.<\/span>on<\/span>(<\/span>'timelineChanged'<\/span>,<\/span> function<\/span> (<\/span>)<\/span> {<\/span> got++<\/span>;<\/span> }<\/span>)<\/span>;<\/span> }<\/span> catch<\/span> (<\/span>e)<\/span> {<\/span> }<\/span>
\n for<\/span> (<\/span>var<\/span> k =<\/span> 1<\/span>;<\/span> k <=<\/span> 3<\/span>;<\/span> k++<\/span>)<\/span> {<\/span>
\n var<\/span> p1 =<\/span> {<\/span> type<\/span>:<\/span> 'timelineChange'<\/span>,<\/span> currentIndex<\/span>:<\/span> k }<\/span>;<\/span>
\n fire<\/span>(<\/span>reader,<\/span> p1)<\/span>;<\/span>
\n fire<\/span>(<\/span>chart,<\/span> p1)<\/span>;<\/span>
\n try<\/span> {<\/span>
\n var<\/span> d =<\/span> (<\/span>reader.<\/span>getOption<\/span>(<\/span>)<\/span>.<\/span>dataZoom ||<\/span> [<\/span>]<\/span>)<\/span>[<\/span>0<\/span>]<\/span> ||<\/span> {<\/span>}<\/span>;<\/span>
\n var<\/span> bdata =<\/span> (<\/span>(<\/span>(<\/span>reader.<\/span>getOption<\/span>(<\/span>)<\/span>.<\/span>series ||<\/span> [<\/span>]<\/span>)<\/span>[<\/span>1<\/span>]<\/span> ||<\/span> {<\/span>}<\/span>)<\/span>.<\/span>data)<\/span> ||<\/span> [<\/span>]<\/span>;<\/span>
\n var<\/span> filled =<\/span> [<\/span>]<\/span>;<\/span>
\n for<\/span> (<\/span>var<\/span> q =<\/span> 0<\/span>;<\/span> q <<\/span> bdata.<\/span>length;<\/span> q++<\/span>)<\/span> {<\/span> if<\/span> (<\/span>bdata[<\/span>q]<\/span> !=<\/span> null<\/span>)<\/span> filled.<\/span>push<\/span>(<\/span>q)<\/span>;<\/span> }<\/span>
\n arr.<\/span>push<\/span>(<\/span>' \u7b2c '<\/span> +<\/span> k +<\/span> ' \u5e27\u56de\u8bfb\u7a97\u53e3 start\/end='<\/span> +<\/span> JSON<\/span>.<\/span>stringify<\/span>(<\/span>[<\/span>d.<\/span>start,<\/span> d.<\/span>end]<\/span>)<\/span> +<\/span>
\n ' \u67f1（\u7b2c\u4e8c\u6761\u7cfb\u5217）\u975e\u7a7a '<\/span> +<\/span> filled.<\/span>length +<\/span> ' \u683c，\u4e0b\u6807 '<\/span> +<\/span>
\n (<\/span>filled.<\/span>length ?<\/span> filled[<\/span>0<\/span>]<\/span> +<\/span> ' ~ '<\/span> +<\/span> filled[<\/span>filled.<\/span>length –<\/span> 1<\/span>]<\/span> :<\/span> '（\u65e0）'<\/span>)<\/span> +<\/span>
\n '，\u65e5\u7ebf（\u7b2c\u4e00\u6761\u7cfb\u5217）\u6761\u6570='<\/span> +<\/span> (<\/span>(<\/span>(<\/span>(<\/span>reader.<\/span>getOption<\/span>(<\/span>)<\/span>.<\/span>series ||<\/span> [<\/span>]<\/span>)<\/span>[<\/span>0<\/span>]<\/span> ||<\/span> {<\/span>}<\/span>)<\/span>.<\/span>data)<\/span> ||<\/span> [<\/span>]<\/span>)<\/span>.<\/span>length)<\/span>;<\/span>
\n }<\/span> catch<\/span> (<\/span>e3)<\/span> {<\/span> arr.<\/span>push<\/span>(<\/span>' \u7b2c '<\/span> +<\/span> k +<\/span> ' \u5e27\u8bfb\u4e0d\u5230：'<\/span> +<\/span> e3.<\/span>message)<\/span>;<\/span> }<\/span>
\n }<\/span>
\n try<\/span> {<\/span> reader.<\/span>off<\/span>(<\/span>'timelineChanged'<\/span>)<\/span>;<\/span> }<\/span> catch<\/span> (<\/span>e4)<\/span> {<\/span> }<\/span>
\n arr.<\/span>push<\/span>(<\/span>' \u21d2 \u4e09\u5e27\u5404\u89e6\u53d1 1 \u6b21 timelineChanged，\u547d\u4e2d '<\/span> +<\/span> got +<\/span> ' \u6b21；\u4e0a\u9762\u56de\u8bfb\u5230\u7684 start\/end \u662f\u8fd9\u4e00\u5e27 option \u91cc\u5199\u7684\u7a97\u53e3'<\/span>
\n +<\/span> '（\u5e27\u662f\u589e\u91cf\u5408\u5e76：\u8fd9\u4e09\u5e27\u5404\u53ea\u5199 series[1].data，\u6ca1\u5199 dataZoom \u21d2 \u7a97\u53e3\u7559\u7740\u4e0a\u4e00\u5e27\u7684\u503c，\u65e5\u7ebf\u90a3\u6761\u4e5f\u4e00\u683c\u6ca1\u52a8）'<\/span>)<\/span>;<\/span>
\n }<\/span>,<\/span> function<\/span> (<\/span>svg,<\/span> c<\/span>)<\/span> {<\/span>
\n return<\/span> [<\/span>timelineRow<\/span>(<\/span>c)<\/span>,<\/span> dzRow<\/span>(<\/span>c,<\/span> 0<\/span>)<\/span>,<\/span> axisRow<\/span>(<\/span>c,<\/span> 'x'<\/span>,<\/span> 0<\/span>)<\/span>]<\/span>;<\/span>
\n }<\/span>)<\/span>;<\/span>
\n return<\/span>;<\/span>
\n }<\/span>
\n p.<\/span>run<\/span>(<\/span>V<\/span>[<\/span>idx]<\/span>,<\/span> dashBoardOpt<\/span>(<\/span>idx)<\/span>,<\/span> std)<\/span>;<\/span>
\n }<\/span>)<\/span>;<\/span>
\n }<\/span>)<\/span>(<\/span>i)<\/span>;<\/span>
\n }<\/span>
\n p.<\/span>run<\/span>(<\/span>V<\/span>[<\/span>0<\/span>]<\/span>,<\/span> dashBoardOpt<\/span>(<\/span>0<\/span>)<\/span>,<\/span> std)<\/span>;<\/span>
\n}<\/span><\/p>\n

\n

\u3010\u53c2\u6570\u901f\u67e5\u3011<\/h3>\n

\u8fd9\u4e00\u6bb5\u7684\u9ed8\u8ba4\u503c\u4e0d\u662f\u6284\u6587\u6863，\u662f\u73b0\u573a\u8bfb\u7684\u3002\u63a2\u9488\u628a\u4e09\u578b dataZoom \u4e0e timeline \u7684 constructor.defaultOption（merge \u4e4b\u524d\u7684\u539f\u6837）\u548c getOption() \u91cc merge \u5b8c\u7684 option \u5e76\u6392\u6253\u5370，\u989c\u8272\u4e00\u5f8b\u5199\u6210\u89e3\u6790\u4e4b\u540e\u7684\u5341\u516d\u8fdb\u5236\u6216 rgba \u4e32\u2014\u2014\u6e90\u7801\u91cc\u5b83\u4eec\u662f tokens.color.accent20 \u8fd9\u7c7b\u4ee4\u724c，\u4f4f\u5728 echarts\/lib\/visual\/tokens.js\u3002\u5f00\u8868\u4e4b\u524d\u5148\u7acb\u4e24\u4ef6\u4e8b\u3002\u4e00，\u57fa\u5ea7\u53ea\u6709\u56db\u952e：DataZoomModel.js:405-410 \u5199\u7684\u662f {z:4, filterMode:'filter', start:0, end:100}，\u4e00\u4e2a\u7248\u5f0f\u952e\u90fd\u6ca1\u6709；slider \u5f80\u4e0a\u52a0 28 \u952e（SliderZoomModel.js:57-129，\u6700\u540e\u4e00\u952e\u662f defaultLocationEdgeGap:15），inside \u52a0 6 \u952e（InsideZoomModel.js:55-62），select \u4e00\u578b\u52a0\u96f6\u952e\u2014\u2014\u5b83\u53ea\u6d3b\u5230\u57fa\u5ea7\u4e3a\u6b62，\u8fd9\u5c31\u662f\u5b83\u753b\u4e0d\u51fa\u6ed1\u5757\u7684\u539f\u56e0\u3002\u8fd9\u4e24\u65cf\u7684 defaultOption \u4e5f\u90fd\u662f\u5e73\u94fa\u7684（\u73b0\u573a\u8bfb defaultOption.option \u4e3a undefined），\u8ddf title\u3001legend \u90a3\u79cd\u300cnormal \u8fd8\u5957\u4e00\u5c42\u300d\u7684\u8001\u5199\u6cd5\u4e0d\u540c，\u522b\u53bb option.option \u91cc\u627e\u9ed8\u8ba4\u503c\u3002\u4e8c，merge \u5b8c\u4f60\u4e00\u5b9a\u591a\u770b\u89c1\u4e09\u6837：throttle \u662f DataZoomModel.js:246-252 \u73b0\u7b97\u7684（\u5f00\u542f\u52a8\u753b\u4e14 animationDurationUpdate > 0 \u21d2 100，\u5426\u5219 20，\u672c\u7ae0\u6240\u6709\u6863\u90fd\u5199 animation:false，\u6240\u4ee5\u73b0\u573a\u8bfb\u56de\u7684\u4e00\u76f4\u662f 20），startValue\/endValue \u5219\u53ef\u80fd\u662f dataZoomProcessor.js:120-135 \u56de\u586b\u7684\u751f\u6548\u7a97\u800c\u4e0d\u662f\u4f60\u7684\u58f0\u660e（\u7b2c\u516d\u8282）\u2014\u2014B0 \u91cc\u4f60\u53ea\u5199\u4e86 start:25, end:75，getOption() \u5374\u4f1a\u7ed9\u4f60 startValue \u4e0e endValue\u3002<\/p>\n

\u8868\u4e00：dataZoom \u57fa\u5ea7（\u4e09\u578b\u5171\u7528）<\/h4>\n\n\u53c2\u6570\u7c7b\u578b\u9ed8\u8ba4\u503c6.x \u73b0\u573a\u8bfb\u8bf4\u660e<\/tr>\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n
dataZoom<\/td>\nobject | object[]<\/td>\n\u2014<\/td>\n\u2014<\/td>\n\u9876\u5c42\u7ec4\u4ef6\u6570\u7ec4\u3002\u5199\u8fdb series \u91cc\u662f\u6b7b\u952e，\u843d\u76d8\u4e00\u4e2a\u5b57\u8282\u90fd\u4e0d\u52a8（\u7b2c\u4e00\u8282\u3001\u3010\u6700\u5c0f\u53ef\u8dd1\u3011\u27171）<\/td>\n<\/tr>\n
dataZoom.type<\/td>\nstring<\/td>\n'slider'<\/td>\n\u2014<\/td>\nslider \/ inside \/ select\u3002\u4e0d\u5199\u65f6\u7531 installCommon.js:52 \u7684 subTypeDefaulter \u6298\u6210 slider（\u7b2c\u56db\u8282）<\/td>\n<\/tr>\n
dataZoom.xAxisIndex<\/td>\nnumber | number[] | \u2018all\u2019 | \u2018none\u2019<\/td>\n\u81ea\u52a8\u8ba4\u9886<\/td>\n\u2014<\/td>\n\u4e09\u6863\u8ba4\u9886\u94fe\u89c1\u7b2c\u4e8c\u8282；\u7a7a\u6570\u7ec4 [] \u662f\u4e00\u6839\u5408\u6cd5\u7684\u6b7b\u6ed1\u5757（\u7b2c\u5341\u4e03\u8282 \u2463）<\/td>\n<\/tr>\n
dataZoom.yAxisIndex<\/td>\n\u540c\u4e0a<\/td>\n\u81ea\u52a8\u8ba4\u9886<\/td>\n\u2014<\/td>\n\u4e0e xAxisIndex \u5171\u7528\u90a3\u6761\u94fe，orient \u51b3\u5b9a\u5b83\u5148\u6251\u54ea\u4e00\u65cf<\/td>\n<\/tr>\n
dataZoom.radiusAxisIndex<\/td>\n\u540c\u4e0a<\/td>\n\u81ea\u52a8\u8ba4\u9886<\/td>\n\u2014<\/td>\n\u6781\u5750\u6807\u90a3\u4e24\u7ef4\u4e0e singleAxis \u4e5f\u5728\u540c\u4e00\u4efd\u4e94\u7ef4\u540d\u5355\u91cc（helper.js:47）<\/td>\n<\/tr>\n
dataZoom.filterMode<\/td>\nstring<\/td>\n'filter'<\/td>\n\u2014<\/td>\nfilter \/ weakFilter \/ empty \/ none，\u5904\u7f6e\u7684\u662f\u884c（\u7b2c\u5341\u4e8c\u8282）<\/td>\n<\/tr>\n
dataZoom.start<\/td>\nnumber<\/td>\n0<\/td>\n\u4f1a\u88ab\u5237\u6210\u751f\u6548\u7a97<\/td>\n\u767e\u5206\u6bd4\u3002\u5206\u6bcd\u662f\u8de8\u5ea6\u4e0d\u662f\u6839\u6570，\u53d6\u6574\u53ea\u6709 Math.round \u4e00\u6761（\u7b2c\u4e09\u8282）<\/td>\n<\/tr>\n
dataZoom.end<\/td>\nnumber<\/td>\n100<\/td>\n\u4f1a\u88ab\u5237\u6210\u751f\u6548\u7a97<\/td>\n\u5199\u53cd\u4e0d\u629b\u9519，AxisProxy.js:169-170 \u4e24\u53e5 asc() \u628a\u7a97\u53e3\u6298\u56de\u6765（\u7b2c\u56db\u8282）<\/td>\n<\/tr>\n
dataZoom.startValue<\/td>\nnumber | string | Date<\/td>\n\u2014<\/td>\n\u5e38\u88ab\u56de\u586b<\/td>\n\u503c\u6a21\u5f0f\u3002\u8d8a\u754c\u4e0d\u5e73\u629b\u3001\u628a\u6574\u6247\u7a97\u5e73\u63a8\u8fdb\u8f74\u91cc（\u7b2c\u4e03\u8282）；\u65e5\u671f\u4e32\u6309\u672c\u5730\u65f6\u533a（\u7b2c\u5341\u4e5d\u8282 \u2463）<\/td>\n<\/tr>\n
dataZoom.endValue<\/td>\nnumber | string | Date<\/td>\n\u2014<\/td>\n\u5e38\u88ab\u56de\u586b<\/td>\n\u540c\u4e0a\u3002\u8f74\u4e0a\u53e6\u6709\u4e00\u4e2a\u540c\u540d\u952e，\u90a3\u662f\u67f1\u5b50\u7684\u8d77\u7b14\u503c，\u4e24\u4e2a\u4eba\u4e0d\u662f\u4e00\u56de\u4e8b（\u7b2c\u4e5d\u8282）<\/td>\n<\/tr>\n
dataZoom.z<\/td>\nnumber<\/td>\n4<\/td>\n\u2014<\/td>\n\u6ed1\u5757\u90a3\u7ec4\u56fe\u5143\u7684\u5c42\u53f7<\/td>\n<\/tr>\n
dataZoom.throttle<\/td>\nnumber | null<\/td>\n100；animation:false \u65f6\u8bfb\u5230 20<\/td>\n:246-252 \u73b0\u7b97<\/td>\n\u5199 null \u5173\u8282\u6d41\u3002\u7b2c\u4e00\u6b21\u663e\u5f0f\u5199\u503c\u4e4b\u540e\u81ea\u52a8\u8282\u6d41\u5c31\u6b64\u5173\u95ed（:245-247）<\/td>\n<\/tr>\n
dataZoom.minSpan<\/td>\nnumber<\/td>\n\u2014<\/td>\n\u2014<\/td>\n\u7a97\u53e3\u5bbd\u5ea6\u4e0b\u9650（\u767e\u5206\u6bd4），\u4f1a\u88ab\u5939\u8fdb [0, \u8de8\u5ea6]（\u7b2c\u5341\u4e00\u8282）<\/td>\n<\/tr>\n
dataZoom.maxSpan<\/td>\nnumber<\/td>\n\u2014<\/td>\n\u81f3\u5c11\u7b49\u4e8e minSpan<\/td>\n\u4e0a\u9650\u3002sliderMove.js:77-79 \u4fdd\u8bc1\u5b83\u4e0d\u5c0f\u4e8e minSpan<\/td>\n<\/tr>\n
dataZoom.minValueSpan<\/td>\nnumber<\/td>\n\u2014<\/td>\n\u53ef\u7531 minSpan \u6d3e\u751f<\/td>\n\u540c\u4e00\u4ef6\u4e8b\u7684\u300c\u503c\u300d\u7248\u672c，time \u8f74\u4e0a\u5c31\u662f\u6beb\u79d2\u3002\u4f18\u5148\u7ea7\u538b\u8fc7\u767e\u5206\u6bd4\u90a3\u4e00\u65cf（AxisProxy.js:379）<\/td>\n<\/tr>\n
dataZoom.rangeMode<\/td>\nstring[]<\/td>\n\u2014<\/td>\n\u2014<\/td>\n\u4e24\u7aef\u5404\u4e00\u683c ['value' | 'percent', \u2026]，\u51b3\u5b9a span \u65cf\u62ff\u54ea\u4e00\u5bf9\u952e\u53bb\u5939（\u7b2c\u4e8c\u5341\u8282 :148\u3001:185）<\/td>\n<\/tr>\n
dataZoom.orient<\/td>\nstring<\/td>\n\u4e0d\u5728\u4efb\u4f55 defaultOption \u91cc，\u73b0\u573a\u8bfb\u5230 undefined<\/td>\n:144 \/ :146<\/td>\n\u7531 _makeAutoOrientByTargetAxis（:237-244）\u6309\u76ee\u6807\u8f74\u63a8；\u6ca1\u4eba\u6307\u5b9a\u8f74\u65f6\u843d 'horizontal'<\/td>\n<\/tr>\n
dataZoom.id<\/td>\nstring<\/td>\n\u2014<\/td>\n\u2014<\/td>\n\u7ed9\u52a8\u4f5c\u4e0e toolbox \u5b9a\u5411\u7528\u3002toolbox \u81ea\u5df1\u9020\u7684\u90a3\u4e24\u6839\u7684 id \u662f toolbox-dataZoom_xAxis0 \u524d\u9762\u6302\u5185\u90e8\u524d\u7f00<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n

\u8868\u4e8c：slider \u90a3\u4e00\u578b\u591a\u51fa\u6765\u7684 28 \u952e<\/h4>\n\n\u53c2\u6570\u7c7b\u578b\u9ed8\u8ba4\u503c\u9759\u56fe\u843d\u76d8\u8bf4\u660e<\/tr>\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n
dataZoom.show<\/td>\nboolean<\/td>\ntrue<\/td>\n\u6709<\/td>\nfalse \u64a4\u753b\u9762\u4f46\u7a97\u53e3\u7167\u7b97\u3001\u6570\u636e\u7167\u88c1（\u7b2c\u4e8c\u8282）<\/td>\n<\/tr>\n
dataZoom.left \/ dataZoom.bottom<\/td>\nnumber | string | null<\/td>\nnull<\/td>\n\u6709<\/td>\n\u9ed8\u8ba4\u8fd9\u4e24\u952e\u662f null；\u7ba1\u7248\u9762\u7684\u662f right\/top\/width\/height \u90a3\u56db\u952e（SliderZoomModel.js:57-65），\u7b2c\u5341\u56db\u8282\u5b9a\u5f8b\u4e00\u8bfb\u7684\u662f top \u4e0e height<\/td>\n<\/tr>\n
dataZoom.right \/ dataZoom.top<\/td>\n\u540c\u4e0a<\/td>\n'ph'<\/td>\n\u6709<\/td>\n'ph' \u4e0d\u662f\u300c\u81ea\u52a8\u300d\u800c\u662f\u5360\u4f4d\u7b26：SliderZoomView.js:144-150 \u6bcf\u6b21\u5e03\u5c40\u73b0\u7b97\u4e00\u4efd，:159-165 \u53ea\u628a\u8fd8\u6302\u7740 'ph' \u7684\u90a3\u51e0\u952e\u6362\u6389，:157-158 \u660e\u5199\u300c\u4e0d\u5199\u56de option，\u56e0\u4e3a resize \u65f6\u8981\u91cd\u7b97\u300d<\/td>\n<\/tr>\n
dataZoom.width \/ dataZoom.height<\/td>\n\u540c\u4e0a<\/td>\n'ph'<\/td>\n\u6709<\/td>\n\u6a2a\u6ed1\u5757\u65f6 height \u6298\u6210 DEFAULT_FILLER_SIZE = 30（:63\u3001:150）\u3001width \u6298\u6210\u76ee\u6807 grid \u7684\u5bbd；\u300c40\u300d\u8fd9\u4e2a\u6570\u5728\u672c\u7ae0\u4efb\u4f55\u9ed8\u8ba4\u6863\u91cc\u90fd\u4e0d\u51fa\u73b0<\/td>\n<\/tr>\n
dataZoom.borderColor<\/td>\nColorString<\/td>\n'#e0e4f2'<\/td>\n\u6709<\/td>\n\u8f68\u9053\u63cf\u8fb9<\/td>\n<\/tr>\n
dataZoom.borderRadius<\/td>\nnumber | number[]<\/td>\n0<\/td>\n\u6709<\/td>\n\u8f68\u9053\u5706\u89d2<\/td>\n<\/tr>\n
dataZoom.backgroundColor<\/td>\nZRColor<\/td>\n'rgba(0,0,0,0)'<\/td>\n\u6709<\/td>\n\u8f68\u9053\u5e95（\u7b2c\u5341\u4e94\u8282\u90a3\u56db\u6761\u77e9\u5f62\u4e4b\u4e00）<\/td>\n<\/tr>\n
dataZoom.dataBackground<\/td>\nobject<\/td>\n{lineStyle:{color:'#a1aed9',width:0.5}, areaStyle:{color:'#c0c9e6',opacity:0.2}}<\/td>\n\u6709<\/td>\n\u7f29\u7565\u56fe\u7a97\u53e3\u5916\u90a3\u534a\u622a<\/td>\n<\/tr>\n
dataZoom.selectedDataBackground<\/td>\nobject<\/td>\n{lineStyle:{color:'#8292cc',width:0.5}, areaStyle:{color:'#c0c9e6',opacity:0.3}}<\/td>\n\u6709<\/td>\n\u7a97\u53e3\u5185\u90a3\u534a\u622a（\u7b2c\u5341\u516d\u8282\u6570\u7684\u662f\u5b83\u4eec\u7684\u9876\u70b9）<\/td>\n<\/tr>\n
dataZoom.fillerColor<\/td>\nZRColor<\/td>\n'rgba(135,175,274,0.2)'<\/td>\n\u6709<\/td>\n\u9009\u4e2d\u533a\u586b\u5145\u3002\u6e90\u7801\u91cc\u7b2c\u4e09\u901a\u9053\u5c31\u5199\u7740 274，\u90a3\u4e00\u4e32\u662f\u539f\u6837\u843d\u76d8\u7684<\/td>\n<\/tr>\n
dataZoom.handleIcon<\/td>\nstring<\/td>\n\u4e00\u6761 path:\/\/ \u7ad6\u69fd<\/td>\n\u6709<\/td>\n\u5b98\u65b9\u6807\u6ce8 @deprecated Use handleStyle instead（shared.d.ts:10804-10806）<\/td>\n<\/tr>\n
dataZoom.handleSize<\/td>\nnumber | string<\/td>\n'100%'<\/td>\n\u6709<\/td>\n\u5b57\u7b26\u4e32\u662f\u6ed1\u5757\u9ad8\u5ea6\u7684\u767e\u5206\u6bd4，\u5bbd\u5ea6\u6309\u56fe\u6807\u5bbd\u9ad8\u6bd4\u7b97（\u7b2c\u5341\u56db\u8282）<\/td>\n<\/tr>\n
dataZoom.handleStyle<\/td>\nobject<\/td>\n{color:'#fff',borderColor:'#c0c9e6'}<\/td>\n\u6709<\/td>\n\u624b\u67c4\u586b\u5145\u4e0e\u63cf\u8fb9<\/td>\n<\/tr>\n
dataZoom.moveHandleSize<\/td>\nnumber | string<\/td>\n7<\/td>\n\u6709<\/td>\n\u5199 0 \u65f6\u6574\u6761\u62d6\u52a8\u6761\u4e0d\u753b（\u7b2c\u5341\u4e94\u8282）<\/td>\n<\/tr>\n
dataZoom.moveHandleIcon<\/td>\nstring<\/td>\n\u4e09\u6761 path:\/\/ \u7684\u56fe\u6807<\/td>\n\u6709<\/td>\n\u62d6\u52a8\u6761\u8eab\u4e0a\u7684\u56fe\u6848<\/td>\n<\/tr>\n
dataZoom.moveHandleStyle<\/td>\nobject<\/td>\n{color:'#8292cc',opacity:0.5}<\/td>\n\u6709<\/td>\n\u62d6\u52a8\u6761\u6837\u5f0f<\/td>\n<\/tr>\n
dataZoom.showDetail<\/td>\nboolean<\/td>\ntrue<\/td>\n\u65e0<\/td>\n\u53ea\u7ba1\u62d6\u52a8\u90a3\u4e00\u4e0b\u7684\u6d6e\u6807\u7b7e<\/td>\n<\/tr>\n
dataZoom.showDataShadow<\/td>\nboolean | \u2018auto\u2019<\/td>\n'auto'<\/td>\n\u6709<\/td>\nfalse \u65f6\u4e09\u7ec4\u9762\u4e09\u7ec4\u7ebf\u6574\u4e2a\u6d88\u5931（\u7b2c\u5341\u516d\u8282）<\/td>\n<\/tr>\n
dataZoom.realtime<\/td>\nboolean<\/td>\ntrue<\/td>\n\u65e0<\/td>\n\u5047\u7684\u65f6\u5019\u677e\u624b\u624d\u843d\u7a97（\u7b2c\u516d\u8282\u90a3\u4e24\u9053\u95e8\u4e4b\u5916，\u8fd9\u662f\u7b2c\u4e09\u9053\u95f8）<\/td>\n<\/tr>\n
dataZoom.zoomLock<\/td>\nboolean<\/td>\nfalse<\/td>\n\u65e0<\/td>\n\u53ea\u8bb8\u5e73\u79fb\u4e0d\u8bb8\u7f29\u653e\u3002minSpan:200 \u88ab\u5939\u6210\u6574\u6839\u8f74\u65f6\u770b\u8d77\u6765\u548c\u5b83\u4e00\u6837（\u7b2c\u5341\u4e00\u8282）<\/td>\n<\/tr>\n
dataZoom.textStyle<\/td>\nobject<\/td>\n{color:'#6d6e73'}<\/td>\n\u65e0<\/td>\n\u5b83\u88ab SliderZoomView.js:472-485 \u8bfb\u53bb\u505a\u624b\u67c4\u6807\u7b7e\u7684\u6587\u5b57，\u800c\u624b\u67c4\u6807\u7b7e\u9ed8\u8ba4 invisible（:474-477）；d.ts \u91cc\u8fd8\u7559\u7740\u4e00\u53e5 Slider dataZoom don't support textStyle（:10772）<\/td>\n<\/tr>\n
dataZoom.brushSelect<\/td>\nboolean<\/td>\ntrue<\/td>\n\u6709<\/td>\n\u5173\u6389\u4e4b\u540e\u62d6\u52a8\u6761\u6574\u6761\u4e0d\u753b（\u7b2c\u5341\u4e94\u8282 \u2465）<\/td>\n<\/tr>\n
dataZoom.brushStyle<\/td>\nobject<\/td>\n{color:'#a1aed9',opacity:0.3}<\/td>\n\u65e0<\/td>\n\u6846\u9009\u8fdb\u884c\u4e2d\u7684\u90a3\u5c42\u76d6\u5b50\u7684\u6837\u5f0f，\u9759\u56fe\u4e0a\u770b\u4e0d\u89c1<\/td>\n<\/tr>\n
dataZoom.labelPrecision<\/td>\nnumber | \u2018auto\u2019<\/td>\n\u2014<\/td>\n\u65e0<\/td>\n\u53ea\u5f71\u54cd\u6d6e\u6807\u7b7e\u7684\u663e\u793a\u4f4d\u6570，\u6e90\u7801\u660e\u5199\u300c\u4e0d\u5141\u8bb8\u7528\u5b83\u6539\u6570\u503c\u7cbe\u5ea6\u6216\u6b65\u8fdb\u300d（shared.d.ts:10824-10828）<\/td>\n<\/tr>\n
dataZoom.labelFormatter<\/td>\nstring | function<\/td>\n\u2014<\/td>\n\u65e0<\/td>\n\u540c\u4e0a，\u53ea\u5728\u4ea4\u4e92\u91cc\u51fa\u73b0<\/td>\n<\/tr>\n
dataZoom.handleLabel<\/td>\nobject<\/td>\n\u4e0d\u5728 defaultOption \u91cc<\/td>\n\u65e0<\/td>\n{show:false}；emphasis.handleLabel.show \u9ed8\u8ba4\u624d\u662f true<\/td>\n<\/tr>\n
dataZoom.emphasis<\/td>\nobject<\/td>\n{handleLabel:{show:true},handleStyle:{borderColor:'#8292cc'},moveHandleStyle:{opacity:0.8}}<\/td>\n\u65e0<\/td>\n\u5168\u5728 hover \u91cc<\/td>\n<\/tr>\n
dataZoom.defaultLocationEdgeGap<\/td>\nnumber<\/td>\n15<\/td>\n\u6709<\/td>\nd.ts \u6807\u4e86 @private（:10844-10848）\u3002\u7b2c\u5341\u56db\u8282\u5b9a\u5f8b\u4e00\u300c\u7ec4\u9876 = \u5bb9\u5668\u9ad8 \u2212 30 \u2212 \u8fd9\u4e2a\u6570 \u2212 \u6709\u6ca1\u6709\u62d6\u52a8\u6761\u300d\u8bfb\u7684\u5c31\u662f\u5b83（SliderZoomView.js:142\u3001:148）<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n

\u8868\u4e09：inside \u90a3\u4e00\u578b\u591a\u51fa\u6765\u7684\u952e<\/h4>\n\n\u53c2\u6570\u7c7b\u578b\u9ed8\u8ba4\u503c\u9759\u56fe\u843d\u76d8\u8bf4\u660e<\/tr>\n\n\n\n\n\n\n\n\n\n
dataZoom.disabled<\/td>\nboolean<\/td>\nfalse<\/td>\n\u65e0<\/td>\ninside \u672c\u6765\u4e00\u4e2a\u50cf\u7d20\u90fd\u4e0d\u843d，\u6240\u4ee5\u8fd9\u4e00\u65cf\u7684\u952e\u5168\u90fd\u53ea\u5728\u4ea4\u4e92\u91cc\u6d3b<\/td>\n<\/tr>\n
dataZoom.zoomLock<\/td>\nboolean<\/td>\nfalse<\/td>\n\u65e0<\/td>\nInsideZoomModel.js:55-62 \u7684\u516d\u952e\u4e4b\u4e00（\u6ed1\u5757\u90a3\u578b\u5728 SliderZoomModel.js:108 \u4e5f\u5199\u4e86\u4e00\u904d）；\u53ea\u8bb8\u5e73\u79fb\u4e0d\u8bb8\u7f29\u653e<\/td>\n<\/tr>\n
dataZoom.zoomOnMouseWheel<\/td>\nboolean | \u2018shift\u2019 | \u2018ctrl\u2019 | \u2018alt\u2019<\/td>\ntrue<\/td>\n\u65e0<\/td>\nmodifier \u5199\u6cd5\u662f\u300c\u6309\u4f4f\u624d\u7f29\u653e\u300d<\/td>\n<\/tr>\n
dataZoom.moveOnMouseMove<\/td>\n\u540c\u4e0a<\/td>\ntrue<\/td>\n\u65e0<\/td>\n\u62d6\u52a8\u5e73\u79fb<\/td>\n<\/tr>\n
dataZoom.moveOnMouseWheel<\/td>\n\u540c\u4e0a<\/td>\nfalse<\/td>\n\u65e0<\/td>\n\u6eda\u8f6e\u9ed8\u8ba4\u4e0d\u5e73\u79fb，\u4e0e\u4e0a\u4e00\u952e\u4e92\u65a5\u4f7f\u7528<\/td>\n<\/tr>\n
dataZoom.preventDefaultMouseMove<\/td>\nboolean<\/td>\ntrue<\/td>\n\u65e0<\/td>\n\u4e0d\u8ba9\u9875\u9762\u8ddf\u7740\u6eda\u3002\u79fb\u52a8\u7aef\u4e0e\u5d4c\u5165\u5f0f\u91cc\u7b2c\u4e00\u4e2a\u8981\u52a8\u7684\u5c31\u662f\u5b83<\/td>\n<\/tr>\n
dataZoom.cursorGrab<\/td>\nstring<\/td>\n\u4e0d\u5728 defaultOption \u91cc，\u5b9e\u9645 'grab'<\/td>\n\u65e0<\/td>\n\u9ed8\u8ba4\u503c\u4f4f\u5728 RoamController.js:105-106，\u6a21\u578b\u5c42 get \u8bfb\u56de\u6765\u662f undefined<\/td>\n<\/tr>\n
dataZoom.cursorGrabbing<\/td>\nstring<\/td>\n\u540c\u4e0a，\u5b9e\u9645 'grabbing'<\/td>\n\u65e0<\/td>\n\u6293\u8d77\u6765\u90a3\u4e00\u4e0b\u7684\u5149\u6807<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n

\u73b0\u573a\u8bfb inside merge \u5b8c\u7684 option \u4e00\u5171 15 \u9879（\u63a2\u9488 tools\/__probe\/ch20keysi.mjs）：\u57fa\u5ea7\u56db\u952e z\/filterMode\/start\/end（DataZoomModel.js:405-411）+ InsideZoomModel.js:55-62 \u90a3\u516d\u952e + throttle + startValue\/endValue + type\/xAxisIndex\u3002\u540c\u4e00\u6863 slider \u662f 37 \u9879\u3001select \u53ea\u6709 9 \u9879\u3002\u6ca1\u6709 show\u3001\u6ca1\u6709 realtime\u3001\u6ca1\u6709 textStyle，\u4e5f\u6ca1\u6709\u4efb\u4f55\u7248\u5f0f\u952e\u2014\u2014\u6240\u4ee5\u7ed9 inside \u5199 height:40 \u4e4b\u7c7b\u7684\u952e\u4e0d\u662f\u300c\u4e0d\u751f\u6548\u300d，\u662f\u538b\u6839\u6ca1\u4eba\u8bfb\u3002<\/p>\n

\u8868\u56db：timeline<\/h4>\n\n\u53c2\u6570\u7c7b\u578b\u9ed8\u8ba4\u503c\u73b0\u573a\u8bfb\u8bf4\u660e<\/tr>\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n
timeline<\/td>\nobject<\/td>\n\u2014<\/td>\n\u2014<\/td>\n\u4e0e baseOption\u3001options \u6210\u5957\u7528（\u7b2c\u4e8c\u5341\u4e00\u8282）\u3002\u5b8c\u5168\u4e0d\u5199 \u21d2 \u7ec4\u4ef6\u6570 0<\/td>\n<\/tr>\n
timeline.axisType<\/td>\nstring<\/td>\n'time'<\/td>\nTimelineModel.js:162<\/td>\n\u4e09\u503c category \/ time \/ value\u3002\u5e27\u540d\u663e\u793a\u6210\u4ec0\u4e48\u5f52\u5b83\u7ba1，\u4e0d\u5f52 data \u7ba1（\u7b2c\u4e8c\u5341\u4e00\u8282）<\/td>\n<\/tr>\n
timeline.data<\/td>\narray<\/td>\n[]<\/td>\n\u2014<\/td>\n\u5e27\u540d\u6216 {value, label, itemStyle\u2026} \u5bf9\u8c61<\/td>\n<\/tr>\n
timeline.currentIndex<\/td>\nnumber<\/td>\n0<\/td>\n\u4e0d\u5939\u4e0d\u53d6\u6a21<\/td>\n\u5199\u8fdb option \u4e0d\u5939\u3001\u8d70\u52a8\u4f5c\u624d\u5939（\u7b2c\u4e8c\u5341\u4e00\u8282 \u2465\u2466）<\/td>\n<\/tr>\n
timeline.autoPlay<\/td>\nboolean<\/td>\nfalse<\/td>\n\u2014<\/td>\n\u771f\u503c \u21d2 \u5e93\u81ea\u5df1\u53d1 timelineChange \u52a8\u4f5c，\u4e8e\u662f\u4f1a\u8d70 :52-53 \u90a3\u4e24\u53e5\u5939\u53d6<\/td>\n<\/tr>\n
timeline.playInterval<\/td>\nnumber<\/td>\n2000<\/td>\n\u2014<\/td>\n\u6bcf\u5e27\u6beb\u79d2<\/td>\n<\/tr>\n
timeline.loop<\/td>\nboolean<\/td>\ntrue<\/td>\n:54-62<\/td>\n\u5047\u503c\u4e14\u64ad\u5230\u672b\u5e27\u65f6，\u5e93\u81ea\u5df1\u53d1\u4e00\u6761 timelinePlayChange \u628a\u64ad\u653e\u5173\u6389<\/td>\n<\/tr>\n
timeline.rewind<\/td>\nboolean<\/td>\nfalse<\/td>\n\u2014<\/td>\n\u5012\u7740\u64ad<\/td>\n<\/tr>\n
timeline.realtime<\/td>\nboolean<\/td>\ntrue<\/td>\n\u2014<\/td>\n\u62d6\u68c0\u67e5\u70b9\u65f6\u9010\u5e27\u5207\u6362，\u8fd8\u662f\u677e\u624b\u624d\u5207<\/td>\n<\/tr>\n
timeline.controlPosition<\/td>\nstring<\/td>\n'left'<\/td>\npreprocessor.js:70-80<\/td>\n\u8001\u952e\u3002preprocessor \u4f1a\u628a\u5b83\u642c\u8fdb controlStyle.position \u7136\u540e delete \u6389\u539f\u952e（\u5751 12）<\/td>\n<\/tr>\n
timeline.controlStyle<\/td>\nobject<\/td>\n{show:true,showPlayBtn:true,showPrevBtn:true,showNextBtn:true,itemSize:24,itemGap:12,position:'left',prevBtnSize:18,nextBtnSize:18,color:'#6578ba'}<\/td>\n\u6709<\/td>\n\u4e09\u679a\u6309\u94ae\u7684\u5f00\u5173\u4e0e\u6446\u4f4d\u3002show:false \u65f6 fill="#6578ba" \u4ece 4 \u5904\u6389\u5230 1 \u5904（\u5269\u4e0b\u90a3\u5904\u662f\u68c0\u67e5\u70b9）<\/td>\n<\/tr>\n
timeline.label<\/td>\nobject<\/td>\n{show:true,position:'auto',interval:'auto',rotate:0,color:'#6d6e73'}<\/td>\n\u6709<\/td>\nposition \u53ef\u4ee5\u662f\u6570\u5b57，\u8d1f\u6570\u5f80\u5de6\/\u4e0a（SliderTimelineModel.js:77-88 \u7684\u6ce8\u91ca）<\/td>\n<\/tr>\n
timeline.checkpointStyle<\/td>\nobject<\/td>\n{symbol:'circle',symbolSize:15,color:'#6578ba',animation:true,animationDuration:300,animationEasing:'quinticInOut'}<\/td>\n\u6709<\/td>\n\u90a3\u4e2a\u4f1a\u52a8\u7684\u68c0\u67e5\u70b9<\/td>\n<\/tr>\n
timeline.lineStyle<\/td>\nobject<\/td>\n{show:true,width:2,color:'#e0e4f2'}<\/td>\n\u6709<\/td>\n\u8f74\u810a<\/td>\n<\/tr>\n
timeline.itemStyle<\/td>\nobject<\/td>\n{color:'#c0c9e6',borderWidth:0}<\/td>\n\u6709<\/td>\n\u523b\u5ea6\u70b9<\/td>\n<\/tr>\n
timeline.symbol \/ timeline.symbolSize<\/td>\nstring \/ number<\/td>\n'circle' \/ 12<\/td>\n\u6709<\/td>\n\u523b\u5ea6\u70b9\u7684\u5f62\u72b6<\/td>\n<\/tr>\n
timeline.progress<\/td>\nobject<\/td>\n{lineStyle:{color:'#a1aed9'},itemStyle:{color:'#8292cc'}<\/td>\n\u6709<\/td>\n\u300c\u64ad\u8fc7\u7684\u8fd9\u4e00\u5934\u300d\u7684\u989c\u8272<\/td>\n<\/tr>\n
timeline.orient<\/td>\nstring<\/td>\n'horizontal'<\/td>\nSliderTimelineModel.js:65<\/td>\n\u6ce8\u610f dataZoom.orient \u6ca1\u6709\u9ed8\u8ba4\u503c，\u8fd9\u4e00\u65cf\u7684\u6709<\/td>\n<\/tr>\n
timeline.left \/ timeline.right<\/td>\n\u540c\u4e0a<\/td>\n'20%' \/ '20%'<\/td>\n\u2014<\/td>\n\u9ed8\u8ba4\u8ba9\u5f00\u4e24\u4fa7，padding \u662f 15，height \u662f 40，bottom \u662f 0<\/td>\n<\/tr>\n
timeline.backgroundColor<\/td>\nZRColor<\/td>\n'rgba(0,0,0,0)'<\/td>\n\u6709<\/td>\n\u677f\u5e95\u8272，borderColor \u9ed8\u8ba4 '#b7b9be'\u3001borderWidth \u9ed8\u8ba4 0<\/td>\n<\/tr>\n
timeline.type<\/td>\nstring<\/td>\n\u2014<\/td>\npreprocessor.js:60-68<\/td>\nEC2 \u9057\u7559\u3002'number' \u21d2 axisType:'value'\u3001'time' \u21d2 axisType:'time'，\u7136\u540e\u539f\u952e\u88ab delete（\u5751 11）<\/td>\n<\/tr>\n
timeline.replaceMerge<\/td>\nstring[]<\/td>\n\u2014<\/td>\ntimelineAction.js:65-67<\/td>\n\u5207\u5e27\u65f6\u6846\u67b6\u4ef6\u600e\u4e48\u66ff\u6362，\u7b2c\u4e8c\u5341\u4e00\u8282\u90a3\u672c\u8d26<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n

\u8868\u4e94：toolbox.feature.dataZoom \u4e0e\u5b83\u9020\u51fa\u6765\u7684\u4e1c\u897f<\/h4>\n\n\u53c2\u6570\u7c7b\u578b\u9ed8\u8ba4\u503c\u8bf4\u660e<\/tr>\n\n\n\n\n\n\n\n\n
toolbox.feature.dataZoom.show<\/td>\nboolean<\/td>\ntrue<\/td>\n\u6302\u4e0a\u5c31\u9020\u7ec4\u4ef6，\u8ddf\u4f60\u70b9\u4e0d\u70b9\u6ca1\u5173\u7cfb（\u7b2c\u5341\u516b\u8282）<\/td>\n<\/tr>\n
toolbox.feature.dataZoom.filterMode<\/td>\nstring<\/td>\n'filter'<\/td>\n\u8f6c\u7ed9\u90a3\u4e24\u6839\u5185\u90e8 select（feature\/DataZoom.js:249）<\/td>\n<\/tr>\n
toolbox.feature.dataZoom.xAxisIndex<\/td>\n\u540c\u57fa\u5ea7<\/td>\n\u4e0d\u5199 \u21d2 'all'<\/td>\nmakeAxisFinder（:187-205）\u53ea\u770b\u4f60\u5199\u6ca1\u5199\u3002\u5199 0 \u4e0d\u51cf\u7ec4\u4ef6，\u8981\u51cf\u5f97\u5199 'none' \u6216 false<\/td>\n<\/tr>\n
toolbox.feature.dataZoom.yAxisIndex<\/td>\n\u540c\u4e0a<\/td>\n\u4e0d\u5199 \u21d2 'all'<\/td>\n'none' \u90a3\u6839\u4e0d\u751f\u6210（\u9762\u677f\u5341\u4e94 \u2463 \u5c31\u53ea\u5269 xAxis0）<\/td>\n<\/tr>\n
toolbox.feature.dataZoom.icon<\/td>\nobject<\/td>\n{zoom:'M0,13.5h26.9 \u2026', back:'M22,1.4L9.9,13.5 \u2026'}<\/td>\n\u4e24\u679a\u56fe\u6807\u5404\u4e00\u6761 path<\/td>\n<\/tr>\n
toolbox.feature.dataZoom.title<\/td>\nobject<\/td>\n\u4ece locale \u53d6 ['toolbox','dataZoom','title']<\/td>\n:164，\u6240\u4ee5\u4e2d\u6587\u5305\u6362\u7684\u662f\u8bcd\u4e0d\u662f\u952e<\/td>\n<\/tr>\n
toolbox.feature.dataZoom.brushStyle<\/td>\nobject<\/td>\n{borderWidth:0,color:'rgba(234,237,245,0.5)'}<\/td>\n\u6846\u9009\u90a3\u5c42\u76d6\u5b50\u7684\u6837\u5f0f，tokens.color.backgroundTint<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n

\u8868\u516d：\u52a8\u4f5c\u3001\u4e8b\u4ef6，\u4ee5\u53ca\u90a3\u4e09\u4efd\u8d26\u5404\u7528\u54ea\u4e00\u53e5\u8bfb<\/h4>\n\n\u4f60\u8981\u505a\u7684\u4e8b\u8d70\u54ea\u6761\u5173\u952e payload\u73b0\u573a\u884c\u4e3a<\/tr>\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n
\u4e00\u6b21\u628a\u4e24\u7aef\u6539\u6210\u767e\u5206\u6bd4<\/td>\n\u52a8\u4f5c dataZoom<\/td>\ndataZoomIndex \u6216 dataZoomId，\u914d start\/end<\/td>\ndataZoomAction.js:44-58 \u628a\u5b83\u4ea4\u7ed9 setRawRange，option \u4e0e settledOption \u4e00\u8d77\u7ffb（\u7b2c\u516d\u8282）<\/td>\n<\/tr>\n
\u53ea\u52a8\u4e00\u7aef<\/td>\nsetOption merge<\/td>\n\u5199\u5728 dataZoom[i] \u91cc<\/td>\n\u53e6\u4e00\u7aef\u8fde\u6a21\u5f0f\u5e26\u503c\u90fd\u7559\u7740 \u21d2 \u534a\u65b0\u4e00\u534a\u65e7（\u7b2c\u4e94\u8282）<\/td>\n<\/tr>\n
\u6846\u9009\u843d\u7a97<\/td>\n\u52a8\u4f5c dataZoom<\/td>\nbatch:[{dataZoomId, startValue, endValue}]<\/td>\ntoolbox \u81ea\u5df1\u53d1\u7684\u5c31\u662f\u8fd9\u4e2a\u5f62\u72b6（feature\/DataZoom.js:142-152）<\/td>\n<\/tr>\n
\u8fdb \/ \u51fa\u6846\u9009\u6001<\/td>\n\u52a8\u4f5c takeGlobalCursor<\/td>\nkey:'dataZoomSelect'\u3001dataZoomSelectActive<\/td>\n\u4e0d\u5efa\u7ec4\u4ef6\u3001\u4e0d\u6539\u7a97\u53e3，\u53ea\u628a brush \u5f00\u5173\u62e8\u4e00\u4e0b（\u7b2c\u5341\u516b\u8282）<\/td>\n<\/tr>\n
\u4e00\u5207\u56de\u5230\u58f0\u660e\u503c<\/td>\n\u52a8\u4f5c restore<\/td>\n\u2014<\/td>\n\u7a97\u53e3\u56de\u5230 option \u58f0\u660e\u503c\u3001zoomMM \u6e05\u7a7a（\u7b2c\u5341\u516b\u8282 \u2463）<\/td>\n<\/tr>\n
\u53ea\u9000\u4e00\u683c<\/td>\n\u6ca1\u6709\u5bf9\u5916\u52a8\u4f5c<\/td>\n\u2014<\/td>\nhandlers.back \u8d70\u7684\u662f\u5b83\u81ea\u5df1\u90a3\u672c history（:183-185），restore \u4e0d\u8ba4<\/td>\n<\/tr>\n
\u5207\u5e27<\/td>\n\u52a8\u4f5c timelineChange<\/td>\ncurrentIndex<\/td>\n\u8d70\u52a8\u4f5c\u4f1a\u5939（timelineAction.js:52-53），\u5199\u8fdb option \u4e0d\u5939（\u7b2c\u4e8c\u5341\u4e00\u8282 \u2465\u2466）<\/td>\n<\/tr>\n
\u5f00\u5173\u64ad\u653e<\/td>\n\u52a8\u4f5c timelinePlayChange<\/td>\nplayState（\u5927\u5199 S）<\/td>\n:72-81；\u64ad\u5230\u672b\u5e27\u4e14 loop:false \u65f6\u5e93\u81ea\u5df1\u53d1\u4e00\u6b21 playState:false<\/td>\n<\/tr>\n
\u542c\u7f29\u653e<\/td>\n\u4e8b\u4ef6 datazoom<\/td>\ne.batch<\/td>\n\u4e8b\u4ef6\u540d\u5728\u6d3e\u53d1\u524d\u8fc7 toLowerCase（echarts.js:2288-2292）\u3002chart.on \u7684\u540d\u5b57\u4e5f\u5148\u8f6c\u5c0f\u5199（:245-248），\u6240\u4ee5\u6302 'dataZoom' \u6536\u5f97\u5230，\u4f46\u56de\u8c03\u91cc e.type \u662f\u5168\u5c0f\u5199<\/td>\n<\/tr>\n
\u542c\u5207\u5e27<\/td>\n\u4e8b\u4ef6 timelineChanged<\/td>\ne.currentIndex<\/td>\n\u56db\u4e2a\u540d\u5b57\u4e00\u8d77\u6302\u4e0a\u53bb\u5b9e\u6d4b\u547d\u4e2d {"timelineChange":0,"timelineChanged":1,"timelinechanged":1,"TimelineChanged":1}；\u800c dispatchAction \u7684 type \u67e5\u8868\u4e0d\u8f6c\u5c0f\u5199，timelinechange \u547d\u4e2d 0（\u7b2c\u4e8c\u5341\u4e00\u8282 \u2467）<\/td>\n<\/tr>\n
\u8bfb\u300c\u6211\u5199\u7684\u300d<\/td>\nchart.getModel().getComponent('dataZoom', i).settledOption<\/td>\n\u2014<\/td>\n\u4e94\u952e\u7684\u540d\u5355\u5c31\u662f retrieveRawOption（DataZoomModel.js:419-425）：start\/end\/startValue\/endValue\/throttle<\/td>\n<\/tr>\n
\u8bfb\u300c\u8fd9\u4e00\u7aef\u4e0a\u6b21\u7528\u4ec0\u4e48\u952e\u5199\u7684\u300d<\/td>\n\u540c\u4e00\u4e2a\u6a21\u578b\u4e0a\u7684 getRangePropMode()<\/td>\n\u2014<\/td>\n\u4e24\u683c\u6570\u7ec4，setRawRange \u624d\u66f4\u65b0\u5b83（\u7b2c\u4e94\u8282）<\/td>\n<\/tr>\n
\u8bfb\u300c\u751f\u6548\u7684\u300d<\/td>\nfindRepresentativeAxisProxy().calculateDataWindow(settledOption)<\/td>\n\u2014<\/td>\n\u8fd4\u56de {value, percent, percentInverted, valuePrecision}；option \u4e0a\u90a3\u56db\u952e\u662f\u5b83\u7b2c\u4e8c\u8f6e\u5237\u51fa\u6765\u7684\u526f\u672c（\u7b2c\u516d\u8282）<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n

\u8868\u4e03：\u5199\u4e0b\u53bb\u300c\u9759\u56fe\u843d\u76d8\u300d\u5230\u5e95\u6709\u6ca1\u6709\u53cd\u5e94<\/h4>\n

\u8fd9\u5f20\u8868\u662f\u63a2\u9488 ch20dead \u7684 33 \u6863（\u843d\u76d8\u540c 18\u3001\u843d\u76d8\u5f02 15）：\u6bcf\u6863\u6e32\u67d3\u4e24\u6b21（\u57fa\u7ebf \/ \u52a0\u4e0a\u8fd9\u4e2a\u952e），\u628a zrN-cls-K\u3001zrN-cK \u4e24\u7c7b\u8ba1\u6570\u5668\u5f52\u4e00\u5316\u4e4b\u540e\u9010\u5b57\u8282\u6bd4\u3002\u300c\u65e0\u300d\u4e0d\u7b49\u4e8e\u6b7b\u952e，\u5b83\u53ea\u610f\u5473\u7740\u8fd9\u6761\u952e\u7684\u6548\u679c\u5728 animation:false \u7684\u9759\u56fe\u4e0a\u770b\u4e0d\u89c1\u2014\u2014SSR \u4e32\u91cc\u6ca1\u6709\u9f20\u6807\u72b6\u6001\u3002<\/p>\n\n\u53c2\u6570\u9759\u56fe\u843d\u76d8\u53cd\u5e94\u5728\u54ea\u91cc<\/tr>\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n
dataZoom.show \/ orient \/ filterMode<\/td>\n\u6709<\/td>\n\u753b\u9762\u4e0e\u884c\u7684\u5904\u7f6e，\u7b2c\u4e8c\u3001\u5341\u4e8c\u8282<\/td>\n<\/tr>\n
\u7248\u5f0f\u516d\u952e\u4e0e borderColor \/ borderRadius \/ backgroundColor<\/td>\n\u6709<\/td>\n\u8f68\u9053\u957f\u65b9\u5f62，\u7b2c\u5341\u56db\u8282<\/td>\n<\/tr>\n
dataZoom.fillerColor \/ handleIcon \/ handleSize \/ handleStyle \/ moveHandleSize \/ moveHandleIcon \/ moveHandleStyle<\/td>\n\u6709<\/td>\n\u6ed1\u5757\u8eab\u4e0a\u90a3\u56db\u6761\u77e9\u5f62，\u7b2c\u5341\u4e94\u8282<\/td>\n<\/tr>\n
dataZoom.dataBackground \/ selectedDataBackground \/ showDataShadow<\/td>\n\u6709<\/td>\n\u7f29\u7565\u56fe\u4e09\u7ec4\u9762\u4e09\u7ec4\u7ebf，\u7b2c\u5341\u516d\u8282<\/td>\n<\/tr>\n
dataZoom.brushSelect<\/td>\n\u6709<\/td>\n\u5173\u6389\u65f6\u62d6\u52a8\u6761\u6574\u6761\u4e0d\u753b，\u7b2c\u5341\u4e94\u8282 \u2465<\/td>\n<\/tr>\n
dataZoom.defaultLocationEdgeGap<\/td>\n\u6709<\/td>\n\u7ec4\u9876\u95ed\u5f0f\u5b9a\u5f8b，\u7b2c\u5341\u56db\u8282<\/td>\n<\/tr>\n
dataZoom.brushStyle \/ labelPrecision \/ labelFormatter \/ handleLabel \/ emphasis<\/td>\n\u65e0<\/td>\n\u5168\u5728 hover \u4e0e\u62d6\u52a8\u91cc<\/td>\n<\/tr>\n
dataZoom.showDetail \/ realtime \/ zoomLock \/ throttle<\/td>\n\u65e0<\/td>\n\u4ea4\u4e92\u95f8\u95e8\u4e0e\u8282\u6d41<\/td>\n<\/tr>\n
dataZoom.textStyle<\/td>\n\u65e0<\/td>\n\u8bfb\u5f97\u5230\u3001\u4e5f\u771f\u88ab\u8bfb，\u4f46\u5bf9\u8c61\u9ed8\u8ba4 invisible（\u8868\u4e8c\u90a3\u4e00\u884c）<\/td>\n<\/tr>\n
dataZoom.rangeMode<\/td>\n\u65e0<\/td>\n\u5b83\u6539\u7684\u662f\u5939\u7a97\u53e3\u65f6\u7528\u54ea\u4e00\u5bf9\u952e，B0 \u4e0a\u6ca1\u4e1c\u897f\u53ef\u5939（\u7b2c\u4e8c\u5341\u8282）<\/td>\n<\/tr>\n
dataZoom.minSpan<\/td>\n\u65e0<\/td>\n25% \u7684\u4e0b\u9650\u9876\u4e0d\u4f4f\u672c\u6765\u5c31\u6709 50% \u7684\u7a97\u53e3（\u3010\u6700\u5c0f\u53ef\u8dd1\u3011\u2466 \u7528 4% \u624d\u649e\u51fa\u6765）<\/td>\n<\/tr>\n
dataZoom.z<\/td>\n\u65e0<\/td>\n\u8fd9\u5f20\u56fe\u4e0a\u6ca1\u6709\u7b2c\u4e8c\u4e2a\u540c\u5c42\u7ec4\u4ef6\u6765\u4e89\u7ed8\u5236\u987a\u5e8f<\/td>\n<\/tr>\n
\u8fd9\u4e00\u578b\u7684\u5168\u90e8\u952e（\u8868\u4e09\u90a3\u516b\u884c）<\/td>\n\u65e0<\/td>\ninside \u672c\u6765\u4e00\u4e2a\u50cf\u7d20\u90fd\u4e0d\u843d（\u7b2c\u4e8c\u8282）<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n
\n

\u3010\u5e38\u89c1\u5751\u3011<\/h3>\n

\u5751 1：\u628a dataZoom \u5199\u8fdb series \u91cc，\u56fe\u4e00\u4e2a\u5b57\u4e0d\u6539，\u5e93\u4e00\u58f0\u4e0d\u542d<\/p>\n

\u6700\u5c0f\u53ef\u8dd1\u90a3\u4e00\u9875\u7684 \u27171 \u5c31\u662f\u5b83：\u628a dataZoom:[{type:'slider',\u2026}] \u585e\u8fdb series[0]，getOption().dataZoom \u8bfb\u56de\u6765\u662f\u4e00\u6839\u90fd\u6ca1\u6709，\u7ec4\u4ef6\u6811 0 \u6839，\u753b\u9762\u4e0a 12 \u884c\u3001x \u8f74\u533a\u95f4 [0, 11]\u2014\u2014\u548c\u300c\u4f60\u4ee5\u4e3a\u6709\u6ed1\u5757\u300d\u7684\u56fe\u957f\u5f97\u4e00\u6a21\u4e00\u6837，\u4e0d\u53d1\u8b66\u544a\u3001\u4e0d\u629b\u9519\u3002\u539f\u56e0\u662f series \u90a3\u4efd\u952e\u540d\u5355（Series.js \u7684 defaultOption \u94fe）\u91cc\u6839\u672c\u6ca1\u6709 dataZoom \u8fd9\u4e2a\u952e，\u5b83\u4e0d\u662f\u88ab\u5ffd\u7565，\u662f\u538b\u6839\u6ca1\u4eba\u8bfb\u3002\u4fee\u6cd5：dataZoom \u6c38\u8fdc\u662f\u9876\u5c42\u7ec4\u4ef6\u3002\u8fd9\u4e00\u8bfe\u7c7b\u578b\u95e8\u7981\u6293\u5f97\u4f4f（\u672c\u4ed3\u5e93\u7684 node tools\/verify-types.mjs \u4f1a\u56e0\u4e3a\u591a\u4f59\u952e\u62a5\u9519），\u8089\u773c\u6293\u4e0d\u4f4f，\u6240\u4ee5\u628a\u5b83\u5199\u8fdb CI \u6bd4\u5199\u8fdb\u4ee3\u7801\u8bc4\u5ba1\u9760\u8c31\u3002<\/p>\n

\u5751 2：\u628a getOption() \u5f53\u6210\u300c\u6211\u5199\u7684\u90a3\u4efd\u300d<\/p>\n

\u4e09\u7b14\u8d26\u957f\u5f97\u5f88\u50cf：option \u4e0a\u90a3\u56db\u952e\u4f1a\u88ab dataZoomProcessor.js:120-135 \u5237\u6210\u751f\u6548\u7a97，getOption() \u8bfb\u7684\u5c31\u662f\u5b83；settledOption \u7559\u7684\u662f\u4f60\u771f\u6b63\u5199\u8fdb\u53bb\u7684\u90a3\u4efd；getRangePropMode() \u7559\u7684\u662f\u8fd9\u4e00\u7aef\u4e0a\u6b21\u662f\u7528\u54ea\u79cd\u952e\u5199\u7684\u3002start:-5, end:150 \u90a3\u6863\u6700\u5178\u578b：settledOption \u539f\u6837 [-5,150,null,null]，\u800c option \u4e0e\u56de\u8bfb\u5df2\u7ecf\u662f [0,100]／[0,11]（\u7b2c\u516d\u8282\u3001\u3010\u6700\u5c0f\u53ef\u8dd1\u3011）\u3002\u4fee\u6cd5：\u8c03\u8bd5\u65f6\u628a\u4e09\u884c\u4e00\u8d77\u6253（min.html \u7684 read() \u5c31\u662f\u8fd9\u4e09\u884c），\u522b\u53ea\u6253 getOption()\u3002\u751f\u4ea7\u4ee3\u7801\u91cc\u4e0d\u8981\u628a\u56de\u8bfb\u7684 start\/end \u5f53\u6210\u7528\u6237\u610f\u56fe\u5f80\u56de\u5199\u2014\u2014\u7b2c\u4e8c\u5341\u8282 \u2467 \u90a3\u6761\u300c\u7528 minValueSpan \u65f6 getOption() \u7684 start\/end \u5df2\u7ecf\u662f\u88ab\u9876\u5f00\u4e4b\u540e\u7684\u503c\u300d\u8bf4\u7684\u5c31\u662f\u8fd9\u7c7b\u4e8b\u6545\u3002<\/p>\n

\u5751 3：\u62d6\u4e00\u4e0b\u6ed1\u5757，y \u8f74\u7684\u523b\u5ea6\u4e5f\u6362\u4e86<\/p>\n

\u4e0d\u662f\u6e32\u67d3\u6bdb\u75c5，\u662f filter \u7684\u5b9a\u4e49：y \u8f74\u7684\u533a\u95f4\u662f\u4ece\u300c\u7a97\u53e3\u91cc\u8fd8\u5269\u54ea\u51e0\u884c\u300d\u7b97\u51fa\u6765\u7684\u3002\u7b2c\u5341\u4e09\u8282\u5728 1096 \u5929\u4e0a\u626b\u4e86 8 \u6863，\u9010\u6863\u5b9e\u6d4b\u300c\u8f74\u4e0a\u754c \u2265 \u7a97\u53e3\u5185 max\u300d\u4e00\u6b21\u4f8b\u5916\u90fd\u6ca1\u6709\u2014\u2014[0, 44] \u90a3\u6863\u7a97\u53e3\u5185 max \u662f 66005.33，\u8f74\u533a\u95f4 [0, 70000]；[274, 493] \u90a3\u6863 max 126729.31，\u8f74\u533a\u95f4 [0, 150000]\u3002\u7a97\u53e3\u8d8a\u7a84\u8d8a\u50cf\u62bd\u724c：minSpan:0.5 \u53ea\u5269 6 \u884c\u65f6\u8f74\u7acb\u523b\u584c\u5230 [0, 70000]\u3002\u4fee\u6cd5\u4e09\u6761，\u6309\u4fb5\u5165\u6027\u4ece\u5c0f\u5230\u5927：yAxis.min\/max \u5199\u6b7b（\u7b2c\u516b\u8282，\u6ce8\u610f fixMM \u4e00\u771f\u7a97\u53e3\u5c31\u6362\u4e86\u5206\u6bcd）\u3001filterMode:'none'（y \u8f74\u6052\u4e3a [0, 250000]，\u4ee3\u4ef7\u662f\u540c\u4e00\u6247\u7a97\u843d\u76d8\u4ece 26028 \u6da8\u5230 36242 \u5b57\u8282，\u56e0\u4e3a 1096 \u4e2a\u70b9\u5168\u5f97\u5199\u8fdb SVG）\u3001\u6216\u8005\u5e72\u8106\u53ea\u6302 xAxisIndex\u3002<\/p>\n

\u5751 4：\u540c\u4e00\u6839\u8f74\u4e0a\u4e24\u6839 dataZoom，\u540e\u5199\u7684\u90a3\u6839\u767d\u5199<\/p>\n

\u7b2c\u5341\u4e03\u8282\u7684\u5b9a\u5f8b\u662f\u300c\u5148\u6765\u8005\u79f0\u738b\u300d：dataZoomProcessor.js:64-71 \u5148\u95ee\u300c\u8fd9\u6839\u8f74\u5df2\u7ecf\u6709\u4e3b\u4eba\u4e86\u5417\u300d，\u7b54\u662f，\u5219\u540e\u6765\u8005\u7684 proxy \u5168\u4e0d\u751f\u6548\u3002\u7b2c\u5341\u516b\u8282 \u2467 \u7ed9\u4e86\u6700\u75bc\u7684\u4e00\u6b21\u5b9e\u6d4b（\u63a2\u9488 tools\/__probe\/ch20ex23.mjs \u7684 E2-2）：\u5148\u53ea\u6302 toolbox\u2014\u2014\u5b83\u5efa\u56fe\u65f6\u5c31\u9020\u597d\u4e24\u6839\u5185\u90e8 select \u5e76\u5f53\u4e86\u4e3b\u4eba\u2014\u2014\u4e4b\u540e setOption \u8865\u4e00\u6839 {type:'slider', start:20, end:80}：\u4f60\u7684 settledOption \u8001\u8001\u5b9e\u5b9e\u662f [20,80,null,null]，\u751f\u6548\u7a97\u5374\u662f [0,100]／[0,11]，\u6ed1\u5757\u6ee1\u7a97\u6446\u7740\u3001\u4e00\u683c\u90fd\u6ca1\u7f29，\u800c getOption() \u91cc\u5b83\u6392\u7b2c 2 \u69fd\u3001\u524d\u4e24\u69fd\u662f null \u6d1e\u3002\u6cbb\u6cd5\u6709\u56db\u6761，\u5168\u90fd\u5b9e\u6d4b\u8fc7：\u2460 \u628a\u90a3\u6839 slider \u5199\u8fdb\u7b2c\u4e00\u4e2a setOption（\u9762\u677f\u5341\u4e94 \u2463 \u5c31\u8d62\u5728\u8fd9\u513f；E2-3 \u8bfb\u5230\u6e05\u5355\u53d8\u6210 [0] slider host=true\u3001[1] select host=false\u3001[2] select host=true，\u751f\u6548\u7a97 [20,80]）；\u2461 \u8865\u5199\u65f6\u628a toolbox \u8fde\u8f74\u4e00\u8d77\u8bf7\u8d70：replaceMerge \u91cc\u540c\u65f6\u5199 toolbox \u548c dataZoom，\u800c\u4e14\u8fd9\u4e00\u4efd option \u91cc\u4e0d\u518d\u51fa\u73b0 toolbox（\u63a2\u9488 ch20ex23b.mjs C-A：\u53ea\u5269\u4e00\u6839 slider\u3001host=true\u3001getOption().toolbox \u8bfb\u56de []）；\u2462 \u8ba9\u5b83\u522b\u8ba4\u9886\u4f60\u90a3\u6839\u8f74，toolbox.feature.dataZoom.xAxisIndex:'none'（C-E）；\u2463 notMerge \u6574\u5f20\u91cd\u753b（C-D \u6709\u6548，\u4ee3\u4ef7\u662f\u522b\u7684\u72b6\u6001\u4e00\u8d77\u4e22）\u3002\u4e24\u6761\u770b\u7740\u50cf\u6cbb\u6cd5\u5176\u5b9e\u4e0d\u662f：\u53ea\u5199 replaceMerge:['dataZoom'] \u65e0\u6548（E2-4：host \u4ecd false\u3001null \u6d1e\u7167\u5728\u3001x \u8f74\u8fd8\u662f [0,11]）；\u7ed9 feature.dataZoom \u5199 show:false \u4e5f\u65e0\u6548（C-C）\u3002\u539f\u56e0\u662f\u5185\u90e8\u4ef6\u4e0d\u662f\u300c\u5efa\u56fe\u65f6\u9020\u597d\u5c31\u5220\u4e0d\u6389\u300d，\u800c\u662f\u6bcf\u6b21 setOption \u90fd\u7531 concatInternalOptions \u91cd\u65b0\u62fc\u8fdb\u65b0 option（Global.js:257 \u2192 internalComponentCreator.js:51-65），replaceMerge \u8ba4 id \u4e0d\u8ba4\u6765\u6e90，\u800c\u5b83\u4fdd\u6301\u7ec4\u4ef6\u539f\u6709\u6b21\u5e8f\u3001\u4e2d\u95f4\u88ab\u5220\u7684\u5185\u90e8\u4ef6\u53ea\u7559\u6d1e（Global.js \u5934\u90e8 Caution \u7b2c (3) \u6761）\u2014\u2014\u8865\u5199\u90a3\u6839\u56e0\u6b64\u6c38\u8fdc\u6392\u5728\u5185\u90e8\u4e24\u6839\u4e4b\u540e，\u800c\u987a\u5e8f\u6b63\u662f\u4e3b\u4eba\u7684\u5224\u636e\u3002\u8fd8\u6709\u4e2a\u5751\u4e2d\u5751：\u628a feature.dataZoom \u5199\u6210 null \u4f1a\u8ba9 toolbox \u6e32\u67d3\u65f6\u629b TypeError: Cannot read properties of null (reading 'iconStatus')（C-G1\/C-G2，\u5e26\u4e0d\u5e26\u522b\u7684 feature \u90fd\u629b）\u2014\u2014ToolboxView.js:90 \u628a\u4f60\u7684 null \u539f\u6837\u5305\u6210 new Model(featureOpt, …)，:233 \u5374\u8981\u53bb\u5b83\u8eab\u4e0a\u8bfb 'iconStatus'\u3002<\/p>\n

\u5751 5：getOption().dataZoom \u91cc\u6df7\u8fdb null，.map(d => d.start) \u5d29\u5728\u624b\u91cc<\/p>\n

Global.js:382-391 \u5012\u7740\u626b\u7ec4\u4ef6\u6570\u7ec4，\u628a\u5e26\u5185\u90e8 id \u7684\u69fd\u7f6e null，\u53ea\u5728\u300c\u4e00\u8def\u90fd\u5728\u672b\u5c3e\u300d\u65f6\u624d\u7f29\u957f\u5ea6\u3002\u53ea\u6302\u8fc7 toolbox \u7684\u56fe\u4e0a\u90a3\u4e24\u6839\u90fd\u5728\u5c3e\u90e8 \u21d2 \u8bfb\u5230 []；\u540e\u6765\u53c8\u8865\u4e86\u4e00\u6839 slider \u21d2 \u8bfb\u5230\u957f\u5ea6 3\u3001\u9010\u69fd ["0:null（\u6d1e）","1:null（\u6d1e）","2:slider"]（\u7b2c\u5341\u516b\u8282）\u3002\u4fee\u6cd5：\u51e1\u6302\u8fc7 feature.dataZoom \u7684\u56fe，\u56de\u8bfb\u7ec4\u4ef6\u6570\u7ec4\u5148 filter(Boolean)\u3002\u540c\u7406，getOption().series[0].data \u7684\u957f\u5ea6\u662f 12 \u4e0d\u4ee3\u8868\u753b\u9762\u4e0a\u662f 12 \u884c，\u90a3\u662f\u6570\u636e\u5c42\u7684\u58f0\u660e（\u7b2c\u4e00\u8282）\u3002<\/p>\n

\u5751 6：\u53ea merge \u4e00\u7aef，\u7ed3\u679c\u300c\u534a\u65b0\u4e00\u534a\u65e7\u300d<\/p>\n

DataZoomModel.js:255-273 \u6700\u540e\u4e00\u884c\u6ce8\u91ca\u539f\u6587 \/\/ else remain its original setting.\u2014\u2014\u6ca1\u4eba\u78b0\u7684\u90a3\u4e00\u7aef，\u6a21\u5f0f\u4e0e\u503c\u90fd\u539f\u6837\u7559\u7740\u3002\u9762\u677f\u4e09 \u2465：\u5148\u5199 {startValue:2, endValue:8}，\u518d merge \u4e00\u4e2a {start:50}，\u8bfb\u56de\u6765 rangePropMode \u662f ["percent","value"]，\u751f\u6548\u7a97 \u503c=[6, 8]\u2014\u2014\u5de6\u7aef\u662f\u65b0\u767e\u5206\u6bd4（50% \u00d7 11 = 5.5 \u2192 6），\u53f3\u7aef\u8fd8\u662f\u8001\u7684\u503c\u6a21\u5f0f 8\u3002\u4fee\u6cd5：\u8981\u4e48\u4e24\u7aef\u4e00\u8d77\u5199，\u8981\u4e48\u8d70 dispatchAction（setRawRange \u540c\u65f6\u7ffb\u4e24\u7aef）\u3002\u7ec3\u4e60 1 \u8ba9\u4f60\u81ea\u5df1\u649e\u4e00\u6b21\u3002<\/p>\n

\u5751 7：minSpan \u7684\u5206\u6bcd\u5f53\u6210\u6570\u636e\u6761\u6570<\/p>\n

\u8de8\u5ea6\u662f max \u2212 min，12 \u6839\u7c7b\u76ee\u662f 11\u30011096 \u5929\u662f 1095\u3002\u7b2c\u4e8c\u5341\u4e8c\u8282 \u2464 \u628a\u8fd9\u4e24\u4e2a\u5206\u6bcd\u649e\u5728\u4e00\u8d77：\u60f3\u8bbe\u300c\u534a\u5e74\u300d，\u6309\u6761\u6570\u5199 100 \/ 1096 * 182 = 16.605839416058394，\u800c\u5e93\u628a\u503c\u6298\u56de\u767e\u5206\u6bd4\u7528\u7684\u662f\u8de8\u5ea6 \u21d2 \u540c\u4e00\u4e2a\u7a97\u53e3\u7684\u4e24\u4e2a\u767e\u5206\u6bd4 16.605839 \u4e0e 16.621005 \u5dee\u5728\u8fd9\u513f，\u6d3e\u751f\u51fa\u7684 minValueSpan \u6210\u4e86 181.8339416058394\u2014\u2014\u6bd4 182 \u5c11 0.166 \u5929\u3002\u4fee\u6cd5：\u60f3\u6309\u5929\/\u6309\u6839\u6570\u8bbe\u4e0b\u9650，\u5c31\u5199 minValueSpan（\u5199 182 \u5c31\u662f 182），\u522b\u62ff minSpan \u53bb\u9664\u6761\u6570\u3002<\/p>\n

\u5751 8：start \u4e0e endValue \u6df7\u5199\u65f6，span \u65cf\u6309\u503c\u90a3\u4e00\u4fa7\u751f\u6548<\/p>\n

\u8fd9\u4e0d\u662f\u6211\u7684\u63a8\u6d4b，\u662f\u6e90\u7801\u81ea\u5df1\u627f\u8ba4\u7684\u6b67\u4e49\u3002AxisProxy.js:178-181 \u6302\u7740 PENDING: For historical reason, the option design is partially incompatible: \u2026 (Currently using minValueSpan\/maxValueSpan.)\u3002\u4fee\u6cd5：\u4e00\u6574\u7aef\u5168\u7528\u767e\u5206\u6bd4\u3001\u53e6\u4e00\u6574\u7aef\u5168\u7528\u503c，\u6216\u8005\u5e72\u8106\u53ea\u7528\u4e00\u79cd；\u8981\u590d\u73b0\u5c31\u7167\u7b2c\u4e8c\u5341\u8282\u90a3\u4e24\u6863\u5199\u3002<\/p>\n

\u5751 9：'2024-01-01' \u8fd9\u79cd\u65e5\u671f\u4e32\u5dee 8 \u5c0f\u65f6，\u800c useUTC \u6551\u4e0d\u4e86\u4f60<\/p>\n

util\/number.js:441-446：\u6ca1\u6709\u65f6\u533a\u540e\u7f00\u5c31\u6309\u672c\u5730\u89e3\u91ca；:454-459 \u5e26 Z \u6216\u504f\u79fb\u624d\u8d70 Date.UTC（\u6ce8\u91ca\u89e3\u91ca\u4e0d\u80fd\u7528 new Date，\u56e0\u4e3a\u590f\u4ee4\u65f6\u4f1a\u8ba9\u504f\u79fb\u81ea\u5df1\u8df3）；:464 \u6570\u5b57\u539f\u6837\u5f53\u6beb\u79d2\u3002\u7b2c\u5341\u4e5d\u8282 \u2463\u2464 \u540c\u4e00\u4efd\u6570\u636e\u53ea\u5dee\u5199\u6cd5：'2023-06-01' \u90a3\u6863\u751f\u6548\u7a97 1685548800000\u3001\u753b\u9762\u4e0a 366 \u884c，\u6beb\u79d2\u90a3\u6863 1685577600000\u3001367 \u884c，\u4e2d\u95f4\u6b63\u597d\u5dee 28800000 ms = 8 \u5c0f\u65f6（\u672c\u673a UTC+8）\u3002\u800c useUTC:true \u53ea\u6539\u523b\u5ea6\u5207\u5728\u54ea\u4e00\u5206\u949f（scale\/Time.js:92 \u7684 _useUTC \u53ea\u88ab getTicks \u7528），\u7a97\u53e3\u56db\u952e\u4e00\u4e2a\u5b57\u8282\u90fd\u4e0d\u52a8（\u2465 \u4e24\u6863\u5bf9\u7167）\u3002\u4fee\u6cd5：\u8de8\u65f6\u533a\u7684\u770b\u677f\u91cc startValue \u7edf\u4e00\u5199\u5e26 Z \u7684\u4e32\u6216\u7edf\u4e00\u5199\u6beb\u79d2，\u522b\u6df7\u3002<\/p>\n

\u5751 10：\u8f74\u4e0a\u53ea\u6709\u4e00\u6839\u6570\u636e，\u7f29\u7565\u56fe\u7cca\u51fa\u4e00\u4e32 NaN<\/p>\n

\u7b2c\u4e8c\u5341\u8282 \u2468：\u53ea\u5582\u4e00\u884c\u6570\u636e\u65f6 time \u8f74 6 \u4e2a NaN\u3001category \u8f74 0 \u4e2a\u3002\u5f0f\u5b50\u5728 SliderZoomView.js:285-286\u2014\u2014\u7c7b\u76ee\u90a3\u4e00\u652f\u5199\u4e86 Math.max(1, data.count() – 1)，\u65f6\u95f4\u90a3\u4e00\u652f size[0] \/ (x\u6700\u5927 \u2212 x\u6700\u5c0f) \u6ca1\u6709\u515c\u5e95，\u4e8e\u662f 300 \u00f7 0 = Infinity\u3001\u518d\u4e58 0 \u5f97 NaN，\u843d\u76d8\u6210 <polygon points="300 0 0 0 NaN 15">\u3002\u6ce8\u610f\u574f\u7684\u8303\u56f4：\u6298\u7ebf\u672c\u4f53\u3001x \u8f74\u523b\u5ea6\u3001\u6ed1\u5757\u624b\u67c4\u3001\u8f74\u533a\u95f4\u5168\u90fd\u6b63\u5e38，\u53ea\u6709\u7f29\u7565\u56fe\u574f\u3002\u4fee\u6cd5\u4e24\u6761：showDataShadow:false，\u6216\u7ed9 x \u8f74\u5199 min\/max \u8ba9\u5b83\u6709\u8de8\u5ea6\u3002<\/p>\n

\u5751 11：timeline \u4e0d\u5199 axisType，\u5e27\u540d\u7cca\u6210\u4e00\u4e32 NaN<\/p>\n

TimelineModel.js:162 \u7684\u9ed8\u8ba4\u503c\u662f 'time'，\u4e0d\u662f 'category'\u3002\u63a2\u9488\u73b0\u573a\u4e09\u6863（tools\/__probe\/ch20ctl.mjs）：\u4ec0\u4e48\u90fd\u4e0d\u5199 \u21d2 axisType="time"\u300123 \u4e2a NaN；\u5199 EC2 \u9057\u7559\u7684 type:'number' \u21d2 \u88ab preprocessor \u6362\u6210 axisType:"value" \u5e76 delete type\u300114 \u4e2a NaN；\u53ea\u6709\u8001\u5b9e\u5199 axisType:'category' \u624d 0 \u4e2a\u3002\u7b2c\u4e8c\u5341\u4e00\u8282\u90a3\u4e24\u672c\u8d26\u62c6\u5f97\u5f00：14 = \u4e09\u679a\u523b\u5ea6\u70b9\u5404 3 \u4e2a（matrix(6,0,0,6,NaN,NaN) \u4e24\u4e2a + ecmeta_data_index="NaN" \u4e00\u4e2a）9 \u4e2a + \u68c0\u67e5\u70b9 2 \u4e2a + \u4e09\u679a\u6807\u7b7e 3 \u4e2a；23 = \u540c\u4e00\u6279 11 \u4e2a\u5c5e\u6027 + \u4e09\u679a\u6807\u7b7e\u5404\u5370 NaN:NaN:NaN NaN（\u4e00\u679a 4 \u4e2a）\u3002\u4fee\u6cd5：\u5e27\u540d\u662f\u5b57\u7b26\u4e32\u5c31\u5199 axisType:'category'，\u522b\u6307\u671b data \u91cc\u7684\u540d\u5b57\u81ea\u89e3\u91ca\u3002<\/p>\n

\u5751 12：controlPosition \u5199\u4e0b\u53bb\u4f1a\u88ab\u642c\u8d70，\u8bfb\u56de\u6765\u4e0d\u662f\u4f60\u7684\u503c<\/p>\n

preprocessor.js:70-80 \u5e72\u4e09\u4ef6\u4e8b：\u628a opt.controlPosition \u642c\u8fdb controlStyle.position（\u524d\u63d0\u662f controlStyle \u91cc\u6ca1\u5199\u8fc7 position）；\u5982\u679c\u642c\u8fc7\u53bb\u7684\u503c\u662f 'none' \u4e14 controlStyle.show \u6ca1\u5199，\u5c31\u6539\u6210 show:false \u5e76\u5220\u6389 controlStyle.position；\u6700\u540e delete opt.controlPosition\u3002\u6240\u4ee5\u63a2\u9488 B \u6863\u5199 controlPosition:'none' \u4e4b\u540e，getOption().timeline.controlPosition \u8bfb\u56de\u6765\u662f\u9ed8\u8ba4\u7684 "left"（\u90a3\u662f TimelineModel.js:171 \u7684 defaultOption，\u4e0d\u662f\u4f60\u5199\u7684），\u771f\u6b63\u7684\u5f00\u5173\u843d\u5728 controlStyle.show:false \u4e0a，fill="#6578ba" \u4ece 4 \u5904\u6389\u5230 1 \u5904\u3002\u66f4\u5751\u7684\u662f\u4e24\u5904\u90fd\u5199：{controlPosition:'none', controlStyle:{show:true}} \u56e0\u4e3a has(controlStyle,'show') \u4e3a\u771f，\u7b2c\u4e8c\u652f\u4e0d\u8fdb，\u4e8e\u662f controlStyle.position \u505c\u5728 'none' \u8fd9\u4e2a\u975e\u6cd5\u503c\u4e0a\u800c\u6309\u94ae\u7167\u753b（\u63a2\u9488 E \u6863）\u3002\u4fee\u6cd5：\u53ea\u7528 controlStyle.position \u4e0e controlStyle.show，\u628a controlPosition \u5f53\u9057\u7559\u952e\u3002<\/p>\n

\u5751 13：inside \u4e0e slider \u90fd\u4e0d\u5199 Index \u65f6，\u5b83\u627e\u4e3b\u4eba\u7684\u89c4\u77e9\u662f\u4e09\u6863，\u4e0d\u662f\u300c\u627e\u540c\u5750\u6807\u7cfb\u300d<\/p>\n

_fillAutoTargetAxisByOrient（DataZoomModel.js:175-236）\u7b2c\u4e00\u6863\u627e\u4e0e\u6ed1\u5757\u5e73\u884c\u7684\u8f74，\u62ff\u5230\u7b2c\u4e00\u6839\u4e4b\u540e\u628a\u540c\u4e00 grid \u91cc\u5176\u5b83\u5e73\u884c\u8f74\u4e00\u8d77\u6302\u4e0a（:206-214）；\u800c gridIndex \u6ca1\u5199\u65f6 getReferringComponents('grid', SINGLE_REFERRING) \u6c38\u8fdc\u8fd4\u56de\u7b2c\u4e00\u5757 grid（util\/model.js:601），\u4e8e\u662f\u300c\u4e24\u5757 grid \u4e0a\u7684\u4e24\u6839 x \u8f74\u300d\u5728\u5e93\u773c\u91cc\u672c\u6765\u5c31\u540c grid \u21d2 \u4e00\u8d77\u88ab\u7f29\u3002\u9ed8\u8ba4\u65b9\u5411\u662f horizontal（:146），\u5b83\u6c38\u8fdc\u5148\u6251 x \u8f74，\u800c\u4e14\u4e0d\u770b type\u2014\u2014value \u8f74\u7167\u6837\u88ab\u6293\u53bb\u7f29\u653e（\u7b2c\u4e8c\u8282\u5b9e\u6d4b \u503c=[15, 45]）\u3002\u4fee\u6cd5：\u4e24\u6839\u4ee5\u4e0a\u8f74\u5c31\u81ea\u5df1\u5199 Index；\u60f3\u53ea\u8ba9\u4e00\u6839\u52a8，\u53e6\u4e00\u6839\u7684 gridIndex \u5199\u5b9e\u3002\u987a\u5e26\u8bb0\u4e00\u7b14：xAxisIndex: [] \u4e0d\u662f\u7b14\u8bef\u800c\u662f\u5408\u6cd5\u5199\u6cd5（:160-162 \u660e\u5199\u7a7a\u6570\u7ec4\u4e5f\u7b97 specified），\u5b83\u9020\u7684\u662f\u4e00\u6839\u300c\u8c01\u90fd\u4e0d\u7ba1\u300d\u7684\u6b7b\u6ed1\u5757（\u7b2c\u5341\u4e03\u8282 \u2463）\u3002<\/p>\n

\u5751 14：\u62ff\u5b57\u8282\u6570\u5f53\u5b9a\u5f8b\u8bfb，\u6216\u8005\u62ff\u843d\u76d8\u7684\u50cf\u7d20\u53cd\u63a8\u516c\u5f0f<\/p>\n

\u672c\u7ae0\u4e24\u6b21\u649e\u4e0a\u540c\u4e00\u4ef6\u4e8b\u3002\u7b2c\u4e00，renderToSVGString() \u6bcf\u6b21\u91cd\u65b0\u5206\u914d zrN-cls-K \u4e0e zrN-cK，\u540c\u4e00\u6863\u5728\u4e24\u4e2a\u8fdb\u7a0b\u91cc\u80fd\u5dee 100 \u5b57\u8282（B0 \u8fd9\u6b21 8149\u3001\u4e0a\u6b21 8256）\u2014\u2014\u6240\u4ee5\u672c\u7ae0\u6240\u6709\u300c\u9010\u5b57\u8282\u76f8\u540c\u300d\u90fd\u5148\u628a\u8fd9\u4e24\u7c7b\u8bb0\u53f7\u5f52\u4e00\u5316，\u5b57\u8282\u6570\u7edd\u4e0d\u8de8\u6863\u6bd4\u3002\u7b2c\u4e8c，\u843d\u76d8\u7684 x \u5750\u6807\u53ea\u6709\u4e00\u4f4d\u5c0f\u6570（zrender\/lib\/svg\/graphic.js:116 \u53d6 scope.compress && getPathPrecision(el)，svg\/helper.js:107-111 \u5728\u7f29\u653e\u4e3a 1 \u65f6\u8fd4\u56de 1 \u4f4d），\u4e8e\u662f 0.824 \u5199\u4f5c 0.8；\u8981\u6838\u5bf9\u516c\u5f0f\u8bf7\u56de\u5230\u6a21\u578b\u5c42\u90a3\u4e32\u539f\u6570，\u522b\u628a\u4e00\u7b14\u53d6\u6574\u5f53\u6210\u4e00\u6761\u5b9a\u5f8b（\u7b2c\u5341\u4e5d\u8282\u672b\u5c3e）\u3002<\/p>\n

\n

\u3010\u5de5\u7a0b\u6587\u4ef6\u3011<\/h3>\n

\u672c\u7ae0\u5728\u9879\u76ee\u91cc\u65b0\u5efa\u4e09\u4e2a\u6587\u4ef6（\u90fd\u5728 file= \u5757\u91cc\u5370\u5168\u4e86，\u8bfb\u8005\u53ef\u539f\u6837\u590d\u5236）：<\/p>\n

ch20\/
\n\u251c\u2500\u2500 min.html \u2190 \u6700\u5c0f\u53ef\u8dd1（147 \u884c）：10 \u4e2a\u6863 + \u6e05\u7a7a\u65e5\u5fd7，\u4e09\u4efd\u8d26\u5e76\u6392\u6253\u5370，\u4e0d fetch
\n\u251c\u2500\u2500 index.html \u2190 \u5341\u4e94\u9762\u677f\u5b9e\u9a8c\u53f0\u9aa8\u67b6（272 \u884c）：15 \u4e2a h2\u300118 \u4e2a\u5bb9\u5668\u3001123 \u4e2a\u6309\u94ae\u300115 \u4e2a\u9ec4\u6846
\n\u2514\u2500\u2500 app.js \u2190 \u8bfb\u6570\u5668\u4e0e\u5341\u4e94\u4e2a\u9762\u677f（2516 \u884c）：\u56fe\u5143\u51e0\u4f55 + \u4e09\u4efd\u8d26 + \u624b\u7b97\u5bf9\u8d26<\/p>\n

\u8dd1\u6cd5：<\/p>\n

node<\/span> tools\/extract.mjs –write<\/span> # \u628a\u672c\u7ae0\u4e09\u4e2a\u4ee3\u7801\u5757\u91cd\u5efa\u6210 code\/ch20\/<\/span>
\nnode<\/span> tools\/serve.mjs # \u9ed8\u8ba4 127.0.0.1:18000<\/span><\/p>\n

\u6253\u5f00 http:\/\/127.0.0.1:18000\/code\/ch20\/index.html\u3002index.html \u5fc5\u987b\u8d70\u670d\u52a1\u5668：app.js \u9876\u4e0a Promise.all \u8981 fetch data\/sales-daily.json（1096 \u884c\u65e5\u9500，2023-01-01 ~ 2025-12-31）\u4e0e data\/demo-stock.json（261 \u5929 K \u7ebf），\u9762\u677f\u4e8c\u3001\u516d\u3001\u4e03\u3001\u5341\u3001\u5341\u4e09\u3001\u5341\u4e94\u8fd9\u516d\u683c\u91cf\u7684\u90fd\u662f\u771f\u6570\u636e\u4e0a\u7684\u884c\u4e3a\u2014\u2014\u7b2c\u5341\u4e09\u8282\u90a3\u672c\u300c\u7a97\u53e3\u4e0b\u6807 [657, 723]\u3001\u7a97\u53e3\u5185 max \u4e0e y \u8f74\u533a\u95f4\u300d\u3001\u7b2c\u5341\u4e5d\u8282\u90a3 8 \u5c0f\u65f6\u3001\u7b2c\u5341\u516d\u8282\u90a3 275 \u4e2a\u9876\u70b9\u3001\u7b2c\u4e8c\u5341\u4e8c\u8282\u90a3\u5f20\u5b63\u5ea6\u8868，\u5168\u9760\u8fd9\u4e24\u4efd\u6587\u4ef6\u3002min.html \u4e00\u4e2a fetch \u90fd\u6ca1\u6709，\u751f\u6210 code\/ \u4e4b\u540e\u53cc\u51fb\u5c31\u80fd\u8dd1\u3002<\/p>\n

app.js \u91cc\u516d\u5904\u503c\u5f97\u5355\u72ec\u6307\u51fa\u6765\u7684\u5199\u6cd5：<\/p>\n

    \n
  • \u6bcf\u6863\u53e6\u5f00\u4e00\u4e2a\u540c\u5c3a\u5bf8\u7684 ssr:true \u5f71\u5b50\u5b9e\u4f8b，\u9ec4\u6846\u53ea\u8bfb\u5b83\u3002pointer-events="visible" \u4e0e ecmeta_* \u8fd9\u4e24\u7c7b\u5c5e\u6027\u53ea\u5728 ssr \u6a21\u5f0f\u4e0b\u624d\u5199（zrender\/lib\/svg\/graphic.js:35-36\u3001zrender\/lib\/svg\/Painter.js:68），\u4e0d\u5efa\u5f71\u5b50\u5b9e\u4f8b\u5c31\u8bfb\u4e0d\u5230\u6ed1\u5757\u90a3\u5957\u5c5e\u6027；\u800c d \u4e0e transform \u4e24\u8fb9\u9010\u5b57\u76f8\u540c，\u6240\u4ee5\u300c\u5c4f\u5e55\u4e0a\u7684\u56fe\u300d\u4e0e\u300c\u9ec4\u6846\u91cc\u7684\u6570\u300d\u4e0d\u4f1a\u5404\u8bf4\u4e00\u5957\u8bdd\u3002\u6863\u4e0e\u6863\u4e4b\u95f4\u5f71\u5b50\u5b9e\u4f8b dispose \u91cd\u5efa，\u4e00\u4e2a\u90fd\u4e0d\u7559\u3002<\/li>\n
  • \u4e09\u4efd\u8d26\u5404\u8bfb\u4e00\u5904：option \u4e0a\u90a3\u56db\u952e\u3001settledOption \u4e0e getRangePropMode()\u3001findRepresentativeAxisProxy().calculateDataWindow()\u3002\u3010\u6700\u5c0f\u53ef\u8dd1\u3011\u90a3\u5341\u6863\u7684\u5dee\u522b\u5168\u5728\u8fd9\u4e09\u884c\u91cc，\u53ea\u8bfb\u7b2c\u4e00\u884c\u7684\u4eba\u4f1a\u4ee5\u4e3a \u2463\u2464\u2466 \u4e09\u6863\u300c\u4ec0\u4e48\u90fd\u6ca1\u53d1\u751f\u300d\u3002<\/li>\n
  • bare() \u5f52\u4e00\u5316\u5728\u524d，\u6bd4\u5b57\u7b26\u4e32\u5728\u540e\u3002\u6240\u6709\u300c\u9010\u5b57\u8282\u76f8\u540c\u300d\u7684\u65ad\u8a00\u53ea\u66ff\u6362 zr\\\\d+-(cls|ani)-\\\\d+ \u4e0e zr\\\\d+-c\\\\d+ \u8fd9\u4e24\u7c7b\u8bb0\u53f7，\u5176\u4f59\u4e00\u4e2a\u5b57\u7b26\u4e0d\u52a8\u2014\u2014\u8868\u4e03\u90a3 33 \u6863\u7684\u5224\u5b9a\u5168\u9760\u5b83（\u5751 14）\u3002<\/li>\n
  • \u78b0\u6a21\u578b\u5c42\u7684\u90a3\u4e00\u884c\u5168\u5305 try\u3002\u6e32\u67d3\u95e8\u7981\u7684\u6c99\u7bb1\u628a getModel() \u505a\u6210\u5047\u6869\u4ef6，\u6240\u4ee5\u6c99\u7bb1\u91cc\u5370\u300c（\u6869\u4ef6\u91cc\u6ca1\u6709\u771f\u6a21\u578b）\u300d\u3001\u6d4f\u89c8\u5668\u91cc\u624d\u6709\u771f\u6570\u3002\u8fd9\u5f20\u6e05\u5355\u4e0a\u7684\u4e1c\u897f\u53ea\u80fd\u53bb\u6d4f\u89c8\u5668\u9a8c\u6536：\u6ed1\u5757\u51e0\u4f55\u3001\u7f29\u7565\u56fe\u9876\u70b9\u5217\u3001settledOption \u4e0e rangePropMode\u3002<\/li>\n
  • \u62bd\u7a00\u4e0e\u6446\u70b9\u5206\u5f00\u6570：shadowShape(svg) \u6570\u7684\u662f polyline\/polygon \u7684\u9876\u70b9，shadowXs(svg) \u53d6\u7684\u662f\u843d\u76d8\u7684 x \u5217（\u4e00\u4f4d\u5c0f\u6570），\u7b2c\u5341\u516d\u8282\u90a3\u672c\u300c549 \u4e2a\u9876\u70b9\u300d\u9760\u524d\u8005\u3001\u7b2c\u5341\u4e5d\u8282\u90a3\u672c\u300c\u4e0d\u7b49\u8ddd\u7684 x \u5217\u300d\u9760\u540e\u8005\u3002<\/li>\n
  • \u5e27\u7684 series \u4e00\u5f8b\u5199\u6210 [{}, {data: [\u2026]}]：_mergeOption \u662f\u6309\u4e0b\u6807\u5408\u5e76\u7684，\u7b2c\u4e8c\u6761\u7cfb\u5217\u624d\u662f\u67f1\u5b50（\u7b2c\u4e8c\u5341\u4e8c\u8282 \u2461）\u3002\u8fd9\u6761\u5728 app.js \u91cc\u662f\u552f\u4e00\u4e00\u5904\u300c\u770b\u7740\u591a\u4f59\u4f46\u4e0d\u80fd\u7701\u300d\u7684\u4ee3\u7801\u3002<\/li>\n<\/ul>\n
    \n

    \u3010\u7ec3\u4e60\u3011<\/h3>\n

    \u7ec3\u4e60 1：\u5148\u624b\u7b97，\u518d\u6309\u4e00\u4e2a\u6309\u94ae\u2014\u2014\u628a\u300c\u503c\u6a21\u5f0f + \u53ea merge \u4e00\u7aef\u300d\u8fd9\u4e24\u4ef6\u4e8b\u649e\u5728\u4e00\u8d77<\/h4>\n

    \u6253\u5f00 code\/ch20\/min.html，\u7167 \u2464 \u90a3\u6863\u7684\u5199\u6cd5\u81ea\u5df1\u52a0\u4e00\u6863 b9：dataZoom:[{type:'slider', xAxisIndex:0, startValue:4, endValue:9}]\u3002\u6309\u4e0b\u53bb\u4e4b\u524d\u5148\u628a\u56db\u884c\u8bfb\u6570\u624b\u7b97\u51fa\u6765：option \u4e0a\u7684 start\/end\u3001settledOption \u4e94\u952e\u3001\u751f\u6548\u7a97\u3001\u753b\u9762\u4e0a\u8fd8\u5269\u51e0\u884c\u3002\u7136\u540e\u7167\u7b2c\u4e94\u8282\u90a3\u9053\u95e8\u518d merge \u4e00\u6b21，\u53ea\u5199 {start:50}\u3002<\/p>\n

    \u6807\u51c6\u7b54\u6848（\u63a2\u9488 tools\/__probe\/ch20ex1.mjs，\u672c\u673a node \u539f\u6587）：\u7b2c\u4e00\u8d9f\u56db\u952e start\/end=[36.36363636363637, 81.81818181818183]\u3001startValue\/endValue=[4, 9]，settled=[null,null,4,9]，rangePropMode=["value","value"]，\u751f\u6548\u7a97 \u503c=[4,9]，\u753b\u9762\u4e0a 6 \u884c = 9 \u2212 4 + 1，x \u8f74\u533a\u95f4 [4,9]\u3001\u523b\u5ea6 6 \u4e2a\u3002\u90a3\u4e24\u4e32\u5c0f\u6570\u5c31\u662f\u7b2c\u4e09\u8282\u90a3\u6761\u5b9a\u5f8b\u7684\u6b63\u9762\u8bc1\u636e：4 \u00f7 11 = 36.36363636363637\u30019 \u00f7 11 = 81.81818181818183，\u5206\u6bcd\u662f\u8de8\u5ea6 11 \u4e0d\u662f\u6839\u6570 12\u3002\u7b2c\u4e8c\u8d9f\u53ea merge \u5de6\u7aef\u4e4b\u540e：\u56db\u952e [50, 81.81818181818183, 6, 9]\u3001settled=[50,null,4,9]\u3001\u6a21\u5f0f\u7ffb\u6210 ["percent","value"]\u3001\u751f\u6548\u7a97 \u503c=[6,9]\u3001\u753b\u9762\u4e0a 4 \u884c\u2014\u2014\u5de6\u7aef round(50% \u00d7 11) = round(5.5) = 6（\u7b2c\u4e09\u8282\u90a3\u6761\u534a\u683c\u5f80\u4e0a\u8fdb），\u53f3\u7aef\u6ca1\u4eba\u78b0\u3001\u8fd8\u662f\u503c\u6a21\u5f0f\u7684 9\u3002\u6ce8\u610f percentInverted \u90a3\u4e00\u680f\u662f 54.545454\u2026：\u751f\u6548\u7a97\u7684\u5de6\u7aef\u662f\u300c\u6298\u6210\u6574\u6570\u4e0b\u6807 6 \u4e4b\u540e\u300d\u7684 6\/11，\u4e0d\u662f\u4f60\u5199\u7684 50\u3002<\/p>\n

    \u7ec3\u4e60 2：\u4eb2\u624b\u9020\u4e00\u6b21\u300c\u540e\u6765\u8005\u767d\u5199\u300d，\u518d\u628a\u5b83\u6cbb\u597d\u2014\u2014\u987a\u624b\u91cf\u4e00\u6b21 replaceMerge \u6cbb\u4e0d\u4e86\u5b83<\/h4>\n

    \u5728 code\/ch20\/app.js \u7684\u9762\u677f\u5341\u4e8c \u2467 \u90a3\u6761\u987a\u5e8f\u4e0a\u8d70\u4e00\u904d：\u5148 setOption({toolbox:{feature:{dataZoom:{}}}, \u2026}) \u5efa\u56fe，\u518d setOption({dataZoom:[{type:'slider', xAxisIndex:0, start:20, end:80}]})\u3002\u9ec4\u6846\u8981\u8bfb\u5230\u4e09\u4ef6\u4e8b：getOption().dataZoom \u957f\u5ea6 3\u3001\u524d\u4e24\u69fd\u662f null \u6d1e\u3001\u4f60\u90a3\u6839\u7684 host=false \u800c\u751f\u6548\u7a97 [0,100]／[0,11]\u3002\u7136\u540e\u56de\u7b54：\u4e3a\u4ec0\u4e48\u6ed1\u5757\u753b\u5f97\u51fa\u6765\u3001\u7a97\u53e3\u5374\u7eb9\u4e1d\u4e0d\u52a8？（\u7b54\u6848\u5728 dataZoomProcessor.js:64-71 \u4e0e AxisProxy.js:271：\u540e\u6765\u8005\u8bfb\u7684\u662f\u4e3b\u4eba\u7684 settledOption\u3002）<\/p>\n

    \u6cbb\u597d\u5b83\u8bf7\u8bd5\u4e09\u6761，\u6bcf\u6761\u7684\u9ec4\u6846\u90fd\u8981\u8bfb\u5230\u751f\u6548\u7a97\u771f\u7684\u53d8\u6210 [20,80]\u3001host=true\u3002\u7b2c\u4e00\u6761\u6700\u7701\u4e8b：\u628a\u90a3\u6839 slider \u5199\u8fdb\u7b2c\u4e00\u4e2a setOption（\u63a2\u9488 E2-3 \u7684\u6e05\u5355\u662f [0] slider host=true\u3001[1] select host=false\u3001[2] select host=true\u2014\u2014\u4e24\u6839\u8f74\u5404\u6709\u5404\u7684\u4e3b\u4eba）\u3002\u7b2c\u4e8c\u6761\u628a\u5b83\u8fde toolbox \u4e00\u8d77\u8bf7\u8d70，\u7b2c\u4e09\u6761\u8ba9 toolbox \u522b\u8ba4\u9886 x \u8f74：<\/p>\n

    \/\/ \u7b2c\u4e8c\u6761：\u8fd9\u4e00\u4efd\u91cc\u6ca1\u6709 toolbox => \u5185\u90e8\u4ef6\u751f\u6210\u5668\u6574\u4e2a\u4e0d\u8d70（Global.js:257）<\/span>
    \nchart.<\/span>setOption<\/span>(<\/span>{<\/span> dataZoom<\/span>:<\/span> [<\/span>{<\/span> type<\/span>:<\/span> 'slider'<\/span>,<\/span> xAxisIndex<\/span>:<\/span> 0<\/span>,<\/span> start<\/span>:<\/span> 20<\/span>,<\/span> end<\/span>:<\/span> 80<\/span> }<\/span>]<\/span> }<\/span>,<\/span> {<\/span> replaceMerge<\/span>:<\/span> [<\/span>'toolbox'<\/span>,<\/span> 'dataZoom'<\/span>]<\/span> }<\/span>)<\/span>;<\/span>
    \n\/\/ \u7b2c\u4e09\u6761：\u53ea\u8ba9 toolbox \u8ba4\u9886 y \u8f74，x \u8f74\u7559\u7ed9\u4f60<\/span>
    \nchart.<\/span>setOption<\/span>(<\/span>{<\/span> toolbox<\/span>:<\/span> {<\/span> feature<\/span>:<\/span> {<\/span> dataZoom<\/span>:<\/span> {<\/span> xAxisIndex<\/span>:<\/span> 'none'<\/span> }<\/span> }<\/span> }<\/span>,<\/span>
    \n dataZoom<\/span>:<\/span> [<\/span>{<\/span> type<\/span>:<\/span> 'slider'<\/span>,<\/span> xAxisIndex<\/span>:<\/span> 0<\/span>,<\/span> start<\/span>:<\/span> 20<\/span>,<\/span> end<\/span>:<\/span> 80<\/span> }<\/span>]<\/span> }<\/span>)<\/span>;<\/span><\/p>\n

    \u518d\u4eb2\u624b\u649e\u4e00\u6b21\u90a3\u6761\u5047\u6cbb\u6cd5：\u628a\u7b2c\u4e8c\u6761\u6539\u6210\u53ea\u5199 replaceMerge:['dataZoom']，\u9ec4\u6846\u4f1a\u539f\u6837\u7ed9\u4f60\u63a2\u9488 E2-4 \u90a3\u4e09\u4e2a\u8bfb\u6570\u2014\u2014host=false\u3001\u4e24\u4e2a null \u6d1e\u3001x \u8f74 [0,11]\u3002\u8bfb\u6cd5：\u5185\u90e8\u4ef6\u4e0d\u662f\u300c\u5efa\u56fe\u65f6\u9020\u597d\u5c31\u518d\u4e5f\u5220\u4e0d\u6389\u300d，\u800c\u662f\u6bcf\u6b21 setOption \u90fd\u91cd\u65b0\u62fc\u8fdb\u6765（Global.js:257 \u2192 internalComponentCreator.js:51-65），\u800c replaceMerge \u8ba4 id \u4e0d\u8ba4\u6765\u6e90；Global.js \u5934\u90e8 Caution \u7684\u7b2c (3) \u6761\u8fd8\u5199\u7740\u300c\u4fdd\u6301\u7ec4\u4ef6\u539f\u6709\u6b21\u5e8f，\u5b81\u53ef\u7559\u6d1e\u300d，\u6240\u4ee5\u8865\u5199\u7684\u90a3\u6839\u6c38\u8fdc\u6392\u5728\u5185\u90e8\u4e24\u6839\u4e4b\u540e\u2014\u2014\u987a\u5e8f\u6b63\u662f\u4e3b\u4eba\u7684\u5224\u636e（\u5751 4）\u3002<\/p>\n

    \u52a0\u5206\u9898：\u5728\u4e0a\u9762\u6bcf\u6761\u8def\u4e0a\u5404\u8dd1\u4e00\u6b21 (chart.getOption().dataZoom || []).filter(Boolean).map(d => d.start)，\u518d\u6545\u610f\u53bb\u6389 filter(Boolean) \u8dd1\u4e00\u6b21，\u628a\u629b\u9519\u90a3\u884c\u7684\u539f\u6587\u6284\u4e0b\u6765\u2014\u2014\u5751 5 \u5c31\u662f\u4f60\u7684\u62a5\u9519\u4fe1\u606f\u3002<\/p>\n

    \u7ec3\u4e60 3：\u628a 8 \u5c0f\u65f6\u90a3\u4e00\u683c\u81ea\u5df1\u9020\u51fa\u6765，\u518d\u7528\u4e00\u884c\u4ee3\u7801\u538b\u56de\u53bb<\/h4>\n

    \u7167\u7b2c\u5341\u4e5d\u8282 \u2463\u2464 \u5199\u4e24\u6863，\u6570\u636e\u7528 data\/sales-daily.json \u4f46 x \u4e00\u5f8b\u5199 +new Date(r.date + 'T00:00:00Z')，xAxis.type:'time'：\u4e00\u6863 startValue:'2023-06-01', endValue:'2024-06-01'，\u4e00\u6863 startValue:new Date('2023-06-01T00:00:00Z').getTime()\u3002\u9ec4\u6846\u8981\u8bfb\u5230 1685548800000 \u4e0e 1685577600000 \u76f8\u5dee 28800000，\u753b\u9762\u4e0a 366 \u4e0e 367\u3002\u7b2c\u4e09\u6b65：\u628a\u7b2c\u4e00\u6863\u7684\u4e24\u4e2a\u4e32\u6539\u6210 '2023-06-01T00:00:00Z' \/ '2024-06-01T00:00:00Z'，\u8bfb\u6570\u5e94\u8be5\u9010\u5b57\u843d\u5230\u7b2c\u4e8c\u6863\u90a3\u4e32\u6beb\u79d2\u4e0a\u3001\u753b\u9762\u4e0a\u53d8\u56de 367\u3002\u8fd9\u4e00\u6b65\u624d\u662f\u7ec3\u4e60\u7684\u5168\u90e8\u76ee\u7684：\u8bc1\u660e 366\/367 \u90a3 1 \u884c\u7684\u5dee\u4e0d\u662f\u820d\u5165\u3001\u662f\u65f6\u533a，\u800c\u4e14\u5b83\u4e00\u884c\u4ee3\u7801\u5c31\u80fd\u6cbb\u3002<\/p>\n

    \u518d\u52a0\u4e00\u6863 useUTC:true \u5bf9\u7167，\u786e\u8ba4\u7a97\u53e3\u56db\u952e\u4e00\u4e2a\u5b57\u8282\u90fd\u4e0d\u53d8（\u53ea\u6709\u523b\u5ea6\u6362\u5230 UTC \u65f6\u523b）\u2014\u2014\u8fd9\u6761\u6700\u5bb9\u6613\u8bb0\u53cd：useUTC \u7ba1\u7684\u662f\u523b\u5ea6\u600e\u4e48\u5207，\u4e0d\u662f\u7a97\u53e3\u600e\u4e48\u7b97\u3002\u6700\u540e\u4e00\u4ef6\u4e8b，\u628a\u8fd9\u5957\u8bfb\u6570\u7684\u601d\u8def\u5199\u6210 assertWindow(chart, expect)，\u7b7e\u540d\u7167 read() \u6284：\u8f93\u5165\u300c\u4f60\u5199\u7684 dataZoom\u300d\u4e0e\u300c\u671f\u671b\u7684\u751f\u6548\u7a97\u300d，\u5185\u90e8\u628a calculateDataWindow \u90a3\u4e00\u884c\u4e0e\u624b\u7b97\u7684 round(p% \u00d7 \u8de8\u5ea6) \u6bd4，\u4e0d\u7b49\u5c31\u629b\u9519\u3002\u7f29\u653e\u662f\u7528\u6237\u64cd\u4f5c\u9a71\u52a8\u7684，\u751f\u4ea7\u5305\u91cc\u6ca1\u4eba\u66ff\u4f60\u6838\u5bf9\u7a97\u53e3\u3002<\/p>\n

    \n

    \u3010\u5c0f\u7ed3\u3011<\/h3>\n

    \u8fd9\u4e00\u7ae0\u8bb2\u4e86\u4e00\u4e2a\u7a97\u53e3\u3001\u4e09\u4efd\u8d26\u3001\u4e24\u5957\u72b6\u6001\u673a\u3002\u7a97\u53e3\u662f dataZoom \u552f\u4e00\u771f\u6b63\u6539\u5199\u7684\u4e1c\u897f，\u5b83\u6302\u5728\u8f74\u4e0a\u800c\u4e0d\u662f\u7cfb\u5217\u4e0a：proxy \u6309\u8f74\u5efa\u3001\u4e00\u6839\u8f74\u53ea\u6709\u4e00\u4e2a，\u5b58\u5728 helper.js:176-196 \u90a3\u5f20\u6309 axisModel.uid \u7d22\u5f15\u7684\u8868\u91cc（dataZoomProcessor.js:64-71），\u6240\u4ee5\u300c\u6ed1\u5757\u62d6\u8fc7\u53bb\u300d\u52a8\u7684\u662f\u90a3\u6839\u8f74\u7684 AxisProxy \u91cc\u90a3\u6247\u7a97，series.data \u90a3\u4e2a\u6570\u7ec4\u4ece\u5934\u5230\u5c3e\u6ca1\u4eba\u78b0\u2014\u2014\u53ef getData().count() \u786e\u5b9e\u6389\u4e86，\u56e0\u4e3a\u5904\u5728 process \u9636\u6bb5\u7684 dataZoomProcessor \u6309 filterMode \u628a\u7a97\u53e3\u5916\u7684\u884c\u5904\u7f6e\u4e86\u4e00\u904d（\u7b2c\u4e00\u3001\u5341\u4e8c\u8282）\u3002\u4e09\u4efd\u8d26\u8981\u5206\u5f00\u8bfb：option \u4e0a\u90a3\u56db\u952e\u662f\u5e93\u7684\u6210\u54c1（dataZoomProcessor.js:120-135 \u5237\u8fdb\u53bb\u7684\u751f\u6548\u7a97），settledOption \u662f\u4f60\u771f\u6b63\u5199\u8fdb\u53bb\u7684\u90a3\u4efd（retrieveRawOption \u90a3\u4e94\u952e），getRangePropMode() \u662f\u6bcf\u4e00\u7aef\u4e0a\u6b21\u7528\u4ec0\u4e48\u952e\u5199\u7684\u3001\u800c\u4e14\u6ca1\u4eba\u78b0\u5c31\u4e0d\u64e6\u3002\u672c\u7ae0\u6240\u6709\u300c\u660e\u660e\u5199\u4e86\u5374\u6ca1\u751f\u6548\u300d\u7684\u5751，\u5168\u53d1\u751f\u5728\u8fd9\u4e09\u4efd\u8d26\u88ab\u5f53\u6210\u4e00\u4efd\u8bfb\u7684\u5730\u65b9\u3002<\/p>\n

    \u7b97\u672f\u53ea\u6709\u4e09\u6761，\u8bf7\u80cc\u4e0b\u6765\u3002round(\u767e\u5206\u6bd4 \u00d7 \u8de8\u5ea6)：\u5206\u6bcd\u662f max \u2212 min，12 \u6839\u7c7b\u76ee\u662f 11\u30011096 \u5929\u662f 1095，\u53d6\u6574\u53ea\u6709 Math.round \u4e00\u6761，\u300c\u4e0a\u754c\u5411\u4e0a\u3001\u4e0b\u754c\u5411\u4e0b\u300d\u90a3\u53e5\u8001\u8bdd\u5728\u7c7b\u76ee\u8f74\u4e0e\u65f6\u95f4\u8f74\u4e0a\u90fd\u4e0d\u6210\u7acb（\u7b2c\u4e09\u3001\u4e03\u3001\u4e8c\u5341\u4e8c\u8282）\u3002asc() \u6298\u7a97：\u4e24\u7aef\u5199\u53cd\u4e0d\u62a5\u9519，AxisProxy.js:169-170 \u628a\u4e24\u4e2a\u6570\u7ec4\u90fd\u6392\u5e8f（\u7b2c\u56db\u8282）\u3002\u4e3b\u4eba\u53ea\u6709\u4e00\u4e2a：\u540c\u4e00\u6839\u8f74\u4e0a\u5148\u5230\u8005\u79f0\u738b，\u540e\u6765\u8005\u7684 settledOption \u7167\u7559\u3001\u751f\u6548\u7a97\u7167\u8bfb\u4e3b\u4eba\u7684（\u7b2c\u5341\u4e03\u8282，toolbox \u90a3\u4e24\u6839\u5185\u90e8 select \u8ba9\u8fd9\u6761\u5b9a\u5f8b\u53d8\u5f97\u5f88\u75bc，\u7b2c\u5341\u516b\u8282）\u3002\u51e0\u4f55\u53e6\u6709\u4e24\u6761\u95ed\u5f0f\u5b9a\u5f8b（\u7b2c\u5341\u56db\u8282）\u548c\u7f29\u7565\u56fe\u7684\u56db\u6761（\u7b2c\u5341\u516d\u8282），\u5b83\u4eec\u8bfb\u7684\u952e\u662f orient\u3001defaultLocationEdgeGap\u3001right\/top\/width\/height \u90a3\u56db\u4e2a 'ph'\u3001brushSelect（\u5b83\u51b3\u5b9a\u62d6\u52a8\u6761\u90a3 7 \u50cf\u7d20\u7b97\u4e0d\u7b97\u8fdb\u7ec4\u9876，SliderZoomView.js:136-137）\u2014\u2014filterMode \u4e4b\u7c7b\u7ba1\u6570\u636e\u7684\u952e\u4e00\u4e2a\u90fd\u5f71\u54cd\u4e0d\u5230\u5b83\u4eec\u3002<\/p>\n

    \u53e6\u4e00\u534a\u6536\u83b7\u662f\u8bfb\u76d8\u7684\u65b9\u6cd5：inside \u4e0e show:false \u64a4\u6389\u7684\u662f\u753b\u9762\u4e0d\u662f\u6548\u529b，\u6240\u4ee5\u300c\u770b\u4e0d\u89c1\u300d\u548c\u300c\u6ca1\u6709\u6548\u300d\u8981\u5206\u5f00\u9a8c；\u300c\u9010\u5b57\u8282\u76f8\u540c\u300d\u5fc5\u987b\u5148\u5f52\u4e00\u5316 zrN-cls-K；\u843d\u76d8\u5750\u6807\u53ea\u6709\u4e00\u4f4d\u5c0f\u6570，\u522b\u62ff\u5b83\u53cd\u63a8\u516c\u5f0f；get \u8bfb\u5f97\u5230\u4e0d\u80fd\u8bc1\u660e\u952e\u5b58\u5728，\u5f97\u770b\u5b98\u65b9\u540d\u5355\u52a0\u300c\u6539\u4e86\u5b83\u843d\u76d8\u53d8\u4e0d\u53d8\u300d（\u8868\u4e03\u90a3 33 \u6863\u5c31\u662f\u5e72\u8fd9\u4ef6\u4e8b\u7684）；\u800c NaN \u4e5f\u4e0d\u662f\u552f\u4e00\u7684\u574f\u6d88\u606f\u2014\u2014\u96f6\u8de8\u5ea6\u65f6\u53ea\u6709\u7f29\u7565\u56fe\u574f，timeline \u5e27\u540d\u7cca\u6389\u65f6 23 \u4e2a NaN \u91cc\u6709 12 \u4e2a\u5728\u6807\u7b7e\u6587\u672c\u91cc\u3002<\/p>\n

    timeline \u90a3\u4e00\u534a\u548c dataZoom \u516c\u7528\u4e00\u5957\u300c\u7ec4\u4ef6\u2014\u8f74\u2014\u7a97\u53e3\u300d\u7684\u9aa8\u67b6，\u4f46\u5b83\u7ba1\u7684\u662f\u5e27\u4e0d\u662f\u884c：\u5e27\u662f {baseOption, options} \u7684\u6309\u4e0b\u6807\u5408\u5e76，currentIndex \u5199\u8fdb option \u4e0d\u5939\u3001\u8d70\u52a8\u4f5c\u624d\u5939，\u5e27\u540d\u663e\u793a\u6210\u4ec0\u4e48\u5f52 axisType \u7ba1（\u9ed8\u8ba4 'time'，\u8fd9\u662f\u672c\u7ae0\u6700\u8d35\u7684\u4e00\u4e2a\u9ed8\u8ba4\u503c）\u3002\u8bb0\u4f4f\u300c\u5e27\u662f\u5408\u5e76\u3001\u7a97\u53e3\u662f\u56de\u586b\u3001\u4e3b\u4eba\u53ea\u6709\u4e00\u4e2a\u300d，\u7f29\u653e\u4e0e\u64ad\u653e\u8fd9\u4e24\u5957\u72b6\u6001\u673a\u5c31\u4e0d\u4f1a\u4e92\u76f8\u6253\u67b6（\u7b2c\u4e8c\u5341\u4e00\u3001\u4e8c\u5341\u4e8c\u8282）\u3002\u4e0b\u4e00\u7ae0\u79bb\u5f00\u4ea4\u4e92，\u56de\u5230\u753b\u9762：color \u7684\u8c03\u8272\u677f\u4ece\u54ea\u6765\u3001visualMap \u600e\u4e48\u628a\u503c\u6620\u5c04\u6210\u89c6\u89c9，\u7b2c 21 \u7ae0\u89c1\u3002<\/p>\n

    \u672c\u7bc7\u5b8c\u3002\u7b2c 20 \u7ae0\u5230\u6b64\u7ed3\u675f\u3002<\/p>\n","protected":false},"excerpt":{"rendered":"

    \u672c\u7bc7\u662f\u7b2c 20 \u7ae0\u7684\u7b2c 3\/3 \u7bc7，\u63a5\u4e0a\u7bc7\u300a\u7b2c 20 \u7ae0 \u7f29\u653e\u4e0e\u65f6\u95f4：dataZoom \u4e0e timeline（\u4e2d）：\u5b9e\u9a8c\u53f0（\u4e0a）：index.html\u3001app.js\u300b\u3002（\u4ee3\u7801\u63a5\u4e0a\u7bc7）
    \n\/* \u9762\u677f\u516b：slider \u7684\u4e24\u6761\u51e0\u4f55\u5b9a\u5f8b（\u7b2c\u5341\u56db\u8282） *\/function initPanel8() {va<\/p>\n","protected":false},"author":2,"featured_media":118385,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[1],"tags":[994,87],"topic":[],"class_list":["post-118386","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-server","tag-echarts","tag-87"],"yoast_head":"\n\u300aECharts\u5165\u95e8\u300b\u7b2c 20 \u7ae0 \u7f29\u653e\u4e0e\u65f6\u95f4\uff1adataZoom \u4e0e timeline\uff08\u4e0b\uff09\uff1a\u5b9e\u9a8c\u53f0\uff08\u4e0b\uff09\uff5e\u5c0f\u7ed3 - \u7f51\u7855\u4e92\u8054\u5e2e\u52a9\u4e2d\u5fc3<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.wsisp.com\/helps\/118386.html\" \/>\n<meta property=\"og:locale\" content=\"zh_CN\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"\u300aECharts\u5165\u95e8\u300b\u7b2c 20 \u7ae0 \u7f29\u653e\u4e0e\u65f6\u95f4\uff1adataZoom \u4e0e timeline\uff08\u4e0b\uff09\uff1a\u5b9e\u9a8c\u53f0\uff08\u4e0b\uff09\uff5e\u5c0f\u7ed3 - \u7f51\u7855\u4e92\u8054\u5e2e\u52a9\u4e2d\u5fc3\" \/>\n<meta property=\"og:description\" content=\"\u672c\u7bc7\u662f\u7b2c 20 \u7ae0\u7684\u7b2c 3\/3 \u7bc7，\u63a5\u4e0a\u7bc7\u300a\u7b2c 20 \u7ae0 \u7f29\u653e\u4e0e\u65f6\u95f4：dataZoom \u4e0e timeline（\u4e2d）：\u5b9e\u9a8c\u53f0（\u4e0a）：index.html\u3001app.js\u300b\u3002（\u4ee3\u7801\u63a5\u4e0a\u7bc7） \/* \u9762\u677f\u516b：slider \u7684\u4e24\u6761\u51e0\u4f55\u5b9a\u5f8b（\u7b2c\u5341\u56db\u8282） *\/function initPanel8() {va\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.wsisp.com\/helps\/118386.html\" \/>\n<meta property=\"og:site_name\" content=\"\u7f51\u7855\u4e92\u8054\u5e2e\u52a9\u4e2d\u5fc3\" \/>\n<meta property=\"article:published_time\" content=\"2026-10-26T19:48:36+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.wsisp.com\/helps\/wp-content\/uploads\/2026\/10\/20261026194834-6adfae9265ffe.png\" \/>\n<meta name=\"author\" content=\"admin\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"\u4f5c\u8005\" \/>\n\t<meta name=\"twitter:data1\" content=\"admin\" \/>\n\t<meta name=\"twitter:label2\" content=\"\u9884\u8ba1\u9605\u8bfb\u65f6\u95f4\" \/>\n\t<meta name=\"twitter:data2\" content=\"47 \u5206\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\/\/www.wsisp.com\/helps\/118386.html\",\"url\":\"https:\/\/www.wsisp.com\/helps\/118386.html\",\"name\":\"\u300aECharts\u5165\u95e8\u300b\u7b2c 20 \u7ae0 \u7f29\u653e\u4e0e\u65f6\u95f4\uff1adataZoom \u4e0e timeline\uff08\u4e0b\uff09\uff1a\u5b9e\u9a8c\u53f0\uff08\u4e0b\uff09\uff5e\u5c0f\u7ed3 - \u7f51\u7855\u4e92\u8054\u5e2e\u52a9\u4e2d\u5fc3\",\"isPartOf\":{\"@id\":\"https:\/\/www.wsisp.com\/helps\/#website\"},\"datePublished\":\"2026-10-26T19:48:36+00:00\",\"dateModified\":\"2026-10-26T19:48:36+00:00\",\"author\":{\"@id\":\"https:\/\/www.wsisp.com\/helps\/#\/schema\/person\/358e386c577a3ab51c4493330a20ad41\"},\"breadcrumb\":{\"@id\":\"https:\/\/www.wsisp.com\/helps\/118386.html#breadcrumb\"},\"inLanguage\":\"zh-Hans\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/www.wsisp.com\/helps\/118386.html\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/www.wsisp.com\/helps\/118386.html#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"\u9996\u9875\",\"item\":\"https:\/\/www.wsisp.com\/helps\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"\u300aECharts\u5165\u95e8\u300b\u7b2c 20 \u7ae0 \u7f29\u653e\u4e0e\u65f6\u95f4\uff1adataZoom \u4e0e timeline\uff08\u4e0b\uff09\uff1a\u5b9e\u9a8c\u53f0\uff08\u4e0b\uff09\uff5e\u5c0f\u7ed3\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/www.wsisp.com\/helps\/#website\",\"url\":\"https:\/\/www.wsisp.com\/helps\/\",\"name\":\"\u7f51\u7855\u4e92\u8054\u5e2e\u52a9\u4e2d\u5fc3\",\"description\":\"\u9999\u6e2f\u670d\u52a1\u5668_\u9999\u6e2f\u4e91\u670d\u52a1\u5668\u8d44\u8baf_\u670d\u52a1\u5668\u5e2e\u52a9\u6587\u6863_\u670d\u52a1\u5668\u6559\u7a0b\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/www.wsisp.com\/helps\/?s={search_term_string}\"},\"query-input\":\"required name=search_term_string\"}],\"inLanguage\":\"zh-Hans\"},{\"@type\":\"Person\",\"@id\":\"https:\/\/www.wsisp.com\/helps\/#\/schema\/person\/358e386c577a3ab51c4493330a20ad41\",\"name\":\"admin\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"zh-Hans\",\"@id\":\"https:\/\/www.wsisp.com\/helps\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/gravatar.wp-china-yes.net\/avatar\/?s=96&d=mystery\",\"contentUrl\":\"https:\/\/gravatar.wp-china-yes.net\/avatar\/?s=96&d=mystery\",\"caption\":\"admin\"},\"sameAs\":[\"http:\/\/wp.wsisp.com\"],\"url\":\"https:\/\/www.wsisp.com\/helps\/author\/admin\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"\u300aECharts\u5165\u95e8\u300b\u7b2c 20 \u7ae0 \u7f29\u653e\u4e0e\u65f6\u95f4\uff1adataZoom \u4e0e timeline\uff08\u4e0b\uff09\uff1a\u5b9e\u9a8c\u53f0\uff08\u4e0b\uff09\uff5e\u5c0f\u7ed3 - \u7f51\u7855\u4e92\u8054\u5e2e\u52a9\u4e2d\u5fc3","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.wsisp.com\/helps\/118386.html","og_locale":"zh_CN","og_type":"article","og_title":"\u300aECharts\u5165\u95e8\u300b\u7b2c 20 \u7ae0 \u7f29\u653e\u4e0e\u65f6\u95f4\uff1adataZoom \u4e0e timeline\uff08\u4e0b\uff09\uff1a\u5b9e\u9a8c\u53f0\uff08\u4e0b\uff09\uff5e\u5c0f\u7ed3 - \u7f51\u7855\u4e92\u8054\u5e2e\u52a9\u4e2d\u5fc3","og_description":"\u672c\u7bc7\u662f\u7b2c 20 \u7ae0\u7684\u7b2c 3\/3 \u7bc7，\u63a5\u4e0a\u7bc7\u300a\u7b2c 20 \u7ae0 \u7f29\u653e\u4e0e\u65f6\u95f4：dataZoom \u4e0e timeline（\u4e2d）：\u5b9e\u9a8c\u53f0（\u4e0a）：index.html\u3001app.js\u300b\u3002（\u4ee3\u7801\u63a5\u4e0a\u7bc7） \/* \u9762\u677f\u516b：slider \u7684\u4e24\u6761\u51e0\u4f55\u5b9a\u5f8b（\u7b2c\u5341\u56db\u8282） *\/function initPanel8() {va","og_url":"https:\/\/www.wsisp.com\/helps\/118386.html","og_site_name":"\u7f51\u7855\u4e92\u8054\u5e2e\u52a9\u4e2d\u5fc3","article_published_time":"2026-10-26T19:48:36+00:00","og_image":[{"url":"https:\/\/www.wsisp.com\/helps\/wp-content\/uploads\/2026\/10\/20261026194834-6adfae9265ffe.png"}],"author":"admin","twitter_card":"summary_large_image","twitter_misc":{"\u4f5c\u8005":"admin","\u9884\u8ba1\u9605\u8bfb\u65f6\u95f4":"47 \u5206"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/www.wsisp.com\/helps\/118386.html","url":"https:\/\/www.wsisp.com\/helps\/118386.html","name":"\u300aECharts\u5165\u95e8\u300b\u7b2c 20 \u7ae0 \u7f29\u653e\u4e0e\u65f6\u95f4\uff1adataZoom \u4e0e timeline\uff08\u4e0b\uff09\uff1a\u5b9e\u9a8c\u53f0\uff08\u4e0b\uff09\uff5e\u5c0f\u7ed3 - \u7f51\u7855\u4e92\u8054\u5e2e\u52a9\u4e2d\u5fc3","isPartOf":{"@id":"https:\/\/www.wsisp.com\/helps\/#website"},"datePublished":"2026-10-26T19:48:36+00:00","dateModified":"2026-10-26T19:48:36+00:00","author":{"@id":"https:\/\/www.wsisp.com\/helps\/#\/schema\/person\/358e386c577a3ab51c4493330a20ad41"},"breadcrumb":{"@id":"https:\/\/www.wsisp.com\/helps\/118386.html#breadcrumb"},"inLanguage":"zh-Hans","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.wsisp.com\/helps\/118386.html"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/www.wsisp.com\/helps\/118386.html#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"\u9996\u9875","item":"https:\/\/www.wsisp.com\/helps"},{"@type":"ListItem","position":2,"name":"\u300aECharts\u5165\u95e8\u300b\u7b2c 20 \u7ae0 \u7f29\u653e\u4e0e\u65f6\u95f4\uff1adataZoom \u4e0e timeline\uff08\u4e0b\uff09\uff1a\u5b9e\u9a8c\u53f0\uff08\u4e0b\uff09\uff5e\u5c0f\u7ed3"}]},{"@type":"WebSite","@id":"https:\/\/www.wsisp.com\/helps\/#website","url":"https:\/\/www.wsisp.com\/helps\/","name":"\u7f51\u7855\u4e92\u8054\u5e2e\u52a9\u4e2d\u5fc3","description":"\u9999\u6e2f\u670d\u52a1\u5668_\u9999\u6e2f\u4e91\u670d\u52a1\u5668\u8d44\u8baf_\u670d\u52a1\u5668\u5e2e\u52a9\u6587\u6863_\u670d\u52a1\u5668\u6559\u7a0b","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.wsisp.com\/helps\/?s={search_term_string}"},"query-input":"required name=search_term_string"}],"inLanguage":"zh-Hans"},{"@type":"Person","@id":"https:\/\/www.wsisp.com\/helps\/#\/schema\/person\/358e386c577a3ab51c4493330a20ad41","name":"admin","image":{"@type":"ImageObject","inLanguage":"zh-Hans","@id":"https:\/\/www.wsisp.com\/helps\/#\/schema\/person\/image\/","url":"https:\/\/gravatar.wp-china-yes.net\/avatar\/?s=96&d=mystery","contentUrl":"https:\/\/gravatar.wp-china-yes.net\/avatar\/?s=96&d=mystery","caption":"admin"},"sameAs":["http:\/\/wp.wsisp.com"],"url":"https:\/\/www.wsisp.com\/helps\/author\/admin"}]}},"_links":{"self":[{"href":"https:\/\/www.wsisp.com\/helps\/wp-json\/wp\/v2\/posts\/118386","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.wsisp.com\/helps\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.wsisp.com\/helps\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.wsisp.com\/helps\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/www.wsisp.com\/helps\/wp-json\/wp\/v2\/comments?post=118386"}],"version-history":[{"count":0,"href":"https:\/\/www.wsisp.com\/helps\/wp-json\/wp\/v2\/posts\/118386\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.wsisp.com\/helps\/wp-json\/wp\/v2\/media\/118385"}],"wp:attachment":[{"href":"https:\/\/www.wsisp.com\/helps\/wp-json\/wp\/v2\/media?parent=118386"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.wsisp.com\/helps\/wp-json\/wp\/v2\/categories?post=118386"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.wsisp.com\/helps\/wp-json\/wp\/v2\/tags?post=118386"},{"taxonomy":"topic","embeddable":true,"href":"https:\/\/www.wsisp.com\/helps\/wp-json\/wp\/v2\/topic?post=118386"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}