echarts吧_百度贴吧
签到排名：今日本吧第个签到，
本吧因你更精彩，明天继续来努力！
本吧排名：
本吧签到人数：0
可签7级以上的吧50个
本月漏签0次！
成为超级会员，赠送8张补签卡
连续签到：天&&累计签到：天
超级会员单次开通12个月以上，赠送连续签到卡3张
解决各种问题、欢迎大家提问。
一个8 一个3 可以分开显示吗
新开天龙发布网,今日天龙新区天龙发布网!
在做Echarts时,地图的滚轮缩放功能出现问题,如图,一个是一开始进去时候初始化完的图，用滚轮滚动时，这
用settimeout动态刷新图表，内存不断增加，时间久了会内存溢出，浏览器崩溃，包括官网上的这个例子http://
如题，如果折线图的x轴为时间是，设置了max，min时间，横坐标的label只显示起始时间和结束时间，以及中
因为项目需要和要求,就模拟了下迁徙图，发现IE8下打开会有问题，报一个 painter.getLayer(...)' 为空或不是
我想修改toolbox内鼠标悬停后显示的文字字体，如何设置？我之前设置全局的文字字体，只有toolbox内没有生
求助就是图中有三天线，要求每条线上的每个折点都显示对应的数据，且点击任意一个点对应的线上的所
为什么echarts中option下的graphic不起作用
echarts3 地图文字错乱 我想调整文字位置 有什么属性可以用么？ 急急急！！！！！ 跪求大神~~~~~~~~~~~~
如图，如果Y1轴有负数在图上自己给我标了个 0 值的X，我想要 X轴是以Y0轴的0值做标定，求助如何处理
点击事件在谷歌下也执行 就是在IE下不执行，必须双击才能执行，求大神指导
如图，当有负值的时候，3个Y轴的0坐标点不在一条X轴上，显得就特别难看。
一站式国内电竞商城，提供专业h1z1，csgo，刀塔2等饰品交易服务。
echarts 图标无数据时的气泡动画怎么去掉
如图所示，两个y轴的零点不在同一水平，有没人知道的，求助！！
做了一个demo，用ECharts引入百度地图，但是在ie8中不显示，其他浏览器显示正常，有没有大神帮忙解决一下
欢迎大家问问题，还有大家一般什么时候会来这贴吧啊？ 有问题的时候么？
如图，折点只显示y坐标值，怎么设置呢，不胜感激
默认显示为图1： 我要的效果为图2： 我想要这样的图2的效果，可是我修改了如果这里要这样显示，图1右
同上，急切的恳求啊啊啊。。。
怎么能让提示线贯穿折线图和柱状图呢？dom是一个容器
想实现这样的效果，但是本地制作的时候，一直loading 这个是为什么呢，二楼贴程序
我用echarts2.0下载的地图，但是默认不显示县级，是不是要设置什么属性啊
就是那些横着的一排一排的小圆点
代码在官网显示的效果 代码在自己代码中显示的效果 问一下这个是为什么呢？同样的代码
大神们，怎么实现上图的效果，还有就是提示框中的那么多数值怎么实现呀？
如题 求大神
echarts地图上通过按钮动态添加了散点和线图，想通过一个按钮动态删除这个散点和线图，怎么修改？添加
我用的是官网下载的最新版本的echarts.js文件，我的路径是&script src=&__PUBLIC__/Admin/echarts-2.2.7/build/dist/e
echarts地图怎么只显示大区，不显示省份，只显示成如华北地区、东北地区、西北地区、华南地区等这样的
你好，我想问一下在Echarts3中有coolDown属性吗？为什么我在Echarts2中看到 但Echarts3没有找到。求大神告知！
各位大哥大姐，有遇到过下面这个图形效果吗？求教
如下图官网实例中，想要点击点击“搜索引擎”，之后手动输入文本“ *** ”，该如何实现？求大神指点，
var citysArray = new Array(); var access = new Object(); access.name=&杭州市&; access.value= 5904; citysArray.push(access); var
关系图双向箭头 一个2个投资在两边 一个却在一边重叠了 怎么解决
比如默认的是（0，0），我现在想设置成（1，1），有知道的吗
项目需要，然后不知道怎么添加，也就是在每个省份中显示一个柱状效果图，来显示每个省份中的某项数据
鼠标放上去能看到数据，但是没有线条~~下面是部分代码 这是哪里的问题？控制台的错误：
如题，用ECharts的map创建了一个地图，然后用markpoint放置了几个城市，都是自己定义的，效果图如下 然后我想实现一个功能，就是点击一个markpoint，
其他都可以出来，就是pie死活不出来 myChart.setOption(option); var img = myChart.getDataURL(); $(&#img&).attr('src',
如图，我这个使用统计论坛热帖的热度，但是标题比较长，想显示全名，但是y轴比较窄，如何显示全？
我从官网上下了34个省的js，现在能够下钻到市，但是市到区的就不知道该怎么弄了。 &/script& &div id=
想做成这个样子的 可是我的水平就只做出来了个框框而已，没有里面的具体每个街道，下面是我的代码，
我的X轴Type是time。
发贴红色标题
签到六倍经验
兑换本吧会员
赠送补签卡1张，获得
助攻总额: 43W
发表后自动分享本贴
使用签名档&ECharts - 数据图表的使用 - 简书
ECharts - 数据图表的使用
关于ECharts（）
ECharts 是百度提供的一款开源、功能强大的数据可视化产品。主要提供折线图、柱状图、散点图、K线图、饼图、雷达图、地图、和弦图、力导向布局图、仪表盘以及漏斗图。
拖拽重计算
炫光特效……
下载 ECharts 静态包，也可以直接使用链接进行加载。建议下载静态包，避免官方 更新新特性 时造成图表无法正常呈现的问题。
ECharts的使用很简单，以官方提供的为例分为下面几步：
新建一个 test.html 并放置一个 div 来承载图表：
&!DOCTYPE html&
&html lang="en"&
&meta charset="UTF-8"&
&title&Document&/title&
&div id="main" style="height: 400"&&/div&
引入 echarts.js ：
&script src="/build/dist/echarts.js"&&/script&
添加模块加载器配置 echarts 和所需图表的路径（相对路径为从当前页面链接到echarts.js），引入图表文件见：
&script type="text/javascript"&
// 路径配置
require.config({
echarts: '/build/dist'
动态加载echarts和所需图表，回调函数中可以初始化图表并驱动图表的生成，option见：
'echarts',
'echarts/chart/bar' // 使用柱状图就加载bar模块，按需加载
function (ec) {
// 基于准备好的dom，初始化echarts图表
var myChart = ec.init(document.getElementById('main'));
var option = {
tooltip: {
show: true
data:['销量']
type : 'category',
data : ["衬衫","羊毛衫","雪纺衫","裤子","高跟鞋","袜子"]
type : 'value'
series : [
"name":"销量",
"type":"bar",
"data":[5, 20, 40, 10, 10, 20]
// 为echarts对象加载数据
myChart.setOption(option);
最后的样子：
重点- option 部分相关配置说明
用户可以在 option 配置里自定义图标的样式。
title 标题：
text: '某地区蒸发量和降水量',
subtext: '纯属虚构'
toolbox 便捷的工具：
toolbox: {
show : true,
//是否显示工具栏
feature : {
mark : {show: true},
dataView : {show: true, readOnly: false},
//数据视图
magicType : {show: true, type: ['line', 'bar']},
//切换视图（折线/柱状）
restore : {show: true},
//重新加载视图
saveAsImage : {show: true}
//保存该视图为图片
series 数据列表：series : [
name:'蒸发量',
type:'bar',
//视图类型
data:[2.0, 4.9, 7.0, 23.2, 25.6, 76.7, 135.6, 162.2, 32.6, 20.0, 6.4, 3.3],
markPoint : {
{type : 'max', name: '最大值'},
//最大值，name为显示文本
{type : 'min', name: '最小值'}
//最小值，name为显示文本
markLine : {
{type : 'average', name: '平均值'}
//平均值，name为显示文本
xAxis ： X 轴
yAxis ： Y 轴
orient : 'vertical',
//方向“垂直”，默认从左向右横向排列
x : 'left',
//位于 X 轴左侧，默认顶部居中
data:['直接访问','邮件营销','联盟广告','视频广告','搜索引擎']
//显示文本
更多配置可在中点开测试。
「 心有猛虎，细嗅蔷薇 」
[ http://jovey-zheng.git...还没有帐号？ 赶紧
文章日志用户版块群组帖子
QT5.5/5.6和Echarts混合开发实现动态报表（举例地图报表）
UID：168364
在线时间7小时
金钱140威望24贡献值0好评度14
本帖被 XChinux 执行加亮操作()
通过QT5.5/5.6和Echarts混合开发例子实现将分布在全国各地的系统用户数量统计出来，以地图的形式展示出每个地域的用户数量，用户点击全国地图中的各个省区域时，能够打开各省地图，在各省地图上的地市区域上以不同的颜色着色，显示地域的用户量情况。当鼠标移到相应的地市上面还会显示相应的数据。先展示下最终实现效果。具体例子讲解请看博文《》， 链接地址： =700) window.open('http://img.blog.csdn.net/52875?watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQv/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/Center');" style="max-width:700max-height:700" onload="if(is_ie6&&this.offsetWidth>700)this.width=700;" >
UID：134955
在线时间38小时
金钱532威望61贡献值0好评度51
欢迎和业界人士一起交流。一起成长。
在线时间203小时
金钱4366威望475贡献值0好评度429
UID：164304
在线时间356小时
金钱2831威望143贡献值7好评度133
Qt技术交流：QQ
UID：169400
在线时间40小时
金钱491威望39贡献值0好评度29
有源码吗，那个echarts的option怎么获取的？
UID：169400
在线时间40小时
金钱491威望39贡献值0好评度29
回 姜小白 的帖子
:[表情] [表情] [表情]  ( 17:20) 有源码吗，那个echarts的option怎么获取的？
访问内容超出本站范围，不能确定是否安全
限100 字节
您目前还是游客，请
&回复后跳转到最后一页
Powered by & Copyright Time now is:02-19 02:09 &
版权所有 Gzip disabled2499人阅读
数据可视化（Echarts&D3js）（18）
springmvc+echarts实现图表
两种方法实现的效果都一样，不过针对此图的话，感觉方法2更好。
Echarts:参照的例子：
&/doc/example/radar1.html
下面只是关键代码：具体看源码
http://download.csdn.net/detail/u71341
方法1.直接把所需数据传到jsp页面中的js中;
controller类：
* @param request
* 在前端js实现图表
@RequestMapping(&/showRadio&)
public ModelAndView showRadio(HttpServletRequest request)
List&AllocatedBudget& list = service.addInfo();
String strContext =JSON.toJSONString(list);
System.out.println(strContext);
request.setAttribute(&strContext&,strContext);
return new ModelAndView(&/radio1&);
&%@ page language=&java& import=&java.util.*& pageEncoding=&UTF-8&%&
String path = request.getContextPath();
String basePath = request.getScheme()+&://&+request.getServerName()+&:&+request.getServerPort()+path+&/&;
request.setAttribute(&home&, path);
&!DOCTYPE HTML PUBLIC &-//W3C//DTD HTML 4.01 Transitional//EN&&
&base href=&&%=basePath%&&&
&title&雷达图&/title&
&h2&雷达图&/h2&
&div id=&myRadio&
style=&height:400px&&&/div&
&script type=&text/javascript& src=&${home }/res/js/echarts.js&&&/script&
&script type=&text/javascript& src=&${home }/res/js/macarons.js&&&/script&
&script type=&text/javascript&&
var home =&${home}&;
//获取到的数据
var context =eval('${strContext}');
//名称数组
var nameArray = new Array();
//数据数组
var dataArray= new Array();
//将数据进行处理
for(var i=0;i&context.i++)
nameArray.push(context[i].planName);
//二维数组- 保存数据
dataArray[i]= new Array();
dataArray[i].push(context[i].sales);
dataArray[i].push(context[i].administration);
dataArray[i].push(context[i].informationTechology);
dataArray[i].push(context[i].customerSupport);
dataArray[i].push(context[i].development);
dataArray[i].push(context[i].marketing);
require.config(
echarts:'res/js'
'echarts',
'echarts/chart/radar',
'echarts/chart/line'
, function(ec)
var myChart =ec.init(document.getElementById(&myRadio&));
option = {
text: '预算 vs 开销 vs我的开销（Budget vs spending）',
subtext: '纯属虚构'
tooltip : {
trigger: 'axis'
orient : 'vertical',
x : 'right',
y : 'bottom',
data:nameArray//['预算分配（Allocated Budget）','实际开销（Actual Spending）']
toolbox: {
show : true,
feature : {
mark : {show: true},
dataView : {show: true, readOnly: false},
restore : {show: true},
saveAsImage : {show: true}
indicator :
{ text: '销售（sales）', max: 6000},
{ text: '管理（Administration）', max: 16000},
{ text: '信息技术（Information Techology）', max: 30000},
{ text: '客服（Customer Support）', max: 38000},
{ text: '研发（Development）', max: 52000},
{ text: '市场（Marketing）', max: 25000}
calculable : true,
series : [
name: '预算 vs 开销（Budget vs spending）',
type: 'radar',
value:dataArray[0],
name:nameArray[0]
value:dataArray[1],
name:nameArray[1]
value:dataArray[2],
name:nameArray[2]
myChart.setOption(option);
&script type=&text/javascript& src=&${home }/res/js/jquery.1.7.2.min.js&&&/script&
&script type=&text/javascript& src=&${home }/res/js/jquery-1.11.3.min.js&&&/script&
方法2.在类中生成类似js代码，转换成JSON字符串后传入到jsp页面中
关键jar包：ECharts-2.2.6.jar&
下载及介绍地址：http://git.oschina.net/free/ECharts#git-readme （根据百度Echarts的一个开源项目，感谢作者）
RadarServiceImpl.java
package com.echarts.service.
import java.util.ArrayL
import java.util.L
import org.springframework.beans.factory.annotation.A
import org.springframework.stereotype.S
import com.echarts.dao.RadarD
import com.echarts.entity.AllocatedB
import com.echarts.service.RadarS
import com.github.abel533.echarts.O
import com.github.abel533.echarts.P
import com.github.abel533.echarts.code.O
import com.github.abel533.echarts.code.T
import com.github.abel533.echarts.code.T
import com.github.abel533.echarts.code.X;
import com.github.abel533.echarts.code.Y;
import com.github.abel533.echarts.data.D
import com.github.abel533.echarts.feature.DataV
import com.github.abel533.echarts.feature.M
import com.github.abel533.echarts.feature.R
import com.github.abel533.echarts.feature.SaveAsI
import com.github.abel533.echarts.json.FsonO
import com.github.abel533.echarts.series.R
* @author lyx
* 上午9:04:04
*com.echarts.service.impl.RadarServiceImpl
@Service(&RadarService&)
public class RadarServiceImpl implements RadarService{
@Autowired
private RadarD
public List&AllocatedBudget& addInfo() {
// TODO Auto-generated method stub
return dao.addInfo();
public FsonOption radarOption() {
//获得数据
List&AllocatedBudget& list = dao.addInfo();
//option设置
FsonOption option =new FsonOption();
option.title(&预算 vs 开销 vs 我的开销（Budget vs spending）&, &纯属虚构&);
option.tooltip(Trigger.axis);
option.legend().orient(Orient.vertical).x(X.right).y(Y.bottom);//.data(&预算分配（Allocated Budget）&,&实际开销（Actual Spending）&,&我的开销&);
//图例说明
for (AllocatedBudget alloc: list) {
option.legend().data().add(alloc.getPlanName());
option.toolbox().show(true).feature(Tool.mark, Tool.dataView, Tool.restore, Tool.saveAsImage);
option.calculable(true);
Polar polar = new Polar();
polar.indicator(new Data().text(&销售（sales）&).max(6000),
new Data().text(&管理（Administration）&).max(16000),
new Data().text(&信息技术（Information Techology）&).max(30000),
new Data().text(&客服（Customer Support）&).max(38000),
new Data().text(&研发（Development）&).max(52000),
new Data().text(&市场（Marketing）&).max(25000));
option.polar(polar);
Radar radar = new Radar(&预算 vs 开销（Budget vs spending）&);
//雷达图数据
for (AllocatedBudget alloc: list) {
&span style=&white-space:pre&& &/span&radar.data(new Data().name(alloc.getPlanName().toString()).value(alloc.getSales(),alloc.getAdministration(),alloc.getInformationTechology(),alloc.getCustomerSupport(),alloc.getDevelopment(),alloc.getMarketing()));
option.series(radar);
System.out.println(option);
controller方法：
* @param request
* 在dao层的类中实现Option
@RequestMapping(&/radarOption&)
public ModelAndView radarOption(HttpServletRequest request)
FsonOption option = service.radarOption();
request.setAttribute(&option&, option);
return new ModelAndView(&/rect&);
&%@ page language=&java& import=&java.util.*& pageEncoding=&UTF-8&%&
String path = request.getContextPath();
String basePath = request.getScheme()+&://&+request.getServerName()+&:&+request.getServerPort()+path+&/&;
request.setAttribute(&home&, path);
&!DOCTYPE HTML PUBLIC &-//W3C//DTD HTML 4.01 Transitional//EN&&
&base href=&&%=basePath%&&&
&title&雷达图&/title&
&h2&雷达图&/h2&
&div id=&myRadio&
style=&height:400px&&&/div&
&script type=&text/javascript& src=&${home }/res/js/echarts.js&&&/script&
&script type=&text/javascript& src=&${home }/res/js/macarons.js&&&/script&
&script type=&text/javascript&&
var home =&${home}&;
require.config({
echarts:'res/js'
var option = ${option};
'echarts',
'echarts/chart/radar',
'echarts/chart/line'
function(ec)
var myChart =ec.init(document.getElementById(&myRadio&));
myChart.setOption(option);
&script type=&text/javascript& src=&${home }/res/js/jquery.1.7.2.min.js&&&/script&
&script type=&text/javascript& src=&${home }/res/js/jquery-1.11.3.min.js&&&/script&
运行成功的后页面源码：
运行后的js:
var home =&/springEcharts001&;
require.config({
echarts:'res/js'
var option = {&calculable&:true,
&legend&:{&data&:[&预算分配&,&实际开销&,&我的开销&],&orient&:&vertical&,&x&:&right&,&y&:&bottom&},
&polar&:[{&indicator&:[{&max&:6000,&text&:&销售（sales）&},{&max&:16000,&text&:&管理（Administration）&},
{&max&:30000,&text&:&信息技术（Information Techology）&},{&max&:38000,&text&:&客服（Customer Support）&},
{&max&:52000,&text&:&研发（Development）&},{&max&:25000,&text&:&市场（Marketing）&}]}],
&series&:[{&data&:[{&name&:&预算分配&,&value&:[,,]},
{&name&:&实际开销&,&value&:[,,]},
{&name&:&我的开销&,&value&:[00,,10000]}],
&name&:&预算 vs 开销（Budget vs spending）&,&type&:&radar&}],
&title&:{&subtext&:&纯属虚构&,&text&:&预算 vs 开销 vs 我的开销（Budget vs spending）&},
&toolbox&:{&feature&:{&mark&:{&lineStyle&:{&color&:&#1e90ff&,&type&:&dashed&,&width&:2},&show&:true,
&title&:{&mark&:&辅助线开关&,&markClear&:&清空辅助线&,&markUndo&:&删除辅助线&}},
&dataView&:{&lang&:[&数据视图&,&关闭&,&刷新&],&readOnly&:false,&show&:true,&title&:&数据视图&},
&restore&:{&show&:true,&title&:&还原&},&saveAsImage&:{&lang&:[&点击保存&],&show&:true,&title&:&保存为图片&,&type&:&png&}},&show&:true},
&tooltip&:{&trigger&:&axis&}};
'echarts',
'echarts/chart/radar',
'echarts/chart/line'
function(ec)
var myChart =ec.init(document.getElementById(&myRadio&));
myChart.setOption(option);
参考知识库
* 以上用户言论只代表其个人观点，不代表CSDN网站的观点或立场
访问：134939次
积分：2825
积分：2825
排名：第10372名
原创：145篇
转载：47篇
评论：20条
(1)(1)(2)(1)(7)(13)(17)(26)(32)(15)(15)(15)(5)(4)(11)(15)(2)(5)(1)(3)最近在捣鼓各种插件各种框架，发现这个还是比较不错的，文档也挺全的，还是中文的，给大家推荐一下。
这篇文章是零基础入门ECharts图表的教程，先简单介绍一下吧，可能有人还不知道这个东西。
ECharts，缩写来自Enterprise Charts，商业级数据图表，一个纯Javascript的图表库，可以流畅的运行在PC和移动设备上，兼容当前绝大部分浏览器（IE6/7/8/9/10/11，chrome，firefox，Safari等），底层依赖轻量级的Canvas类库ZRender，提供直观，生动，可交互，可高度个性化定制的数据可视化图表。创新的拖拽重计算、数据视图、值域漫游等特性大大增强了用户体验，赋予了用户对数据进行挖掘、整合的能力。
支持折线图（区域图）、柱状图（条状图）、散点图（气泡图）、K线图、饼图（环形图）、雷达图（填充雷达图）、和弦图、力导向布局图、地图、仪表盘、漏斗图、事件河流图等12类图表，同时提供标题，详情气泡、图例、值域、数据区域、时间轴、工具箱等7个可交互组件，支持多图表、组件的联动和混搭展现。
好了，咱们重点不是介绍哈，后面我会详细讲解这个报表系统的使用，这里就不做过多的描述了，下面开始进入正题：“5分钟上手写ECharts的第一个图表”。
【方法一：模块化单文件引入(推荐)】
1. 新建一个echarts.html文件，为ECharts准备一个具备大小(宽高)的Dom：
&!DOCTYPE html&
&meta charset="utf-8"&
&title&ECharts - 孤影'Blog&/title&
&!-- 为ECharts准备一个具备大小（宽高）的Dom --&
&div id="main" style="height:400px"&&/div&
2. 新建&script&标签引入模块化单文件echarts.js：
&!DOCTYPE html&
&meta charset="utf-8"&
&title&ECharts - 孤影'Blog&/title&
&!-- 为ECharts准备一个具备大小（宽高）的Dom --&
&div id="main" style="height:400px"&&/div&
&!-- ECharts单文件引入 --&
&script src="/build/dist/echarts.js"&&/script&
3. 新建&script&标签中为模块加载器配置echarts和所需图表的路径(相对路径为从当前页面链接到echarts.js)：
&!DOCTYPE html&
&meta charset="utf-8"&
&title&ECharts - 孤影'Blog&/title&
&!-- 为ECharts准备一个具备大小（宽高）的Dom --&
&div id="main" style="height:400px"&&/div&
&!-- ECharts单文件引入 --&
&script src="/build/dist/echarts.js"&&/script&
&script type="text/javascript"&
// 路径配置
require.config({
echarts: '/build/dist'
4. &script&标签内动态加载echarts和所需图表，回调函数中可以初始化图表并驱动图表的生成：
&!DOCTYPE html&
&meta charset="utf-8"&
&title&ECharts - 孤影'Blog&/title&
&!-- 为ECharts准备一个具备大小（宽高）的Dom --&
&div id="main" style="height:400px"&&/div&
&!-- ECharts单文件引入 --&
&script src="/build/dist/echarts.js"&&/script&
&script type="text/javascript"&
// 路径配置
require.config({
echarts: '/build/dist'
'echarts',
'echarts/chart/bar' // 使用柱状图就加载bar模块，按需加载
function (ec) {
// 基于准备好的dom，初始化echarts图表
var myChart = ec.init(document.getElementById('main'));
var option = {
tooltip: {
show: true
data:['销量']
type : 'category',
data : ["衬衫","羊毛衫","雪纺衫","裤子","高跟鞋","袜子"]
type : 'value'
series : [
"name":"销量",
"type":"bar",
"data":[5, 20, 40, 10, 10, 20]
// 为echarts对象加载数据
myChart.setOption(option);
5. 浏览器中打开ecarts.html，就可以看到以下效果：
【方法二：标签式单文件引入】
1. 新建一个echarts.html文件，为ECharts准备一个具备大小(宽高)的Dom。
&!DOCTYPE html&
&meta charset="utf-8"&
&title&ECharts - 孤影Blog&/title&
&!-- 为ECharts准备一个具备大小（宽高）的Dom --&
&div id="main" style="height:400px"&&/div&
2. 新建&script&标签引入echart-all.js。
&!DOCTYPE html&
&meta charset="utf-8"&
&title&ECharts - 孤影'Blog&/title&
&!-- 为ECharts准备一个具备大小（宽高）的Dom --&
&div id="main" style="height:400px"&&/div&
&!-- ECharts单文件引入 --&
&script src="/build/dist/echarts-all.js"&&/script&
3. 新建&script&，使用全局变量echarts初始化图表并驱动图表的生成。
&!DOCTYPE html&
&meta charset="utf-8"&
&title&ECharts - 孤影'Blog&/title&
&!-- 为ECharts准备一个具备大小（宽高）的Dom --&
&div id="main" style="height:400px"&&/div&
&!-- ECharts单文件引入 --&
&script src="/build/dist/echarts-all.js"&&/script&
&script type="text/javascript"&
// 基于准备好的dom，初始化echarts图表
var myChart = echarts.init(document.getElementById('main'));
var option = {
tooltip: {
show: true
data:['销量']
type : 'category',
data : ["衬衫","羊毛衫","雪纺衫","裤子","高跟鞋","袜子"]
type : 'value'
series : [
"name":"销量",
"type":"bar",
"data":[5, 20, 40, 10, 10, 20]
// 为echarts对象加载数据
myChart.setOption(option);
4. 浏览器中打开echarts.html，可以看到如下效果：
在文章中找不到问题答案？您还可以
热门栏目订阅