html心碎粒子特效,echarts2.html

后台登录-X-admin2.2

特别声明：ECharts，一个纯 Javascript 的图表库，可以流畅的运行在 PC 和移动设备上，兼容当前绝大部分浏览器(IE8/9/10/11，Chrome，Firefox，Safari等)，底层依赖轻量级的 Canvas 类库 ZRender，提供直观，生动，可交互，可高度个性化定制的数据可视化图表。如需使用，详细了解可以访问官网 ECharts。 x-admin不承担任何版权问题。

注意：本案例的Echarts图表库由cdn引入，需要在线才能正常使用，如想离线，请至Echarts官网下载。

// 基于准备好的dom，初始化echarts实例

var myChart = echarts.init(document.getElementById('main'));

// 指定图表的配置项和数据

var labelRight = {

normal: {

position: 'right'

}

};

option = {

title: {

text: '交错正负轴标签',

subtext: 'From ExcelHome',

sublink: 'http://e.weibo.com/1341556070/AjwF2AgQm'

},

tooltip : {

trigger: 'axis',

axisPointer : { // 坐标轴指示器，坐标轴触发有效

type : 'shadow' // 默认为直线，可选为：'line' | 'shadow'

}

},

grid: {

top: 80,

bottom: 30

},

xAxis: {

type : 'value',

position: 'top',

splitLine: {lineStyle:{type:'dashed'}},

},

yAxis: {

type : 'category',

axisLine: {show: false},

axisLabel: {show: false},

axisTick: {show: false},

splitLine: {show: false},

data : ['ten', 'nine', 'eight', 'seven', 'six', 'five', 'four', 'three', 'two', 'one']

},

series : [

{

name:'生活费',

type:'bar',

stack: '总量',

label: {

normal: {

show: true,

formatter: '{b}'

}

},

data:[

{value: -0.07, label: labelRight},

{value: -0.09, label: labelRight},

0.2, 0.44,

{value: -0.23, label: labelRight},

0.08,

{value: -0.17, label: labelRight},

0.47,

{value: -0.36, label: labelRight},

0.18

]

}

]

};

// 使用刚指定的配置项和数据显示图表。

myChart.setOption(option);

var _hmt = _hmt || [];

(function() {

var hm = document.createElement("script");

hm.src = "https://hm.baidu.com/hm.js?b393d153aeb26b46e9431fabaf0f6190";

var s = document.getElementsByTagName("script")[0];

s.parentNode.insertBefore(hm, s);

})();

一键复制

编辑

Web IDE

原始数据

按行查看

历史