forked from apache/echarts
-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
289 lines (269 loc) · 19.9 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
<!DOCTYPE html>
<html lang="zh-cn">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="ECharts">
<meta name="author" content="[email protected]">
<title>ECharts · Home</title>
<link rel="shortcut icon" href="./doc/asset/ico/favicon.png">
<link href="./doc/asset/css/font-awesome.min.css" rel="stylesheet">
<link href="./doc/asset/css/bootstrap.css" rel="stylesheet">
<link href="./doc/asset/css/carousel.css" rel="stylesheet">
<link href="./doc/asset/css/echartsHome.css" rel="stylesheet">
<!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body>
<img id="logo" src="doc/asset/img/logo.png" style="display:none;" alt="">
<!-- Fixed navbar -->
<div class="navbar navbar-default navbar-fixed-top" role="navigation" id="head"></div>
<!-- Carousel
================================================== -->
<div id="myCarousel" class="carousel slide" data-ride="carousel">
<!-- Indicators -->
<ol class="carousel-indicators">
<li data-target="#myCarousel" data-slide-to="0"></li>
<li data-target="#myCarousel" data-slide-to="1"></li>
<li data-target="#myCarousel" data-slide-to="2"></li>
<li data-target="#myCarousel" data-slide-to="3"></li>
<li data-target="#myCarousel" data-slide-to="4"></li>
<li data-target="#myCarousel" data-slide-to="5" class="active"></li>
<li data-target="#myCarousel" data-slide-to="6"></li>
</ol>
<div class="carousel-inner">
<div class="item">
<img src="./doc/asset/img/slide-01.png" alt="ECharts"/>
</div>
<div class="item">
<img src="./doc/asset/img/slide-02.png" alt="ECharts"/>
<div class="container">
<div class="carousel-caption" style="bottom:0;left:25%">
<p style="text-align:left;">
<a class="btn btn-lg btn-warning" href="./doc/example.html#gauge" role="button">查看 »</a>
</p>
</div>
</div>
</div>
<div class="item">
<img src="./doc/asset/img/slide-03.png" alt="ECharts"/>
<div class="container">
<div class="carousel-caption" style="bottom:0;left:25%">
<p style="text-align:left;">
<a class="btn btn-lg btn-warning" href="./doc/example/bar12.html" role="button">查看 »</a>
</p>
</div>
</div>
</div>
<div class="item">
<img src="./doc/asset/img/slide-04.png" alt="ECharts"/>
<div class="container">
<div class="carousel-caption" style="bottom:0;left:25%">
<p style="text-align:left;">
<a class="btn btn-lg btn-warning" href="./doc/example/theme.html" role="button">查看 »</a>
</p>
</div>
</div>
</div>
<div class="item">
<img src="./doc/asset/img/slide-05.jpg" alt="百度图说"/>
<div class="container">
<div class="carousel-caption" style="bottom:0;left:25%">
<p style="text-align:left;">
<a class="btn btn-lg btn-warning" href="http://tushuo.baidu.com" role="button" target="_blank">了解更多 »</a>
</p>
</div>
</div>
</div>
<div class="item active">
<img src="./doc/asset/img/bannerStudy.png" alt="ECharts基础教程" style="width:100%;left:0;margin:0"/>
<div class="container">
<div class="carousel-caption ecx-link">
<a href="http://study.163.com/course/courseMain.htm?courseId=1016007" target="_blank">了解更多 »</a>
</div>
</div>
</div>
<div class="item">
<img src="./doc/asset/img/bannerX.jpg" alt="ECharts-X" style="width:100%;left:0;margin:0"/>
<div class="container">
<div class="carousel-caption ecx-link">
<a href="http://echarts.baidu.com/x/doc/index.html" target="_blank">了解更多 »</a>
</div>
</div>
</div>
</div>
<a class="left carousel-control" href="#myCarousel" data-slide="prev"><span class="glyphicon glyphicon-chevron-left"></span></a>
<a class="right carousel-control" href="#myCarousel" data-slide="next"><span class="glyphicon glyphicon-chevron-right"></span></a>
</div><!-- /.carousel -->
<!-- Marketing messaging and featurettes
================================================== -->
<!-- Wrap the rest of the page in another container to center all the content. -->
<div class="container marketing">
<h1 class="text-center" style="margin-bottom:30px;">让数据说话</h1>
<!-- Three columns of text below the carousel -->
<div class="row">
<div class="col-lg-4">
<img class="col-lg-12" src="doc/asset/img/feature1.png" alt="Echarts 拖拽重计算" style="margin-bottom:20px"/>
<h2>拖拽重计算</h2>
<p class="text-left">　　拖拽重计算特性（专利）带来了数据统计图表从未有过的用户体验，允许用户对统计数据进行有效的提取、整合，甚至在多个图表间交换数据，赋予了用户对数据进行挖掘、整合的能力。</p>
</div><!-- /.col-lg-4 -->
<div class="col-lg-4">
<img class="col-lg-12" src="doc/asset/img/feature2.png" alt="Echarts 数据视图" style="margin-bottom:20px"/>
<h2>大规模数据模式</h2>
<p class="text-left">　　如何展现成千上百万的数据？貌似除了用专业的统计工具（如MATLAB）外别无选择？不，在拥有众多交互特性下ECharts依然可以做到直角系图表（折、柱、散点、K线）20万数据秒级出图。</p>
</div><!-- /.col-lg-4 -->
<div class="col-lg-4">
<img class="col-lg-12" src="doc/asset/img/feature3.png" alt="Echarts 值域漫游" style="margin-bottom:20px"/>
<h2>值域漫游</h2>
<p class="text-left">　　基于坐标的图表（如地图、散点图）通过色彩变化表现数值的大小能直观形象的展示数据分布。但如何聚焦到我所关心的数值上？ECharts拥有值域漫游的功能，让你可以轻松进行数值筛选。</p>
</div><!-- /.col-lg-4 -->
<p class="pull-right"><a href="doc/feature.html">更多 »</a></p>
</div><!-- /.row -->
<div class="row featurette thx">
<h1 class="text-center">感谢有你</h1>
<div class="col-lg-4">
<blockquote>
<p>“ ECharts是中国的，也是世界的。”</p>
<br/>
<small><i class="fa fa-weibo"></i> <a href="http://weibo.com/shearwarp" target="_blank">浙江大学教授 · 陈为</a></small>
</blockquote>
</div>
<div class="col-lg-4">
<blockquote>
<p>“ 期待ECharts 2.0让数据更生动，图表更闪耀，交互更友好，使用更便捷。”</p>
<small><i class="fa fa-weibo"></i> <a href="http://weibo.com/u/1688425190" target="_blank">AdMaster CTO · 洪倍</a></small>
</blockquote>
</div>
<div class="col-lg-4">
<blockquote>
<p>“ ECharts，发现数据可视化之美！”</p>
<br/>
<small><i class="fa fa-weibo"></i> <a href="http://weibo.com/shenhaolaoshi" target="_blank">中国传媒大学教授 · 沈浩</a></small>
</blockquote>
</div>
<div class="col-lg-6">
<blockquote>
<p>“ ECharts是我接触过的最优秀的可视化工具，也是进步最快的软件，希望它早日成为世界级的开源项目。”</p>
<small><i class="fa fa-weibo"></i> <a href="http://weibo.com/u/2006785117" target="_blank">财新传媒CTO · 黄志敏</a></small>
</blockquote>
</div>
<div class="col-lg-6">
<blockquote>
<p>“ 根据我们多年的国内外图表工具使用经验，ECharts完胜所有免费图表工具，媲美最优秀收费图表软件的好东东。”</p>
<small><i class="fa fa-weibo"></i> <a href="http://weibo.com/tiemuyu" target="_blank">水清木华总经理 · 余杰</a></small>
</blockquote>
</div>
<div class="col-lg-5">
<blockquote>
<p>“ ECharts是一款开源、功能强大的数据可视化产品，紧跟着大数据时代的步伐！希望ECharts在未来继续发扬开源的力量，让国内外更多的人用上这款数据可视化产品，为企业、社会创造更大的价值。”</p>
<small><i class="fa fa-weibo"></i> <a href="http://weibo.com/DataScientistUnion" target="_blank">数盟社区创始人 · 兴宝</a></small>
</blockquote>
</div>
<div class="col-lg-4">
<blockquote>
<p>“ ECharts开放、大气、优雅， 1.0就很赞了，更新很快，2.0更是惊艳。我身边的一些美帝朋友们也不辞劳苦，用在线翻译来学习ECharts！”</p>
<small><i class="fa fa-weibo"></i> <a href="http://weibo.com/cosname/" target="_blank">统计之都创始人 · 谢益辉</a></small>
</blockquote>
</div>
<div class="col-lg-3">
<blockquote>
<p>“ ECharts代表了新一代的大数据可视化基础库，希望能早日完善对移动平台的支持，帮助企业将大数据玩于指尖。”</p>
<small><i class="fa fa-weibo"></i> <a href="http://weibo.com/austinhu" target="_blank">海智CTO · 胡嵩</a></small>
</blockquote>
</div>
<div class="col-md-12 user text-center">
<a href="http://www.baidu.com" target="_blank" ><img src="http://www.baidu.com/img/baidu_jgylogo3.gif" alt="到百度首页" title="到百度首页"></a>
<a href="http://dev2.baidu.com/index.do" target="_blank" ><img src="http://dev2.baidu.com/zh/img/zh-logo.jpg" alt="百度商业开发者中心" title="百度商业开发者中心"></a>
<a href="http://zhanzhang.baidu.com/" target="_blank" ><img src="http://zhanzhang.baidu.com/static/img/zhanzhang_logo.png" alt="百度站长平台" title="百度站长平台"></a>
<a href="http://adm.baidu.com/index.html" target="_blank" ><img src="doc/asset/img/logo/adm_logo.png"></a>
<a href="http://jiaoyu.baidu.com/mp/index" target="_blank" ><img src="http://vs-static.baidu.com/edu/newjuhe/asset/img/logo137.png"></a>
<a href="http://jiankang.baidu.com/" target="_blank" ><img src="doc/asset/img/logo/health_logo.png"></a>
<a href="http://wenku.baidu.com/" target="_blank" ><img src="http://static.wenku.bdimg.com/static/widget/common/header/search_box/images/logo-wk-137-46_3164f22b.png"></a>
<a href="http://hui.baidu.com/" target="_blank" ><img src="doc/asset/img/logo/hui_logo.png" alt="百度汇" title="百度汇"></a>
<a href="http://yuedu.baidu.com/" target="_blank" ><img src="http://static.wenku.bdimg.com/static/widget/common/read/header/images/read_logo_657abbba.png"></a>
<a href="http://sd.baidu.com/zh/" target="_blank" ><img src="doc/asset/img/logo/sd_logo.png"></a>
<a href="http://renqi.baidu.com/" target="_blank" ><img src="doc/asset/img/logo/renqi_logo.png" style="background-color: #0d5ab1"></a>
<a href="http://trends.baidu.com/" target="_blank" ><img src="http://trends.baidu.com/static/trends-index/widget/header/top_logo_b308a5a.png" style="background-color: #264597"></a>
<a href="http://www.stats.gov.cn/english/" target="_blank" ><img src="http://www.stats.gov.cn/english/images/name.png" style="background-color: #015FA5"></a>
<a href="http://www.admaster.com.cn/" target="_blank" ><img src="doc/asset/img/logo/admaster_logo.png"></a>
<a href="http://www.mi.com/" target="_blank" ><img src="http://img03.mifile.cn/webfile/images/2014/cn/icon/site-logo.png"></a>
<a href="http://www.miaozhen.com/" target="_blank" ><img src="http://www.miaozhen.com/style/images/GW_logo.jpg"></a>
<a href="http://www.semidata.com/index.php" target="_blank" ><img src="http://datavisualization.miaozhen.com/SemiData_logo.png"></a>
<a href="http://www.sgcc.com.cn/" target="_blank" ><img src="http://www.sgcc.com.cn/images/header/header_logo_0106.png"></a>
<a href="http://www.piccnet.com.cn/" target="_blank" ><img src="doc/asset/img/logo/picc_logo.gif"></a>
<a href="http://www.sinopec.com/" target="_blank" ><img src="doc/asset/img/logo/sinopec_logo.gif"></a>
<a href="http://www.lenovo.com.cn/" target="_blank" ><img src="http://img.hc360.com/printing/info/images/200812/200812161055278334.jpg"></a>
<a href="http://www.huawei.com/cn/" target="_blank" ><img src="doc/asset/img/logo/huawei_logo.jpg"></a>
<a href="http://www.dangdang.com/" target="_blank" ><img src="http://img4.ddimg.cn/00012/dang/logo_dd.gif"></a>
<a href="http://lashou.com/" target="_blank" ><img src="http://s1.lashouimg.com/static/img/index/logo02.png"></a>
<a href="http://www.vip.com/" target="_blank" ><img src="http://pic.iresearch.cn/news/201304/635018302584062500.jpg"></a>
<a href="http://tv.pptv.com/" target="_blank" ><img src="http://photocdn.sohu.com/20120207/Img334013169.jpg"></a>
<a href="http://www.caixin.com/" target="_blank" ><img src="doc/asset/img/logo/caixin_logo.png"></a>
<a href="http://www.jjckb.cn/" target="_blank" ><img src="doc/asset/img/logo/xinhuanet_logo.gif"></a>
<a href="http://news.sina.com.cn/" target="_blank" ><img src="http://i2.sinaimg.cn/dy/deco/2012/0613/yocc20120613img01/news_logo.png"></a>
<!--a href="http://news.qq.com/newspedia/all.htm" target="_blank" ><img src="http://mat1.gtimg.com/news/newspedia/images/news_baike.png"></a-->
<a href="http://news.qq.com/" target="_blank" ><img src="doc/asset/img/logo/qqnews_logo.jpg"></a>
<a href="http://mp.weixin.qq.com/s?__biz=MjM5MTQzNzU2NA==&mid=200577643&idx=1&sn=09a5a468fb76af4fb1b1155e63c61ab0#rd" target="_blank" ><img src="http://t1.qpic.cn/mblogpic/89bd83e9c419b39a3e06/460.jpg"></a>
<a href="http://www.shujubang.com/index.html" target="_blank" ><img src="doc/asset/img/logo/shujubang_logo.png"></a>
<a href="http://www.futureweather.cn/" target="_blank" ><img src="http://www.qx17.cn/_c_xKeZGQlsF8eHtUZXc63DP_L01zSR_ao8biwTU2VFqcomEOG4im0Ghomh19TkUeP7kimak9lDWS8Y-8dld2ohLx9bWw6ag9Gu.png"></a>
<a href="http://www.ctrip.com/" target="_blank" ><img src="http://pic.c-ctrip.com/common/c_logo2013_2x.png"></a>
<a href="http://www.jinjianginns.com/" target="_blank" ><img src="doc/asset/img/logo/jinjiang_logo.jpg"></a>
<a href="http://www.51job.com/default.php" target="_blank" ><img src="http://img01.51jobcdn.com/im/2009/logo/logo2009.gif"></a>
<a href="http://www.alibaba.com/new_user_guide.html" target="_blank" ><img src="http://company.zhaopin.com/CompanyLogo/20080514/49F73DB7F6DF4AA486280906822B3E46.gif"></a>
<a href="http://www.yonyou.com/" target="_blank" ><img src="doc/asset/img/logo/yongyou_logo.jpg"></a>
<a href="http://www.pactera.com/" target="_blank" ><img src="http://www.pactera.com/wp-content/themes/pactera/images/buttons/logo-menu.png"></a>
<a href="http://shujuguan.cn/" target="_blank" ><img src="doc/asset/img/logo/shujuguan_logo.png"></a>
<div style="font-weight: bolder">...</div>
</div>
</div>
<div class="row featurette" style="padding-bottom: 0;">
<div class="col-md-12">
<h1 class="text-primary" style="margin-bottom: 20px;"><small>大数据时代</small><br/><strong>重新定义数据图表的时候到了</strong></h1>
<p class="lead">　　我们只是尽我们所能为你呈现数据<span class="text-primary">真实</span>的一面，并且提供了一些直观、易用的交互方式以方便你对所展现数据进行<span class="text-primary">挖掘、提取、修正或整合</span>，让你可以更加<span class="text-primary">专注</span>于你所关心地方，无论是系列选择、区域缩放还是数值筛选，让你可以有<span class="text-primary">不同的方式解读同样的数据</span>。</p>
</div>
<div class="col-md-12">
<p class="lead" style="margin-bottom: 0;">　　浏览<span class="text-primary">ECharts</span>所输出的图表，你不再只是个“读者”，你可以参与其中，这就是<span class="text-primary">ECharts</span>，我们正在打造的一个拥有<strong class="text-primary">互动图形用户界面（GUI）</strong>的数据可视化工具。</p>
</div>
</div>
<div class="jumbotron">
<h1 style="font-size: 80px;margin-bottom:30px;">现在就出发!</h1>
<a class="btn btn-large btn-warning" href="./doc/start.html"><i class="fa fa-paper-plane"></i> Get started</a>
</div>
<!-- /END THE FEATURETTES -->
<div class="row featurette e-list" style="padding-bottom: 0;">
<p>开源的ECharts来自百度<a href="http://efe.baidu.com/">EFE</a>数据可视化团队。在<a href="http://efe.baidu.com/">EFE</a>，我们还有其他开源产品：</p>
<dl>
<dt><a target="_blank" href="https://github.com/ecomfe/esl">ESL</a></dt>
<dd>比Require.js更精简、更高效、更健壮的AMD Loader。</dd>
<dt><a target="_blank" href="http://ecomfe.github.io/etpl/">ETpl</a></dt>
<dd>强复用、灵活、高性能的JavaScript模板引擎。</dd>
<dt><a target="_blank" href="http://ecomfe.github.io/edp/">EDP</a></dt>
<dd>提供了前端开发时常用工具：项目管理、包管理、调试、构建、代码生成、代码检测等，并允许用户自定义扩展。</dd>
<dt><a target="_blank" href="https://github.com/ecomfe/er">ER</a></dt>
<dd>富浏览器端 web 应用的框架，适用于并能很方便地构建一个整站式的 AJAX web 应用。</dd>
<dt><a target="_blank" href="https://github.com/ecomfe/esui">ESUI</a></dt>
<dd>一套功能完善，并具有强大扩展机制的 UI 组件库。基于模板、声明式地编程方式让视图更具表达能力。</dd>
<dt><a target="_blank" href="http://ecomfe.github.io/est/">EST</a></dt>
<dd>基于 Less 的样式工具库，提供了一系列方便快捷的 mixin，只在调用时才输出代码。</dd>
<dt><a target="_blank" href="https://github.com/ecomfe/saber">Saber</a></dt>
<dd>提供了 JavaScript 模块、CSS 样式库与开发平台的完整前端解决方案。擅长移动端 SPA 项目、轻应用。</dd>
<dt><a target="_blank" href="https://github.com/ecomfe/rider">Rider</a></dt>
<dd>专为移动端设计的 Mixin 风格样式工具库。在其基础上创建了 Rider UI，一个灵活的 UI 样式库。</dd>
<dt><a target="_blank" href="http://efe.baidu.com/">......</a></dt>
</dl>
</div>
</div><!-- /.container -->
<!-- FOOTER -->
<footer id="footer"></footer>
<!-- Bootstrap core JavaScript
================================================== -->
<!-- Placed at the end of the document so the pages load faster -->
<script src="./doc/asset/js/jquery.min.js"></script>
<script type="text/javascript" src="./doc/asset/js/echartsHome.js"></script>
<script src="./doc/asset/js/bootstrap.min.js"></script>
</body>
</html>