extends ../layouts/basic

block extra_head
    title 术语速查手册 - Apache ECharts

block content
    nav(class='navbar navbar-default navbar-fixed-top', role="navigation")
        include ../components/nav

    .page-main
        .page-info
            h1 术语速查手册
            p 快速了解功能名称，帮助定位到配置项手册
            p.page-info-echarts Apache ECharts<sup>TM</sup>

        .page-content.container.page-cheatsheet
            h2 常用组件说明
            #cheat-chart-container
                .row
                    .col-lg-9
                        #cheat-chart
                    .col-lg-3
                        #cheat-detail

            h2 系列类型文档速查
            ul
                each names, key in charts
                    li.cheat-chart-item
                        a(href="option.html#series-#{key}", target="_blank")
                            img(src="#{cdnPayRoot}/#{ecWWWLang}/images/builder/chart/#{key}.svg?_v_=#{cdnPayVersion}", alt="")
                            <h5>#{names[0]}<div>#{names[1]}</div></h5>

            h2 坐标系文档速查
            ul
                each names, key in coords
                    li.cheat-chart-item
                        - var url = key == 'gridSimple' ? 'grid' : key;
                        a(href="option.html##{url}", target="_blank")
                            img(src="#{cdnPayRoot}/#{ecWWWLang}/images/builder/component/#{key}.svg?_v_=#{cdnPayVersion}", alt="")
                            <h5>#{names[0]}<div>#{names[1]}</div></h5>

            h2 组件文档速查
            ul
                each names, key in components
                    li.cheat-chart-item
                        if key == 'markPoint' || key == 'markLine' || key == 'markArea'
                            - var url = 'series-line.' + key
                        else
                            - var url = key
                        a(href="option.html##{url}", target="_blank")
                            img(src="#{cdnPayRoot}/#{ecWWWLang}/images/builder/component/#{key}.svg?_v_=#{cdnPayVersion}", alt="")
                            <h5>#{names[0]}<div>#{names[1]}</div></h5>

        include ../components/footer

block extra_js
    script(type='text/javascript').
        document.getElementById('nav-resources').className = 'active';

    script(src='#{cdnThirdParty.echartsMinJS_4_8_0}')
    script(type='text/javascript', src="#{getAssetUrl(cdnPayRoot, ecWWWLang + '/js/cheat-sheet.js')}")