统计分析

src/views/bigdata/bigdata.vue

@@ -25,26 +25,19 @@
 					<div class="b-tit"><img src="@/assets/images/integrated/bigdata-tit-icon.png">
 						<span>事件来源，类型统计</span>
 					</div>
-					<div class="twins">
-						<div class="count">
-							<div class="count-z m-l-15">事件总数<span>{{total}}</span></div>
-							<div class="count-z m-l-15">未处理<span> {{untreated}}</span></div>
-							<div class="count-z m-l-15">处理中<span> {{processing}}</span></div>
-						</div>
 						<chartEvent></chartEvent>
-					</div>
 				</div>
 				<div class="b-con mg-b-20">
 					<div class="b-tit"><img src="@/assets/images/integrated/bigdata-tit-icon.png">
 						<span>林场分布统计</span>
 					</div>
-					<chartPopulation></chartPopulation>
+					<chartForestFarm></chartForestFarm>
 				</div>
 				<div class="b-con">
 					<div class="b-tit"><img src="@/assets/images/integrated/bigdata-tit-icon.png">
 						<span>设备类型统计</span>
 					</div>
-					<chartEnterprise></chartEnterprise>
+					<chartEquipmentType></chartEquipmentType>
 				</div>
 			</div>
 			<!-- 第二纵向-->
@@ -63,46 +56,46 @@
 					<div class="b-tit"><img src="@/assets/images/integrated/bigdata-tit-icon.png">
 						<span>起火原因统计</span>
 					</div>
-					<chartDanger></chartDanger>
+					<chartFireCause></chartFireCause>
 				</div>
 				<div class="b-con mg-b-20 b-49">
 					<div class="b-tit"><img src="@/assets/images/integrated/bigdata-tit-icon.png">
-						<span>设备、上报事件数量</span>
+						<span>设备上报事件数量</span>
 					</div>
-					<chartForestFarm></chartForestFarm>
+					<chartDeviceReportingEvents></chartDeviceReportingEvents>
 				</div>
 				<div class="b-con mg-b-20 b-49">
 					<div class="b-tit"><img src="@/assets/images/integrated/bigdata-tit-icon.png">
 						<span>重点区域</span>
 					</div>
-					<chartFreelyraise></chartFreelyraise>
+					<chartKeyArea></chartKeyArea>
 				</div>
 				<div class="b-con mg-b-20 b-49">
 					<div class="b-tit"><img src="@/assets/images/integrated/bigdata-tit-icon.png">
 						<span>珍惜古树</span>
 					</div>
-					<chartFarm></chartFarm>
+					<chartAncientTree></chartAncientTree>
 				</div>
 				<div class="b-con">
 					<div class="b-tit"><img src="@/assets/images/integrated/bigdata-tit-icon.png">
 						<span>事件趋势</span>
 					</div>
-					<chartPit></chartPit><strong></strong>
+					<chartEventTrend></chartEventTrend><strong></strong>
 				</div>
 			</div>
 			<!-- 第四纵向-->
 			<div class="bigdata-list wid-li-3 m-l-15 flex-r">
 				<div class="b-con mg-b-20 tall">
 					<div class="b-tit"><img src="@/assets/images/integrated/bigdata-tit-icon.png">
-						<span>网格分布到乡镇</span>
+						<span>网格分布</span>
 					</div>
-					<chartCollection></chartCollection>
+					<chartGridDistribution></chartGridDistribution>
 				</div>
 				<div class="b-con">
 					<div class="b-tit"><img src="@/assets/images/integrated/bigdata-tit-icon.png">
 						<span>天气趋势</span>
 					</div>
-					<chartFarmtype></chartFarmtype>
+					<chartWeatherTrends></chartWeatherTrends>
 				</div>
 			</div>
 			<!-- 第五纵向-->
@@ -111,28 +104,28 @@
 					<div class="b-tit"><img src="@/assets/images/integrated/bigdata-tit-icon.png">
 						<span>网格人员</span>
 					</div>
-					<chartHydrant></chartHydrant>
+					<chartGridStaff></chartGridStaff>
 				</div>
 				<div class="b-con mg-b-20 b-49">
 					<div class="b-tit"><img src="@/assets/images/integrated/bigdata-tit-icon.png">
 						<span>防火队</span>
 					</div>
