Browse Source

echarts颜色

master
aBin 5 years ago
parent
commit
82634d1daa
  1. 27
      src/components/Duration/Duration.js
  2. 54
      src/components/Sensor/Sensor.js
  3. 58
      src/components/Statistics/Statistics.js

27
src/components/Duration/Duration.js

@ -1,6 +1,10 @@
var option = {
title: {
left: '10%',
textStyle: {
fontWeight: 'normal',
color: '#fff', //标题颜色
},
text: '急救时长分析',
},
tooltip: { trigger: 'axis' },
@ -8,6 +12,10 @@ var option = {
x: 'center',
y: 'bottom',
data: ['我院记录', '国际水准', '当前数据'],
textStyle: {
fontWeight: 'normal',
color: '#fff', //标题颜色
},
},
grid: {
left: '3%',
@ -19,11 +27,30 @@ var option = {
type: 'category',
boundaryGap: false,
data: ['周一', '周二', '周三', '周四', '周五', '周六', '周日'],
axisLabel: {
textStyle: {
fontWeight: 'normal',
color: '#fff', //标题颜色
},
},
},
yAxis: {
type: 'value',
name: '秒',
interval: 100,
axisLabel: {
textStyle: {
fontWeight: 'normal',
color: '#fff', //标题颜色
},
},
splitLine: {
show: true,
lineStyle: {
type: 'dashed',
color: '#666',
},
},
},
series: [
{

54
src/components/Sensor/Sensor.js

@ -1,20 +1,28 @@
var option = {
title: {
left: '10%',
textStyle: {
fontWeight: 'normal',
color: '#fff', //标题颜色
},
text: '震动传感器',
},
legend: {
x: 'center',
y: 'top',
data: ['传感器1', '传感器2'],
textStyle: {
fontWeight: 'normal',
color: '#fff', //标题颜色
},
},
xAxis: {
type: 'category',
boundaryGap: false,
axisLine: {
//y轴
show: false,
},
// data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']
},
yAxis: {
show: true,
@ -43,12 +51,56 @@ var option = {
data: [120, 932, 401, 534, 290, 530, 320],
type: 'line',
smooth: true,
itemStyle: {
color: {
type: 'linear',
x: 0,
y: 0,
x2: 0,
y2: 1,
colorStops: [
{
offset: 0,
color: '#0A4982', // 0% 处的颜色
},
{
offset: 1,
color: '#243859', // 100% 处的颜色
},
],
global: false, // 缺省为 false
},
},
areaStyle: {},
lineStyle: { normal: { width: 4 } },
},
{
name: '传感器2',
data: [220, 632, 101, 834, 490, 630, 220],
type: 'line',
smooth: true,
itemStyle: {
color: {
type: 'linear',
x: 0,
y: 0,
x2: 0,
y2: 1,
colorStops: [
{
offset: 0,
color: '#B2F2FC', // 0% 处的颜色
},
{
offset: 1,
color: '#5BE1FB', // 100% 处的颜色
},
],
global: false, // 缺省为 false
},
},
areaStyle: {},
lineStyle: { normal: { width: 4 } },
},
],
};

58
src/components/Statistics/Statistics.js

@ -1,6 +1,10 @@
var option = {
title: {
left: '10%',
textStyle: {
fontWeight: 'normal',
color: '#fff', //标题颜色
},
text: '急救数据统计',
},
tooltip: { trigger: 'axis' },
@ -9,27 +13,73 @@ var option = {
x: 'center',
y: 'top',
data: ['本年', '去年'],
textStyle: {
fontWeight: 'normal',
color: '#fff', //标题颜色
},
},
{
x: 'center',
y: 'bottom',
data: ['本年完成', '去年同期'],
textStyle: {
fontWeight: 'normal',
color: '#fff', //标题颜色
},
},
],
xAxis: {
type: 'category',
data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'],
axisLabel: {
textStyle: {
fontWeight: 'normal',
color: '#fff', //标题颜色
},
},
},
yAxis: [
{
type: 'value',
interval: 100,
interval: 200,
name: '人次',
axisTick: {
//y轴刻度线
show: false,
},
splitLine: {
show: true,
lineStyle: {
type: 'dashed',
color: '#666',
},
},
nameTextStyle: { color: '#fff' },
axisLabel: {
textStyle: {
fontWeight: 'normal',
color: '#fff', //标题颜色
},
},
},
{
type: 'value',
interval: 100,
interval: 200,
name: '数量',
splitLine: {
show: true,
lineStyle: {
type: 'dashed',
color: '#666',
},
},
nameTextStyle: { color: '#fff' },
axisLabel: {
textStyle: {
fontWeight: 'normal',
color: '#fff', //标题颜色
},
},
},
],
series: [
@ -58,7 +108,7 @@ var option = {
position: 'top', //在上方显示
textStyle: {
//数值样式
color: 'black',
color: 'white',
fontSize: 12,
},
},
@ -78,7 +128,7 @@ var option = {
position: 'top', //在上方显示
textStyle: {
//数值样式
color: 'black',
color: 'white',
fontSize: 12,
},
},

Loading…
Cancel
Save