diff --git a/public/bigScreen/css/index.css b/public/bigScreen/css/index.css
index 5cf683de8..e7442b4b8 100644
--- a/public/bigScreen/css/index.css
+++ b/public/bigScreen/css/index.css
@@ -1,5 +1,5 @@
body {
- padding: 10px;
+ padding: 10px 10px 0px 10px;
background: url(../images/bg_body.jpg) no-repeat;
width: 100%;
}
@@ -163,7 +163,7 @@ small {
.box5_con {
width: 100%;
- height: 957px;
+
float: left;
}
@@ -175,7 +175,6 @@ small {
.box5_con_bot {
width: 100%;
- height: 550px;
float: left;
}
diff --git a/public/bigScreen/index.html b/public/bigScreen/index.html
index ff56a1125..7a3cd89b9 100644
--- a/public/bigScreen/index.html
+++ b/public/bigScreen/index.html
@@ -32,7 +32,7 @@
@@ -70,7 +70,7 @@
diff --git a/public/bigScreen/js/box1.js b/public/bigScreen/js/box1.js
index 8d92d618c..a81f65ce5 100644
--- a/public/bigScreen/js/box1.js
+++ b/public/bigScreen/js/box1.js
@@ -13,9 +13,9 @@ option = {
subtext: '',
left: 'center'
},
- textStyle:{//图例文字的样式
- color:'#fff',
- fontSize:12
+ textStyle: {//图例文字的样式
+ color: '#fff',
+ fontSize: 12
},
tooltip: {
trigger: 'item',
@@ -26,16 +26,16 @@ option = {
left: 'left',
data: ['已售', '空闲']
},
- color : [ 'green', 'red' ],
+ color: ['green', 'red'],
series: [
{
name: '',
type: 'pie',
- radius: '65%',
- center: ['40%', '40%'],
+ radius: '55%',
+ center: ['50%', '50%'],
data: [
- {value: 335, name: '已售'},
- {value: 310, name: '空闲'}
+ { value: 90, name: '已售' },
+ { value: 10, name: '空闲' }
],
emphasis: {
itemStyle: {
@@ -43,6 +43,15 @@ option = {
shadowOffsetX: 0,
shadowColor: 'rgba(0, 0, 0, 0.5)'
}
+ },
+ itemStyle: {
+ normal: {
+ label: {
+ show: true,
+ formatter: '{b} : {c} '
+ },
+ labelLine: { show: true }
+ }
}
}
]
diff --git a/public/bigScreen/js/box2.js b/public/bigScreen/js/box2.js
index 932133df0..0bf11f7ae 100644
--- a/public/bigScreen/js/box2.js
+++ b/public/bigScreen/js/box2.js
@@ -3,16 +3,6 @@ var myChart = echarts.init(dom);
var app = {};
option = null;
var xAxisData = [];
-var data1 = [];
-var data2 = [];
-var data3 = [];
-var data4 = [];
-
-for (var i = 0; i < 10; i++) {
- xAxisData.push('Class' + i);
- data1.push((Math.random() * 2).toFixed(2));
- data2.push(-Math.random().toFixed(2));
-}
var emphasisStyle = {
itemStyle: {
@@ -25,74 +15,53 @@ var emphasisStyle = {
};
option = {
- backgroundColor: '',
+ tooltip: {
+ trigger: 'item',
+ formatter: '{a}
{b}: {c} ({d}%)'
+ },
legend: {
- data: ['已缴费', '未交费'],
- left: 10
- },
- tooltip: {},
- xAxis: {
- data: xAxisData,
- name: '费用项',
- axisLine: {onZero: true},
- splitLine: {show: false},
- splitArea: {show: false}
- },
- textStyle:{//图例文字的样式
- color:'#fff',
- fontSize:12
- },
- yAxis: {
- inverse: true,
- splitArea: {show: false}
- },
- grid: {
- left: 0
+ orient: 'vertical',
+ left: 10,
+ data: ['已处理', '未处理']
},
+ color: ['yellow','red'],
series: [
{
- name: '已缴费',
- type: 'bar',
- stack: 'one',
- emphasis: emphasisStyle,
- data: data1
- },
- {
- name: '未交费',
- type: 'bar',
- stack: 'one',
- emphasis: emphasisStyle,
- data: data2
+ name: '访问来源',
+ type: 'pie',
+ radius: ['50%', '70%'],
+ avoidLabelOverlap: false,
+ label: {
+ show: true,
+ position: 'top'
+ },
+ emphasis: {
+ label: {
+ show: true,
+ fontSize: '30',
+ fontWeight: 'bold'
+ }
+ },
+ labelLine: {
+ show: false
+ },
+ data: [
+ {value: 90, name: '已处理'},
+ {value: 10, name: '未处理'}
+ ],
+ itemStyle: {
+ normal: {
+ label: {
+ show: true,
+ formatter: '{b} : {c} '
+ },
+ labelLine: { show: true }
+ }
+ }
}
]
};
-myChart.on('brushSelected', renderBrushed);
-
-function renderBrushed(params) {
- var brushed = [];
- var brushComponent = params.batch[0];
-
- for (var sIdx = 0; sIdx < brushComponent.selected.length; sIdx++) {
- var rawIndices = brushComponent.selected[sIdx].dataIndex;
- brushed.push('[Series ' + sIdx + '] ' + rawIndices.join(', '));
- }
-
- myChart.setOption({
- title: {
- backgroundColor: '#333',
- text: 'SELECTED DATA INDICES: \n' + brushed.join('\n'),
- bottom: 0,
- right: 0,
- width: 100,
- textStyle: {
- fontSize: 12,
- color: '#fff'
- }
- }
- });
-}
-
if (option && typeof option === "object") {
myChart.setOption(option, true);
}
\ No newline at end of file
diff --git a/public/bigScreen/js/box4.js b/public/bigScreen/js/box4.js
index 205d44c5e..006685529 100644
--- a/public/bigScreen/js/box4.js
+++ b/public/bigScreen/js/box4.js
@@ -2,142 +2,97 @@ var dom = document.getElementById("box4");
var myChart = echarts.init(dom);
var app = {};
option = null;
+var xAxisData = [];
+var data1 = [];
+var data2 = [];
+var data3 = [];
+var data4 = [];
+
+for (var i = 0; i < 10; i++) {
+ xAxisData.push('Class' + i);
+ data1.push((Math.random() * 2).toFixed(2));
+ data2.push(-Math.random().toFixed(2));
+}
+
+var emphasisStyle = {
+ itemStyle: {
+ barBorderWidth: 1,
+ shadowBlur: 10,
+ shadowOffsetX: 0,
+ shadowOffsetY: 0,
+ shadowColor: 'rgba(0,0,0,0.5)'
+ }
+};
+
option = {
+ backgroundColor: '',
legend: {
- textStyle:{//图例文字的样式
- color:'#fff',
- fontSize:12
- },
- data: ['图一','图二', '张三', '李四']
+ data: ['已缴费', '未交费'],
+ left: 10
+ },
+ tooltip: {},
+ xAxis: {
+ data: xAxisData,
+ name: '费用项',
+ axisLine: {onZero: true},
+ splitLine: {show: false},
+ splitArea: {show: false}
+ },
+ textStyle:{//图例文字的样式
+ color:'#fff',
+ fontSize:12
+ },
+ yAxis: {
+ inverse: true,
+ splitArea: {show: false}
+ },
+ grid: {
+ left: 0
},
- radar: [
- {
- indicator: [
- { text: '指标一' },
- { text: '指标二' },
- { text: '指标三' },
- { text: '指标四' },
- { text: '指标五' }
- ],
- center: ['25%', '50%'],
- radius: 120,
- startAngle: 90,
- splitNumber: 4,
- shape: 'circle',
- name: {
- formatter:'【{value}】',
- textStyle: {
- color:'#72ACD1'
- }
- },
- splitArea: {
- areaStyle: {
- color: ['rgba(114, 172, 209, 0.2)',
- 'rgba(114, 172, 209, 0.4)', 'rgba(114, 172, 209, 0.6)',
- 'rgba(114, 172, 209, 0.8)', 'rgba(114, 172, 209, 1)'],
- shadowColor: 'rgba(0, 0, 0, 0.3)',
- shadowBlur: 10
- }
- },
- axisLine: {
- lineStyle: {
- color: 'rgba(255, 255, 255, 0.5)'
- }
- },
- splitLine: {
- lineStyle: {
- color: 'rgba(255, 255, 255, 0.5)'
- }
- }
- },
- {
- indicator: [
- { text: '参数一', max: 150 },
- { text: '参数二', max: 150 },
- { text: '参数三', max: 150 },
- { text: '参数四', max: 120 },
- { text: '参数五', max: 108 },
- { text: '参数六', max: 72 }
- ],
- center: ['75%', '50%'],
- radius: 120
- }
- ],
series: [
{
- name: '雷达图',
- type: 'radar',
- itemStyle: {
- emphasis: {
- // color: 各异,
- lineStyle: {
- width: 4
- }
- }
- },
- data: [
- {
- value: [100, 8, 0.40, -80, 2000],
- name: '图一',
- symbol: 'rect',
- symbolSize: 5,
- lineStyle: {
- normal: {
- type: 'dashed'
- }
- }
- },
- {
- value: [60, 5, 0.30, -100, 1500],
- name: '图二',
- areaStyle: {
- normal: {
- color: 'rgba(255, 255, 255, 0.5)'
- }
- }
- }
- ]
+ name: '已缴费',
+ type: 'bar',
+ stack: 'one',
+ emphasis: emphasisStyle,
+ data: data1
},
{
- name: '成绩单',
- type: 'radar',
- radarIndex: 1,
- data: [
- {
- value: [120, 118, 130, 100, 99, 70],
- name: '张三',
- label: {
- normal: {
- show: true,
- formatter:function(params) {
- return params.value;
- }
- }
- }
- },
- {
- value: [90, 113, 140, 30, 70, 60],
- name: '李四',
- areaStyle: {
- normal: {
- opacity: 0.9,
- color: new echarts.graphic.RadialGradient(0.5, 0.5, 1, [
- {
- color: '#B8D3E4',
- offset: 0
- },
- {
- color: '#72ACD1',
- offset: 1
- }
- ])
- }
- }
- }
- ]
+ name: '未交费',
+ type: 'bar',
+ stack: 'one',
+ emphasis: emphasisStyle,
+ data: data2
}
]
};
+
+myChart.on('brushSelected', renderBrushed);
+
+function renderBrushed(params) {
+ var brushed = [];
+ var brushComponent = params.batch[0];
+
+ for (var sIdx = 0; sIdx < brushComponent.selected.length; sIdx++) {
+ var rawIndices = brushComponent.selected[sIdx].dataIndex;
+ brushed.push('[Series ' + sIdx + '] ' + rawIndices.join(', '));
+ }
+
+ myChart.setOption({
+ title: {
+ backgroundColor: '#333',
+ text: 'SELECTED DATA INDICES: \n' + brushed.join('\n'),
+ bottom: 0,
+ right: 0,
+ width: 100,
+ textStyle: {
+ fontSize: 12,
+ color: '#fff'
+ }
+ }
+ });
+}
+
if (option && typeof option === "object") {
myChart.setOption(option, true);
}
\ No newline at end of file