|
@@ -1,34 +1,11 @@
|
|
|
<template>
|
|
|
<view class="content">
|
|
|
- <view @click="echarts.onClick" :prop="option" :change:prop="echarts.updateEcharts" id="echarts" class="echarts"></view>
|
|
|
+ <view @click="echarts.onClick" :change:prop="echarts.updateEcharts" id="echarts" class="echarts"></view>
|
|
|
</view>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
- var dataname = ['消防水系统', '报警主机', '电气火灾', '其他', '监控视频']
|
|
|
- var datamax = [600, 600, 600, 600, 600]
|
|
|
- var datavaule = [265, 368, 350, 260, 300, ]
|
|
|
- var color = ['#3C8BF0', '#06CDF8', '#0ECB70', '#6744EF', '#FFD803'];
|
|
|
-
|
|
|
- var indicator = []
|
|
|
-
|
|
|
- for (var i = 0; i < dataname.length; i++) {
|
|
|
- indicator.push({
|
|
|
- name: dataname[i],
|
|
|
- max: datamax[i],
|
|
|
- color: color[i]
|
|
|
- })
|
|
|
- }
|
|
|
-
|
|
|
- function contains(arrays, obj) {
|
|
|
- var i = arrays.length;
|
|
|
- while (i--) {
|
|
|
- if (arrays[i] === obj) {
|
|
|
- return i;
|
|
|
- }
|
|
|
- }
|
|
|
- return false;
|
|
|
- }
|
|
|
+
|
|
|
|
|
|
export default {
|
|
|
name: 'chart',
|
|
@@ -39,9 +16,80 @@
|
|
|
}
|
|
|
},
|
|
|
data() {
|
|
|
+
|
|
|
return {
|
|
|
+ aa:0
|
|
|
+
|
|
|
+ }
|
|
|
+ },
|
|
|
+ onLoad() {
|
|
|
+
|
|
|
+
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ // changeOption() {
|
|
|
+ // const data = this.option.series[0].data
|
|
|
+ // // 随机更新示例数据
|
|
|
+ // data.forEach((item, index) => {
|
|
|
+ // data.splice(index, 1, Math.random() * 40)
|
|
|
+ // })
|
|
|
+ // },
|
|
|
+ // onViewClick(options) {
|
|
|
+ // console.log(options)
|
|
|
+ // }
|
|
|
+ }
|
|
|
+ }
|
|
|
+</script>
|
|
|
+
|
|
|
+<script module="echarts" lang="renderjs">
|
|
|
+ let myChart
|
|
|
+ export default {
|
|
|
+ mounted() {
|
|
|
+ if (typeof window.echarts === 'function') {
|
|
|
+ this.initEcharts()
|
|
|
+ } else {
|
|
|
+ // 动态引入较大类库避免影响页面展示
|
|
|
+ const script = document.createElement('script')
|
|
|
+ // view 层的页面运行在 www 根目录,其相对路径相对于 www 计算
|
|
|
+ script.src = 'static/echarts.min.js'
|
|
|
+ script.onload = this.initEcharts.bind(this)
|
|
|
+ document.head.appendChild(script)
|
|
|
+ }
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ initEcharts() {
|
|
|
+ var dataname = ['消防水系统', '报警主机', '电气火灾', '其他', '监控视频']
|
|
|
+ var datavaule = [this.bindData.fire_water_count, this.bindData.alarm_host_count, this.bindData.electrical_fire_count, this.bindData.other_count, this.bindData.video_monitoring_count]
|
|
|
+ var aa = [this.bindData.fire_water_count, this.bindData.alarm_host_count, this.bindData.electrical_fire_count, this.bindData.other_count, this.bindData.video_monitoring_count]
|
|
|
+ aa=aa.sort().pop();
|
|
|
+ var datamax = [aa, aa, aa, aa, aa];
|
|
|
+ var color = ['#3C8BF0', '#06CDF8', '#0ECB70', '#6744EF', '#FFD803'];
|
|
|
+
|
|
|
+ var indicator = []
|
|
|
+
|
|
|
+ for (var i = 0; i < dataname.length; i++) {
|
|
|
+ indicator.push({
|
|
|
+ name: dataname[i],
|
|
|
+ max: datamax[i],
|
|
|
+ color: color[i]
|
|
|
+ })
|
|
|
+ }
|
|
|
+
|
|
|
+ function contains(arrays, obj) {
|
|
|
+ var i = arrays.length;
|
|
|
+ while (i--) {
|
|
|
+ if (arrays[i] === obj) {
|
|
|
+ return i;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ return false;
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
|
|
|
- option: {
|
|
|
+ myChart = echarts.init(document.getElementById('echarts'))
|
|
|
+ // 观测更新的数据在 view 层可以直接访问到
|
|
|
+ myChart.setOption({
|
|
|
tooltip: {
|
|
|
formatter: function() {
|
|
|
var html = '';
|
|
@@ -132,53 +180,8 @@
|
|
|
},
|
|
|
data: [datavaule]
|
|
|
}]
|
|
|
- }
|
|
|
- }
|
|
|
- },
|
|
|
- onLoad() {
|
|
|
- alert(1)
|
|
|
- console.log('this.bindData')
|
|
|
- console.log(this,bindData)
|
|
|
-
|
|
|
- },
|
|
|
- methods: {
|
|
|
- changeOption() {
|
|
|
- const data = this.option.series[0].data
|
|
|
- // 随机更新示例数据
|
|
|
- data.forEach((item, index) => {
|
|
|
- data.splice(index, 1, Math.random() * 40)
|
|
|
})
|
|
|
},
|
|
|
- onViewClick(options) {
|
|
|
- console.log(options)
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
-</script>
|
|
|
-
|
|
|
-<script module="echarts" lang="renderjs">
|
|
|
- let myChart
|
|
|
- export default {
|
|
|
- mounted() {
|
|
|
- if (typeof window.echarts === 'function') {
|
|
|
- this.initEcharts()
|
|
|
- } else {
|
|
|
- // 动态引入较大类库避免影响页面展示
|
|
|
- const script = document.createElement('script')
|
|
|
- // view 层的页面运行在 www 根目录,其相对路径相对于 www 计算
|
|
|
- script.src = 'static/echarts.min.js'
|
|
|
- script.onload = this.initEcharts.bind(this)
|
|
|
- document.head.appendChild(script)
|
|
|
- }
|
|
|
- },
|
|
|
- methods: {
|
|
|
- initEcharts() {
|
|
|
-
|
|
|
-
|
|
|
- myChart = echarts.init(document.getElementById('echarts'))
|
|
|
- // 观测更新的数据在 view 层可以直接访问到
|
|
|
- myChart.setOption(this.option)
|
|
|
- },
|
|
|
updateEcharts(newValue, oldValue, ownerInstance, instance) {
|
|
|
// 监听 service 层数据变更
|
|
|
myChart.setOption(newValue)
|