| extends ../layouts/basic |
| |
| block variablesLang |
| include ./_variablesLang.jade |
| |
| block extra_head |
| title Apache ECharts |
| script(src="https://cdn.jsdelivr.net/npm/scrollreveal@4.0.7/dist/scrollreveal.min.js") |
| script(src="https://cdn.jsdelivr.net/npm/lottie-web@5.7.6/build/player/lottie.min.js") |
| |
| block content |
| nav(class='navbar navbar-default navbar-fixed-top', role="navigation") |
| include ./nav |
| |
| .page-main#page-index |
| #main-content |
| section#home-section |
| .home-brand-panel.description.container |
| .home-info |
| .home-brand Apache ECharts |
| .home-subtitle An Open Source JavaScript Visualization Library |
| .home-btn-panel |
| a.btn.btn-main.btn-index-home(href='#{host}/handbook/#{ecWWWLang}/get-started') |
| include ../components/svg/index-learn |
| span Get Started |
| a.btn.btn-main.btn-index-home(href='#{host}/examples/#{ecWWWLang}/index.html') |
| include ../components/svg/index-example |
| span Demo |
| a.btn.btn-main.btn-index-home.btn-index-github(href='https://github.com/apache/echarts', target='_blank') |
| include ../components/svg/github |
| +svgGithub('#081642') |
| .home-landing-animation |
| .home-landing-animation-cover |
| include ../components/svg/entry-pie.svg |
| #play-landing-animation |
| include ../components/svg/play.svg |
| .loading |
| include ../components/svg/loading.svg |
| #home-landing-animation-container |
| #home-landing-animation-viewport |
| #home-landing-animation-close-btn |
| include ../components/svg/close.svg |
| |
| section#new-version-section 📣 Apache ECharts 5.3 is out! See <a href='#{host}/handbook/#{ecWWWLang}/basics/release-note/5-3-0?ref=banner' target='_blank'>what's new</a> |
| |
| section#events-section |
| .container |
| a.event(href='https://apachecon.com/acasia2022/zh/?ref=echarts', style="width: 1000px; margin: 15px auto") |
| picture |
| source.lazy(data-srcset="#{cdnPayRoot}/#{ecWWWLang}/images/event/20220509-acasia2022.webp?_v_=#{cdnPayVersion}", type="image/webp") |
| img.lazy(data-srcset="#{cdnPayRoot}/#{ecWWWLang}/images/event/20220509-acasia2022.png?_v_=#{cdnPayVersion}", type="image/png") |
| //- img.lazy(data-src="#{cdnPayRoot}/#{ecWWWLang}/images/event/20210705-apachecon-en.jpeg?_v_=#{cdnPayVersion}", alt="ApacheCon Asia 2021") |
| |
| section#feature-section |
| .container |
| .index-features |
| h2.reveal Features |
| hr.reveal |
| a.more.reveal(href='#{host}/#{ecWWWLang}/feature.html') View More |
| .row |
| .col-md-6 |
| .index-feature#index-feature-1 |
| .index-feature-left.reveal |
| .index-feature-icon-bg#bg-icon-1 |
| .index-feature-icon#icon-1 |
| .index-feature-right.reveal |
| h3.reveal Flexible Chart Types |
| p.reveal-later Apache ECharts provides more than 20 chart types available out of the box, along with a dozen components, and each of them can be arbitrarily combined to use. |
| .col-md-6 |
| .index-feature#index-feature-2 |
| .index-feature-left.reveal |
| .index-feature-icon-bg#bg-icon-2 |
| .index-feature-icon#icon-2 |
| .index-feature-right |
| h3.reveal Powerful Rendering Engine |
| p.reveal-later Easily switch between Canvas and SVG rendering. Progressive rendering and stream loading make it possible to render 10 million data in realtime. |
| .col-md-6 |
| .index-feature#index-feature-3 |
| .index-feature-left.reveal |
| .index-feature-icon-bg#bg-icon-3 |
| .index-feature-icon#icon-3 |
| .index-feature-right |
| h3.reveal Professional Data Analysis |
| p.reveal-later Manage data through datasets, which support data transforms like filtering, clustering, and regression to help analyze multi-dimensional analysis of the same data. |
| .col-md-6 |
| .index-feature#index-feature-4 |
| .index-feature-left.reveal |
| .index-feature-icon-bg#bg-icon-4 |
| .index-feature-icon#icon-4 |
| .index-feature-right |
| h3.reveal Elegant Visual Design |
| p.reveal-later The default design follows visualization principles, supports responsive design. Flexible configurations make it easy to customize. |
| .col-md-6 |
| .index-feature#index-feature-5 |
| .index-feature-left.reveal |
| .index-feature-icon-bg#bg-icon-5 |
| .index-feature-icon#icon-5 |
| .index-feature-right |
| h3.reveal A Healthy Community |
| p.reveal-later The active open source community ensures the healthy development of the project and contributes a wealth of third-party extensions. |
| .col-md-6 |
| .index-feature#index-feature-6 |
| .index-feature-left.reveal |
| .index-feature-icon-bg#bg-icon-6 |
| .index-feature-icon#icon-6 |
| .index-feature-right |
| h3.reveal Accessibility-Friendly |
| p.reveal-later Automatically generated chart descriptions and decal patterns help users with disabilities understand the content and the stories behind the charts. |
| section#publication |
| .container |
| #start-line |
| .paper |
| .content |
| h2.reveal-latest ECharts: A Declarative Framework for Rapid Construction of Web-based Visualization |
| p.note.reveal-latest You are welcomed to cite the following paper whenever you use ECharts in your R&D projects, products, research papers, technical reports, news reports, books, presentations, teaching, patents, and other related intelligence activities. |
| .single-btn-panel.reveal-latest |
| a(href="http://www.cad.zju.edu.cn/home/vagblog/VAG_Work/echarts.pdf").pdf.reveal-later Visual Informatics, 2018 [PDF] |
| .icon |
| #paper-icon |
| #end-line |
| section.normal#about-section.reveal-about |
| .container |
| h3 Follow |
| hr |
| p Follow us to get more updates in time. |
| .btn-panel.row |
| .col-lg-3.col-sm-6 |
| a#btn-github(href='https://github.com/apache/echarts') |
| .btn-content |
| .btn-logo |
| include ../components/svg/github |
| +svgGithub('#081642') |
| span GitHub |
| .icon-v-right |
| |
| .col-lg-3.col-sm-6 |
| a#btn-weixin |
| .btn-content.zh |
| .btn-logo |
| include ../components/svg/wechart |
| span Wechat |
| .weixin-code |
| img(src="images/ercode.jpg") |
| |
| .col-lg-3.col-sm-6 |
| a#btn-weibo(href='https://weibo.com/echarts') |
| .btn-content |
| .btn-logo |
| include ../components/svg/weibo |
| span Weibo |
| .icon-v-right |
| |
| .col-lg-3.col-sm-6 |
| a#btn-twitter(href='https://twitter.com/ApacheECharts') |
| .btn-content |
| .btn-logo |
| include ../components/svg/twitter |
| span Twitter |
| .icon-v-right |
| include ./footer |
| |
| block extra_js |
| script(type='text/javascript'). |
| window.lazyLoadOptions = { |
| elements_selector: ".lazy" |
| }; |
| script(src='https://cdn.jsdelivr.net/npm/vanilla-lazyload@12.0.0/dist/lazyload.min.js') |
| script(src='#{cdnPayRoot}/#{ecWWWLang}/js/index.js?_v_=#{homeVersion}') |
| //- <script async defer src="https://buttons.github.io/buttons.js"></script> |