-					<chartProcessing></chartProcessing>
+					<chartFireBrigade></chartFireBrigade>
 				</div>
 				<div class="b-con mg-b-20 b-49">
 					<div class="b-tit"><img src="@/assets/images/integrated/bigdata-tit-icon.png">
 						<span>气象站</span>
 					</div>
-					<chartFoam></chartFoam>
+					<chartWeatherStation></chartWeatherStation>
 				</div>
 			</div>
 			<!-- 第六纵向-->
 			<div class="bigdata-list wid-li-1 m-l-15">
 				<div class="b-con mg-b-20 taller">
 					<div class="b-tit"><img src="@/assets/images/integrated/bigdata-tit-icon.png">
-						<span>设备分布到乡镇</span>
+						<span>设备分布</span>
 					</div>
-					<chartCamera></chartCamera>
+					<chartEquipmentDistribution></chartEquipmentDistribution>
 				</div>
 			</div>
 		</div>
@@ -145,24 +138,20 @@
 	import bigdataSupermap from '@/components/supermap' //超图
 
 	//echarts
-	import chartEvent from './chart-event.vue' //1  事件
-	import chartPopulation from './chart-population.vue' //2  人口
-	import chartEnterprise from './chart-enterprise.vue' //3  公司
-	import chartDanger from './chart-danger.vue' //4  隐患
-	import chartForestFarm from './chart-forestfarm.vue' //5  林场
-	import chartPit from './chart-pit.vue' //6  矿坑
-	import chartFreelyraise from './chart-freelyraise.vue' //7  散养户
-	import chartFarm from './chart-farm.vue' //8  养殖场
-	import chartFarmtype from './chart-farmtype.vue' //9  散养户、养殖场-养殖种类
-	import chartCollection from './chart-collection.vue' //10 收集点
-	import chartCaterCrane from './chart-watercrane.vue' //11 水鹤
-	import chartProcessing from './chart-processing.vue' //12 处理中心
-	import chartHydrant from './chart-hydrant.vue' //13 消火栓
-	import chartFoam from './chart-foam.vue' //14 泡沫液
-	import chartWaterIntake from './chart-waterintake' //15 取水口
-	import chartCamera from './chart-camera' //16 摄像头
-	import chartDetector from './chart-detector' //17 探测器
-	import chartFireControl from './chart-firecontrol' //18 消防力量
+	import chartEvent from './chart-event.vue' //1  事件、、
+	import chartForestFarm from './chart-forestFarm.vue' //2  林场分布、、
+	import chartEquipmentType from './chart-equipmentType.vue' //3  公司、、
+	import chartFireCause from './chart-fireCause.vue' //4  起火原因、、
+	import chartDeviceReportingEvents from './chart-deviceReportingEvents.vue' //5  设备上报数量、、
+	import chartEventTrend from './chart-eventTrend.vue' //6  事件趋势、、
+	import chartKeyArea from './chart-keyArea.vue' //7  重点区域、、
+	import chartAncientTree from './chart-ancientTree.vue' //8  珍惜古树、、
+	import chartWeatherTrends from './chart-weatherTrends.vue' //9  天气趋势、、
+	import chartGridDistribution from './chart-gridDistribution.vue' //10 网格分布、、
+	import chartFireBrigade from './chart-fireBrigade.vue' //12 防火队、、
+	import chartGridStaff from './chart-gridStaff.vue' //13 网格人员、、
+	import chartWeatherStation from './chart-weatherStation.vue' //14 气象站、、
+	import chartEquipmentDistribution from './chart-equipmentDistribution' //16 设备分布、、
 
 
 	export default {
@@ -170,23 +159,19 @@
 			bigdataSupermap,
 			tabbar,
 			chartEvent,
-			chartPopulation,
-			chartEnterprise,
-			chartDanger,
 			chartForestFarm,
-			chartPit,
-			chartFreelyraise,
-			chartFarm,
-			chartFarmtype,
-			chartCollection,
-			chartCaterCrane,
-			chartProcessing,
-			chartHydrant,
-			chartFoam,
-			chartWaterIntake,
-			chartCamera,
-			chartDetector,
-			chartFireControl
+			chartEquipmentType,
+			chartFireCause,
+			chartDeviceReportingEvents,
+			chartEventTrend,
+			chartKeyArea,
+			chartAncientTree,
+			chartWeatherTrends,
+			chartGridDistribution,
+			chartFireBrigade,
+			chartGridStaff,
+			chartWeatherStation,
+			chartEquipmentDistribution,
 		},
 		data() {
 			return {

src/views/bigdata/chart-detector.vue

@@ -1,213 +0,0 @@
-<!-- **************************************NO.17 探测器*************************************** -->
-<template>
-	<div class="chart-container">
-		<div id="detector1" style="width: 100%; height:25vh; ">
-		</div>
-		<div id="detector2" style="width: 100%; height:30vh; ">
-		</div>
-	</div>
-</template>
-
-<script>
-	import * as echarts from 'echarts';
-	export default {
-		name: 'detector',
-		data() {
-			return {
-				count: 0
-			}
-		},
-		mounted() {
-			this.myEcharts1();
-			this.myEcharts2();
-
-		},
-
-		methods: {
-			// 出处 http://192.144.199.210:8080/editor/index.html?chart_id=gK9VdA5_F06NTrpr
-			myEcharts1() {
-				var chartDom = document.getElementById('detector1');
-				var myChart = echarts.init(chartDom);
-				var option;
-				 option = {
-				    tooltip: {
-				        trigger: 'item',
-				    },
-				    color: ['#f7c778', '#d77169', '#c14f60', '#4d9564', '#215b85', ],
-				  
-				    series : [
-				        {
-				            name:'探测器分布',
-				            type:'funnel',
-				            x: '10%',
-				            y: 15,
-				            //x2: 80,
-				            y2: 15,
-				            width: '80%',
-				            // height: {totalHeight} - y - y2,
-				            min: 0,
-				            max: 100,
-				            minSize: '40%',
-				            maxSize: '100%',
-				            sort : 'descending', // 'ascending', 'descending'
-				            gap :0,
-				            data:[
-				                {value:60, name:'双辽市'},
-				                {value:40, name:'梨树县'},
-				                {value:20, name:'伊通县'},
-				                {value:80, name:'铁东区'},
-				                {value:100, name:'铁西区'}
-				            ].sort(function (a, b) { return a.value - b.value}),
-				            roseType: true,
-				            label: {
-				                normal: {
-				                    color:'#fff',
-				                    formatter:'{b} {c}',
-				                    position: 'center',
-				                    rich:{
-				                        style:{
-				                            fontSize:'20px',
-											color:'#ffffff',
-				                        },
-				                      
-				                    }
-				                }
-				            },
-				            itemStyle: {
-				                normal: {
-				                    borderWidth: 0,
-				                    shadowBlur: 30,
-				                    shadowOffsetX: 0,
-				                    shadowOffsetY: 10,
-				                    shadowColor: 'rgba(0, 0, 0, 0.5)'
-				                }
-				            }
-				            
-				        }
-				        
-				    ]
-				};
-				option && myChart.setOption(option);
-			},
-
-			// 出处 http://192.144.199.210:8080/editor/index.html?chart_id=APfCRAFKxpN_qWeq
-			myEcharts2() {
-				var chartDom = document.getElementById('detector2');
-				var myChart = echarts.init(chartDom);
-				var option;
-				const dfColor = ['#92E1FF', '#0097FB', '#30ECA6', '#FFC227', '#FF4848'];
-				let dataArray = {
-				    xdataName: ['类型1', '类型1', '类型3', '类型3', '类型4', '类型5', '类型6'],
-				    contractnum: [9999, 8888, 7777, 6666, 5555, 4444, 3333]
-				}
-				
-				
-				let color2 = [
-				    [{ offset: 0, color: '#ff8881' }, { offset: 0.15, color: '#ff564c' },{ offset: 1, color: 'rgba(255,86,76, 0.08)' }],
-				    [{ offset: 0, color: '#fff9e1' }, { offset: 0.15, color: '#ffe376' },{ offset: 1, color: 'rgba(255,209,26, 0.08)' }],
-				    [{ offset: 0, color: '#f7ff98' }, { offset: 0.15, color: '#efff37' },{ offset: 1, color: 'rgba(239,255,55, 0.08)' }],
-				    [{ offset: 0, color: '#32ffee' }, { offset: 0.15, color: '#cdfffb' },{ offset: 1, color: 'rgba(50,255,238, 0.1)' }],
-				]
-				// tooltip
-				let tooltip = {
-				    trigger: 'axis',
-				    textStyle: { fontSize: 10 },
-				    axisPointer: { type: 'cross' },
-				    formatter: v => {
-				        let [a] = v
-				        return `
-				            <div class='u-p-2'>
-				                <div>${a.name}：${a.value}</div>
-				            </div>
-				        `
-				    }
-				}
-				
-				// grid
-				let grid = { top: '20%', left: '10%', right: '10%', bottom: '20%' }
-				
-				// xAxis
-				let xAxis = {
-				    type: 'category',
-				    boundaryGap: true,
-				    data: dataArray.xdataName,
-				    axisLine: { lineStyle: { color: '#fff' } },
-				    axisLabel: {
-				        textStyle: { fontSize: 10, color: '#fff' },
-				        rotate: 0
-				    },
-				    axisTick: { show: false }, //坐标轴刻度
-				}
-				
-				// yAxis
-				let yAxis = {
-				     show: false
-				}
-				
-				// series
-				let series = [{
-				    name: '中高风险地区',
-				    type: 'pictorialBar',
-				    barWidth: 15,
-				    // 三角矢量柱状图
-				    symbol: 'path://M-0.000,431.000 C59.528,394.477 61.000,-0.000 61.000,-0.000 C61.000,-0.000 62.472,394.477 122.000,431.000 L-0.000,431.000 Z',
-				    // 是否裁剪图形
-				    symbolClip: false,
-				    data: dataArray.contractnum,
-				     itemStyle: {
-				        color: params => {
-				            return params.name === dataArray.xdataName[0] 
-				            ? new echarts.graphic.LinearGradient(0, 0, 0, 1, color2[0]) 
-				            : params.name === dataArray.xdataName[1] 
-				            ? new echarts.graphic.LinearGradient(0, 0, 0, 1, color2[1]) 
-				            : params.name === dataArray.xdataName[2]
-				            ? new echarts.graphic.LinearGradient(0, 0, 0, 1, color2[2]) 
-				            : new echarts.graphic.LinearGradient(0, 0, 0, 1, color2[3]) 
-				        } 
-				    },
-				    label: {
-				        show: true,
-				        position: 'top',
-				        formatter: params => { 
-				            return params.name === dataArray.xdataName[0] 
-				            ? `{a|${params.value}}` 
-				            : params.name === dataArray.xdataName[1] 
-				            ? `{b|${params.value}}` 
-				            : params.name === dataArray.xdataName[2]
-				            ? `{c|${params.value}}` 
-				            : `{d|${params.value}}` 
-				        },
-				        rich: {
-				            a: { color: '#ff564c' },
-				            b: { color: '#ffd11a' },
-				            c: { color: '#efff37' },
-				            d: { color: '#32ffee' },
-				
-				        },
-				        textStyle: { fontSize: 16 }
-				    },
-				}]
-				
-				// 渲染
-				option = { tooltip, grid, xAxis, yAxis, series }
-				option && myChart.setOption(option);
-			},
-			
-
-
-		},
-
-
-	}
-</script>
-
-<style rel="stylesheet/scss" lang="scss" scoped>
-	.chart-container {
-		width: 100%;
-		height: auto;
-		position: relative;
-		padding-bottom: 10px;
-		display: flex;
-		flex-direction: column;
-	}
-</style>

src/views/bigdata/chart-firecontrol.vue

@@ -1,130 +0,0 @@
-<!-- **************************************NO.18 消防*************************************** -->
-<template>
-	<div class="chart-container">
-		<div id="firecontrol" style="width: 100%; height:25vh; ">
-		</div>
-	</div>
-</template>
-
-<script>
-	import * as echarts from 'echarts';
-	export default {
-		name: 'firecontrol',
-		data() {
-			return {
-				count: 0
-			}
-		},
-		mounted() {
-			this.myEcharts1();
-
-		},
-
-		methods: {
-			// 出处 http://192.144.199.210:8080/editor/index.html?chart_id=f46x0t0c7883X-D6
-			myEcharts1() {
-				var chartDom = document.getElementById('firecontrol');
-				var myChart = echarts.init(chartDom);
-				var option;
-				 option = {
-				    tooltip: {
-				        trigger: 'axis',
-				        axisPointer: {
-				            type: 'shadow'
-				        }
-				    },
-				    grid:{
-				        top:'15%',
-				        left:'10%',
-				        right:'10%',
-				        buttom:'15%',
-				    },
-				     xAxis: {
-				        type: 'category',
-				        axisLine: {
-				            lineStyle: {
-				                color: 'rgba(255,255,255,0.12)',
-				            },
-				        },
-				        axisLabel: {
-				            margin: 10,
-				            color: '#e2e9ff',
-				            textStyle: {
-				                fontSize: 10
-				            },
-				        },
-				        axisTick:{
-				            show:false,
-				        },
-				         data: ['双辽市', '梨树县', '伊通县', '铁东区', '铁西区']
-				    },
-				    yAxis: {
-				        nameTextStyle:{
-				            color:'#fff',
-				        },
-				        type: 'value',
-				         axisLine: {
-				             show:false,
-				            lineStyle: {
-				                color: 'rgba(255,255,255,0.12)'
-				            },
-				        },
-				        axisLabel: {
-							 show:false,
-				            formatter: '{value}',
-				            color: '#e2e9ff',
-				        },
-				         splitLine: {
-				            lineStyle: {
-				                color: 'rgba(255,255,255,0.12)'
-				            }
-				        },
-				        axisTick:{
-				            show:true,
-				            
-				            lineStyle:{
-				                color:'#fff',
-				            },
-				        },
-				    },
-				    series: [{
-				        itemStyle:{
-				            color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
-				                    offset: 0,
-				                    color: 'rgba(0,244,255,1)'
-				                }, {
-				                    offset: 1,
-				                    color: 'rgba(0,77,167,1)'
-				                }], false),
-				                barBorderRadius: 10,
-				                opacity:0.8
-				        },
-				        barWidth:10,
-				        label:{
-				            show:true,
-				            position:['0','-20'],
-				            color:'#fff',
-				        },
-				        data: [120, 200, 150, 80, 70],
-				        type: 'bar',
-				    }]
-				};
-				option && myChart.setOption(option);
-			},
-
-		},
-
-
-	}
-</script>
-
-<style rel="stylesheet/scss" lang="scss" scoped>
-	.chart-container {
-		width: 100%;
-		height: auto;
-		position: relative;
-		padding-bottom: 10px;
-		display: flex;
-		flex-direction: column;
-	}
-</style>

src/views/bigdata/chart-watercrane.vue

@@ -1,135 +0,0 @@
-<!-- **************************************NO.11 水鹤*************************************** -->
-<template>
-	<div class="chart-container">
-		<div id="watercrane" style="width: 100%; height:23vh;">
-		</div>
-	</div>
-</template>
-
-<script>
-	import * as echarts from 'echarts';
-	export default {
-		name: 'watercrane',
-		data() {
-			return {
-				count: 0
-			}
-		},
-		mounted() {
-			this.myEcharts()
-
-		},
-
-		methods: {
-			// 出处 http://192.144.199.210:8080/editor/index.html?chart_id=vNg2RQ3LrePk4CnZ
-			myEcharts() {
-
-
-				var chartDom = document.getElementById('watercrane');
-				var myChart = echarts.init(chartDom);
-				var color = ['#0E7CE2', '#FF8352', '#E271DE', '#F8456B', '#00FFFF', '#4AEAB0'];
-				var option;
-				var salvProName = ["双辽市", "梨树县", "伊通县", "铁东区", "铁西区"];
-				var salvProValue = [11000, 10000, 9000, 8000, 7000];
-				var salvProMax = []; //背景按最大值
-				for (let i = 0; i < salvProValue.length; i++) {
-				    salvProMax.push(salvProValue[0])
-				}
-				option = {
-				    grid: {
-				        left: '8%',
-				        right: '8%',
-				        bottom: '0%',
-				        top: '5%',
-				        containLabel: true
-				    },
-				    tooltip: {
-				        trigger: 'axis',
-				        axisPointer: {
-				            type: 'none'
-				        },
-				        formatter: function(params) {
-				            return params[0].name + ' : ' + params[0].value
-				        }
-				    },
-				    xAxis: {
-				        show: false,
-				        type: 'value'
-				    },
-				    yAxis: [{
-				        type: 'category',
-				        inverse: true,
-				        axisLabel: {
-				            show: true,
-				            textStyle: {
-				                color: '#248bf9',
-				                fontSize: 12,
-				                fontWeight: 500
-				            },
-				        },
-				        splitLine: {
-				            show: false
-				        },
-				        axisTick: {
-				            show: false
-				        },
-				        axisLine: {
-				            show: false
-				        },
-				        data: salvProName
-				    }, {
-				        type: 'category',
-				        inverse: true,
-				        axisTick: 'none',
-				        axisLine: 'none',
-				        show: true,
-				        axisLabel: {
-				            textStyle: {
-				                color: '#fffdfe',
-				                fontSize:10
-				            },
-				            formatter: function(value) {
-				                return (value * 10 / 10).toLocaleString();
-				            },
-				        },
-				        data: salvProValue
-				    }],
-				    series: [{
-				            name: '值',
-				            type: 'bar',
-				            zlevel: 1,
-				            itemStyle: {
-				                normal: {
-				                    barBorderRadius: 10,
-				                    color: new echarts.graphic.LinearGradient(0, 0, 1, 0, [{
-				                        offset: 0,
-				                        color: 'rgb(57,89,255,1)'
-				                    }, {
-				                        offset: 1,
-				                        color: 'rgb(46,200,207,1)'
-				                    }]),
-				                },
-				            },
-				            barWidth: 10,
-				            data: salvProValue
-				        },
-				    ]
-				};
-				option && myChart.setOption(option);
-			},
-
-		},
-
-
-	}
-</script>
-
-<style rel="stylesheet/scss" lang="scss" scoped>
-	.chart-container {
-		width: 100%;
-		height: auto;
-		position: relative;
-		padding-bottom: 10px;
-		display: flex;
-	}
-</style>

src/views/bigdata/chart-waterintake.vue

@@ -1,110 +0,0 @@
-<!-- **************************************NO.15 取水口*************************************** -->
-<template>
-	<div class="chart-container">
-		<div id="waterintake" style="width: 100%; height:23vh;">
-		</div>
-	</div>
-</template>
-
-<script>
-	import * as echarts from 'echarts';
-	export default {
-		name: 'waterintake',
-		data() {
-			return {
-				count: 0
-			}
-		},
-		mounted() {
-			this.myEcharts()
-
-		},
-
-		methods: {
-			// 出处 http://192.144.199.210:8080/editor/index.html?chart_id=AQ8Ea8ewtkr0NVzH
-			myEcharts() {
-
-
-				var chartDom = document.getElementById('waterintake');
-				var myChart = echarts.init(chartDom);
-				var option;
-				  option = {
-				     color: ['#1890FF', '#12DDA1', '#F78048', '#FFB026', '#FD4D63', 'rgba(255,255,255,.5)'],
-				     tooltip: {
-				         trigger: 'item',
-				         padding: [10, 10, 10, 10],
-				         formatter: '{b} :<br/> {d}%',
-				     },
-				     series: [
-				         {
-				             name: '',
-				             type: 'pie',
-				             radius: ['36%', '66%'],
-				             center: ['50%', '50%'],
-				             label: {
-				                 fontSize: 10,
-				                 color: '#00a0e5',
-				                 formatter: '{b} {c}',
-				                 // 自定义富文本样式
-				               
-				             },
-				             labelLine: {
-				                 show: true,
-				                 // length: 6,
-				                 // length2: 15
-				             },
-				             data: [
-				                 {
-				                     name: '双辽市',
-				                     value: '40',
-				                 },
-				                 {
-				                     name: '梨树县',
-				                     value: '25',
-				                 },
-				                 {
-				                     name: '伊通县',
-				                     value: '18',
-				                 },
-				                 {
-				                     name: '铁东区',
-				                     value: '12',
-				                 },
-				                 {
-				                     name: '铁西区',
-				                     value: '5',
-				                 },
-				             ],
-				         },
-				         {
-				             type: 'pie',
-				             radius: ['36%', '43%'],
-				             center: ['50%', '50%'],
-				             silent: true,
-				             data: [
-				                 {
-				                     name: '',
-				                     value: 1,
-				                 },
-				             ],
-				         },
-				     ],
-				 };
-				option && myChart.setOption(option);
-			},
-
-		},
-
-
-	}
-</script>
-
-<style rel="stylesheet/scss" lang="scss" scoped>
-	.chart-container {
-		width: 100%;
-		height: auto;
-		position: relative;
-		padding-bottom: 10px;
-		display: flex;
-	}
-</style>