File name
Commit message
Commit date
File name
Commit message
Commit date
File name
Commit message
Commit date
File name
Commit message
Commit date
<template>
<button @click="toggleSlide" class="toggle">{{ slideText }}</button>
<div class="grid2_8">
<div :class="['slide-content left', { active: showSlide }]">
<div class="wrap flex-between">
<div class="iconlist">
<ul>
<li
v-for="item in items"
:key="item.id"
:class="{ active: item.isActive }"
@click="toggleActive(item)"
>
<div></div>
<p>{{ item.name }}</p>
</li>
</ul>
</div>
<div class="search">
<h2 style="background: #00b050">무단횡단 분석</h2>
<h2>지역별</h2>
<div class="box" style="background: #eaebec">
<div class="grid3_7 gap m-b">
<label style="line-height: 3rem;">분석날짜</label>
<div class="flex gap" style="width: 90%;">
<input class="date-input" type="date" :max="max_limit_date" v-model="address['start_date']" />
<span>~</span>
<input class="date-input" type="date" :min="min_limit_date" :max="max_limit_date" v-model="address['end_date']" />
</div>
</div>
<div class="grid gap m-b">
<DongSelectList
@setDongCd="setDongCd"
:crslk_azHiddenCk="true"
></DongSelectList>
</div>
<div class="grid3_7 m-b gap">
<label for="">횡단보도</label>
<select v-show="!nodeSelectCk" name="crslk_azSelectList" id="crslk_azSelectList" @change="crslkSelectF($event)" v-model="address.crslk_az" >
<option :value="0">횡단보도</option>
</select>
<select v-show="nodeSelectCk" name="crslk_azSelectList" id="crslk_azSelectList" @change="crslkSelectF($event)" v-model="address.crslk_az" >
<option :value="0">횡단보도</option>
<option :value="10">북</option>
<option :value="50">북동</option>
<option :value="20">동</option>
<option :value="60">남동</option>
<option :value="30">남</option>
<option :value="70">남서</option>
<option :value="40">서</option>
<option :value="80">북서</option>
</select>
</div>
<div class="flex-center">
<button type="button" class="btn-l gr-btn search-btn" @click="statusSearch">
조회
</button>
</div>
</div>
<h2>검색결과</h2>
<div
class="box tab-buttons result"
style="height: calc(100% - 50rem)"
>
<div class="ulbox" style="" v-show="itemsCk == 1">
<h4>총 <em style="color: #13833b">{{wtrmsCrosngTotalCnt}}</em>건</h4>
<ul>
<li
class="result"
v-for="(item, idx) in wtrmsCrosngSearchResult"
:key="idx"
>
<h5>{{ idx + 1 }}</h5>
<p class="m-b">시도: {{ item.sido_nm }} {{ item.sigungu_nm }} {{ item.dong_nm }}</p>
<p class="m-b">
<em style="color: #13833b"><img src="../../../resources/images/icon/map.png" alt=""> {{ item.crslk_nm }}</em>
</p>
<p class="m-b">X좌표: {{ item.lat }}</p>
<p class="m-b">Y좌표: {{ item.lon }}</p>
<p class="">{{ searchResultState }} 수: {{ item.count }}</p>
</li>
</ul>
</div>
<div class="ulbox" style="" v-show="itemsCk == 2">
<h4>총 <em style="color: #13833b">{{signExtnCrosngTotalCnt}}</em>건</h4>
<ul>
<li
class="result"
v-for="(item, idx) in signExtnSearchResult"
:key="idx"
>
<h5>{{ idx + 1 }}</h5>
<p class="m-b">시도: {{ item.sido_nm }} {{ item.sigungu_nm }} {{ item.dong_nm }}</p>
<p class="m-b">
<em style="color: #13833b"><img src="../../../resources/images/icon/map.png" alt=""> {{ item.crslk_nm }}</em>
</p>
<p class="m-b">X좌표: {{ item.lat }}</p>
<p class="m-b">Y좌표: {{ item.lon }}</p>
<p class="">{{ searchResultState }} 수: {{ item.count }}</p>
</li>
</ul>
</div>
<div class="ulbox" style="" v-show="itemsCk == 3">
<h4>총 <em style="color: #13833b">{{rittrnVhcleCrosngTotalCnt}}</em>건</h4>
<ul>
<li
class="result"
v-for="(item, idx) in rittrnVhcleSearchResult"
:key="idx"
>
<h5>{{ idx + 1 }}</h5>
<p class="m-b">시도: {{ item.sido_nm }} {{ item.sigungu_nm }} {{ item.dong_nm }}</p>
<p class="m-b">
<em style="color: #13833b"><img src="../../../resources/images/icon/map.png" alt=""> {{ item.crslk_nm }}</em>
</p>
<p class="m-b">X좌표: {{ item.lat }}</p>
<p class="m-b">Y좌표: {{ item.lon }}</p>
<p class="">{{ searchResultState }} 수: {{ item.count }}</p>
</li>
</ul>
</div>
<div class="ulbox" style="" v-show="itemsCk == 4">
<h4>총 <em style="color: #13833b">{{troblOcrnCrosngTotalCnt}}</em>건</h4>
<ul>
<li
class="result"
v-for="(item, idx) in troblOcrnSearchResult"
:key="idx"
>
<h5>{{ idx + 1 }}</h5>
<p class="m-b">시도: {{ item.sido_nm }} {{ item.sigungu_nm }} {{ item.dong_nm }}</p>
<p class="m-b">
<em style="color: #13833b"><img src="../../../resources/images/icon/map.png" alt=""> {{ item.crslk_nm }}</em>
</p>
<p class="m-b">X좌표: {{ item.lat }}</p>
<p class="m-b">Y좌표: {{ item.lon }}</p>
<p class="">{{ searchResultState }} 수: {{ item.count }}</p>
</li>
</ul>
</div>
</div>
</div>
</div>
</div>
<div class="right">
<!-- <ClusterPopup></ClusterPopup> -->
<div class="top flex gap">
<button class="s-btn" @click="changeClusterLayer">클러스터</button>
<button class="s-btn" @click="changeLayer">레이어</button>
<button class="s-btn" @click="changeHeatmapLayer" >히트맵</button>
</div>
<OpenLayers ref="open_layers" />
</div>
</div>
<div class="chart grid gap">
<div class="boxwrap bg-white2 b-r b-shadow">
<h2>무단횡단 비율</h2>
<div class="flex boxwrap">
<div class="box tab-buttons">
<div class="btn_set flex-center">
<!-- <button
class="flex-between gray-btn"
v-for="tab in tabs3"
:key="tab.id"
:class="{ active: activeTab3 === tab.id }"
@click="changeTab3(tab.id)"
>
{{ tab.title }}
</button> -->
<button v-if="address.dong_cd.length==2" class="flex-between gray-btn" :class="{ active: activeTab3 === 1 }" @click="changeTab3(1)">시군구</button>
<button v-if="address.dong_cd.length==2 || address.dong_cd.length==5" class="flex-between gray-btn" :class="{ active: activeTab3 === 2 }" @click="changeTab3(2)">행정동</button>
<button v-if="address.dong_cd.length==5 || address.dong_cd.length==8 && address.node_id==null" class="flex-between gray-btn" :class="{ active: activeTab3 === 3 }" @click="changeTab3(3)">교차로</button>
<button v-if="address.dong_cd.length==8 || address.node_id" class="flex-between gray-btn" :class="{ active: activeTab3 === 4 }" @click="changeTab3(4)">횡단보도</button>
</div>
<div
class="tab-content"
v-for="tab in tabs3"
:key="tab.id"
v-show="activeTab3 === tab.id"
>
<div v-show="tab.content1 && address.dong_cd.length==2" class="box">
<Chart
:data="sigunguData"
:theme="themeList[8]"
:categoryDataList="categoryDataList"
:valueDataList="valueDataList"
></Chart>
</div>
<div v-show="tab.content2 && (address.dong_cd.length==2 || address.dong_cd.length==5)" class="box">
<Chart
:data="dongData"
:theme="themeList[8]"
:categoryDataList="categoryDataList"
:valueDataList="valueDataList"
></Chart>
</div>
<div v-show="tab.content3 && (address.dong_cd.length==5 || address.dong_cd.length==8 && address.node_id==null)" class="box">
<Chart
:data="nodeData"
:theme="themeList[8]"
:categoryDataList="categoryDataList"
:valueDataList="valueDataList"
></Chart>
</div>
<div v-show="tab.content4 && (address.dong_cd.length==8 || address.node_id)" class="box">
<Chart
:data="crslkData"
:theme="themeList[8]"
:categoryDataList="categoryDataList"
:valueDataList="valueDataList"
></Chart>
</div>
</div>
</div>
</div>
</div>
<div class="boxwrap bg-white2 b-r b-shadow">
<h2>발생 현황</h2>
<div class="grid" style="height: calc(100% - 34px); ">
<div class="box tab-buttons">
<div class="btn_set flex-center">
<button
class="flex-between gray-btn"
v-for="tab in tabs"
:key="tab.id"
:class="{ active: activeTab === tab.id }"
@click="changeTab(tab.id)"
>
{{ tab.title }}
</button>
</div>
<div
class="tab-content"
v-for="tab in tabs"
:key="tab.id"
v-show="activeTab === tab.id"
style="height: calc(100% - 3rem);"
>
<div v-show="tab.content1" class="" style="height: 100%">
<Chart
:data="monthData"
:theme="themeList[0]"
:categoryDataList="categoryDataList"
:valueDataList="valueDataList"
></Chart>
</div>
<div v-show="tab.content2" class="" style="height: 100%">
<Chart
:data="weekData"
:theme="themeList[0]"
:categoryDataList="categoryDataList"
:valueDataList="valueDataList"
></Chart>
</div>
</div>
</div>
<div class="box tab-buttons">
<div class="btn_set flex-center">
<button
class="flex-between gray-btn"
v-for="tab in tabs2"
:key="tab.id"
:class="{ active: activeTab2 === tab.id }"
@click="changeTab2(tab.id)"
>
{{ tab.title }}
</button>
</div>
<div
class="tab-content"
style="height: calc(100% - 3rem);"
v-for="tab in tabs2"
:key="tab.id"
v-show="activeTab2 === tab.id"
>
<div v-show="tab.content1" class="" style="height: 100%">
<Chart
:data="dayData"
:theme="themeList[0]"
:categoryDataList="categoryDataList"
:valueDataList="valueDataList"
></Chart>
</div>
<div v-show="tab.content2" class="" style="height: 100%">
<Chart
:data="timeData"
:theme="themeList[0]"
:categoryDataList="categoryDataList"
:valueDataList="valueDataList"
></Chart>
</div>
</div>
</div>
</div>
</div>
<div class="boxwrap bg-white2 b-r b-shadow">
<h2 v-if="address.dong_cd.length==2">시/군/구 발생현황</h2>
<h2 v-if="address.dong_cd.length==5">행정동 발생현황</h2>
<h2 v-if="address.dong_cd.length==8 && address.node_id==null">교차로 발생현황</h2>
<h2 v-if="address.node_id">횡단보도 발생현황</h2>
<div v-if="address.dong_cd.length==2" class="minichart">
<Chart
:data="sigunguData"
:theme="themeList[1]"
:categoryDataList="categoryDataList"
:valueDataList="valueDataList"
></Chart>
</div>
<div v-if="address.dong_cd.length==5" class="minichart">
<Chart
:data="dongData"
:theme="themeList[1]"
:categoryDataList="categoryDataList"
:valueDataList="valueDataList"
></Chart>
</div>
<div v-if="address.dong_cd.length==8 && address.node_id==null" class="minichart">
<Chart
:data="nodeData"
:theme="themeList[1]"
:categoryDataList="categoryDataList"
:valueDataList="valueDataList"
></Chart>
</div>
<div v-if="address.node_id" class="minichart">
<Chart
:data="crslkData"
:theme="themeList[1]"
:categoryDataList="categoryDataList"
:valueDataList="valueDataList"
></Chart>
</div>
</div>
</div>
</template>
<script>
import Chart from "../../component/chart/ChartMain.vue";
import Map from "../../component/map/map.vue";
import MapPage from "../../component/map/map.vue";
import OpenLayers from "../../component/OpenLayers.vue";
import ClusterPopup from "../../component/ClusterPopup.vue";
import {
vworldBaseLayer,
vworldGrayLayer,
vworldMidnightLayer,
vworldHybridLayer,
vworldSatelliteLayer,
} from "../../component/OpenLayersMap.vue";
import { baseStyles } from "../../component/OpenLayersStyle.vue";
import axios from "axios";
import DongSelectList from "../../component/dongSelectList.vue";
export default {
data() {
return {
address: {
//지역 설정
dong_cd: "22030",
siDo_dong_cd: "22",
guGun_dong_cd: "22030",
dong_dong_cd: null,
node_id: null,
node_name: null,
zoomLevel: null,
crslk_az: "0",
coordinate: [],
baseSource: "EPSG:5181",
//일자
start_date: null,
end_date: null,
status:null,
},
max_limit_date: null,
min_limit_date: null,
searchResultState: "무단횡단 발생",
wtrmsCrosngSearchResult:[],
wtrmsCrosngTotalCnt:0,
signExtnSearchResult:[],
signExtnCrosngTotalCnt:0,
rittrnVhcleSearchResult:[],
rittrnVhcleCrosngTotalCnt:0,
troblOcrnSearchResult:[],
troblOcrnCrosngTotalCnt:0,
showSlide: false,
slideText: "검색하기",
tabs: [
{
id: 1,
title: "월별",
content1: "This is the content for Tab 1",
},
{
id: 2,
title: "요일별",
content2: "This is the content for Tab 2",
},
],
tabs2: [
{
id: 1,
title: "일별",
content1: "This is the content for Tab 1",
},
{
id: 2,
title: "시간별",
content2: "This is the content for Tab 2",
},
],
tabs3: [
{
id: 1,
title: "시군구",
content1: "This is the content for Tab 1",
},
{
id: 2,
title: "행정동",
content2: "This is the content for Tab 2",
},
{
id: 3,
title: "교차로",
content3: "This is the content for Tab 3",
},
{
id: 4,
title: "횡단보도",
content4: "This is the content for Tab 4",
},
],
activeTab: 1,
activeTab2: 1,
activeTab3: 2,
items: [
{ id: 1, name: "무단횡단", isActive: true },
{ id: 2, name: "신호연장", isActive: false },
{ id: 3, name: "우회전 차량", isActive: false },
{ id: 4, name: "장애발생", isActive: false },
],
itemsCk : 1,
//클러스터 체크
clusterCk: true,
//레이어 체크
layerCk: false,
//히트맵 체크
heatmapCk: false,
nodeSelectCk:false,
// 차트 데이터
monthData: [
{
category: "1월",
value1: 1000,
},
{
category: "2월",
value1: 1200,
},
{
category: "3월",
value1: 850,
},
{
category: "4월",
value1: 1050,
},
{
category: "5월",
value1: 953,
},
{
category: "6월",
value1: 815,
},
{
category: "7월",
value1: 780,
},
{
category: "8월",
value1: 0,
},
{
category: "9월",
value1: 0,
},
{
category: "10월",
value1: 0,
},
{
category: "11월",
value1: 0,
},
{
category: "12월",
value1: 0,
},
],
dayData: [
{
category: "1일",
value1: 30,
},
{
category: "2일",
value1: 12,
},
{
category: "3일",
value1: 24,
},
{
category: "4일",
value1: 19,
},
{
category: "5일",
value1: 31,
},
{
category: "6일",
value1: 15,
},
{
category: "7일",
value1: 18,
},
{
category: "8일",
value1: 24,
},
{
category: "9일",
value1: 39,
},
{
category: "10일",
value1: 25,
},
{
category: "11일",
value1: 16,
},
{
category: "12일",
value1: 14,
},
{
category: "13일",
value1: 14,
},
{
category: "14일",
value1: 20,
},
{
category: "15일",
value1: 21,
},
{
category: "16일",
value1: 25,
},
{
category: "17일",
value1: 31,
},
{
category: "18일",
value1: 33,
},
{
category: "19일",
value1: 42,
},
{
category: "20일",
value1: 24,
},
{
category: "21일",
value1: 28,
},
{
category: "22일",
value1: 30,
},
{
category: "23일",
value1: 22,
},
{
category: "24일",
value1: 15,
},
{
category: "25일",
value1: 15,
},
{
category: "26일",
value1: 15,
},
{
category: "27일",
value1: 15,
},
{
category: "28일",
value1: 15,
},
{
category: "29일",
value1: 15,
},
{
category: "30일",
value1: 15,
},
{
category: "31일",
value1: 15,
},
],
timeData: [
{
category: "1시",
value1: 30,
},
{
category: "2시",
value1: 12,
},
{
category: "3시",
value1: 24,
},
{
category: "4시",
value1: 19,
},
{
category: "5시",
value1: 31,
},
{
category: "6시",
value1: 15,
},
{
category: "7시",
value1: 18,
},
{
category: "8시",
value1: 24,
},
{
category: "9시",
value1: 39,
},
{
category: "10시",
value1: 25,
},
{
category: "11시",
value1: 16,
},
{
category: "12시",
value1: 14,
},
{
category: "13시",
value1: 14,
},
{
category: "14시",
value1: 20,
},
{
category: "15시",
value1: 21,
},
{
category: "16시",
value1: 25,
},
{
category: "17시",
value1: 31,
},
{
category: "18시",
value1: 33,
},
{
category: "19시",
value1: 42,
},
{
category: "20시",
value1: 24,
},
{
category: "21시",
value1: 28,
},
{
category: "22시",
value1: 30,
},
{
category: "23시",
value1: 22,
},
{
category: "24시",
value1: 15,
},
],
weekData: [
{
category: "월요일",
value1: 1000,
},
{
category: "화요일",
value1: 1200,
},
{
category: "수요일",
value1: 850,
},
{
category: "목요일",
value1: 1050,
},
{
category: "금요일",
value1: 953,
},
{
category: "토요일",
value1: 815,
},
{
category: "일요일",
value1: 780,
},
],
nodeData: [
{
category: "이현네거리",
value1: 1000,
},
{
category: "광덕무역(A)",
value1: 1200,
},
{
category: "대웅산업사(A)",
value1: 850,
},
{
category: "달서초등(A)",
value1: 1050,
},
{
category: "에덴둥지맨션",
value1: 953,
},
{
category: "남평네거리",
value1: 815,
},
{
category: "신평네거리",
value1: 780,
},
{
category: "평리네거리",
value1: 624,
},
{
category: "평리광명네거리",
value1: 592,
},
{
category: "세븐일레븐대구대평중",
value1: 500,
},
{
category: "비산초등",
value1: 492,
},
{
category: "내당역네거리",
value1: 330,
},
{
category: "북비산네거리",
value1: 324,
},
{
category: "북부벙류장",
value1: 200,
},
],
crslkData:[],
heatMapData: [
{
week: "Monday",
quarter: "0-6시",
category2: "동구",
value1: 1000,
value2: 588,
},
{
week: "Monday",
quarter: "7-12시",
category2: "동구",
value1: 1200,
value2: 1800,
},
{
week: "Monday",
quarter: "13-18시",
category2: "동구",
value1: 850,
value2: 1230,
},
{
week: "Monday",
quarter: "19-24시",
category2: "동구",
value1: 1050,
value2: 950,
},
{
week: "Tuesday",
quarter: "0-6시",
category2: "중구",
value1: 2000,
value2: 458,
},
{
week: "Tuesday",
quarter: "7-12시",
category2: "중구",
value1: 4000,
value2: 2100,
},
{
week: "Tuesday",
quarter: "13-18시",
category2: "중구",
value1: 2500,
value2: 1430,
},
{
week: "Tuesday",
quarter: "19-24시",
category2: "중구",
value1: 3100,
value2: 1150,
},
{
week: "Wednesday",
quarter: "0-6시",
category2: "동구",
value1: 1800,
value2: 1588,
},
{
week: "Wednesday",
quarter: "7-12시",
category2: "중구",
value1: 4200,
value2: 900,
},
{
week: "Wednesday",
quarter: "13-18시",
category2: "서구",
value1: 3500,
value2: 430,
},
{
week: "Wednesday",
quarter: "19-24시",
category2: "남구",
value1: 2300,
value2: 1850,
},
],
sigunguData:[ {
country: "서구",
value: 2504,
},
{
country: "중구",
value: 4011,
},
{
country: "남구",
value: 3224,
},
{
country: "동구",
value: 4523,
},
{
country: "수성구",
value: 4342,
},],
// Set data
dongData: [
{
country: "평리동",
value: 2504,
},
{
country: "운대동",
value: 4011,
},
{
country: "내당동",
value: 3224,
},
{
country: "상중이동",
value: 4523,
},
{
country: "비산동",
value: 4342,
},
],
endDateOptions:{
disabledDate: this.disabledEdDate,
},
// 차트 테마 목록
themeList: [
"XY",
"YX",
"ClusterXY",
"ClusterYX",
"StackXY",
"StackYX",
"Line",
"ClusterLine",
"Pie",
"Donut",
"HeatMap",
],
};
},
components: {
ClusterPopup: ClusterPopup,
Chart: Chart,
MapPage: MapPage,
Map,
OpenLayers: OpenLayers,
DongSelectList: DongSelectList,
},
methods: {
//통계분석 조회 결과
analysisSearch() {
const vm = this;
axios({
url: "/statisticalAnalysis/analysisSearch.json",
method: "post",
headers: {
"Content-Type": "application/json; charset=UTF-8",
},
data: vm.address,
}).then(function (response) {
// console.log("analysisSearch response : ",response.data);
vm.wtrmsCrosngTotalCnt=0;
vm.signExtnCrosngTotalCnt=0;
vm.rittrnVhcleCrosngTotalCnt=0;
vm.troblOcrnCrosngTotalCnt=0;
for(var i = 0 ; i<response.data.wtrmsCrosng.length; i++){
vm.wtrmsCrosngTotalCnt+=response.data.wtrmsCrosng[i].count;
}
for(var i = 0 ; i<response.data.signExtn.length; i++){
vm.signExtnCrosngTotalCnt+=response.data.signExtn[i].count;
}
for(var i = 0 ; i<response.data.rittrnVhcle.length; i++){
vm.rittrnVhcleCrosngTotalCnt+=response.data.rittrnVhcle[i].count;
}
for(var i = 0 ; i<response.data.troblOcrn.length; i++){
vm.troblOcrnCrosngTotalCnt+=response.data.troblOcrn[i].count;
}
vm.wtrmsCrosngSearchResult=response.data.wtrmsCrosng;
vm.signExtnSearchResult=response.data.signExtn;
vm.rittrnVhcleSearchResult=response.data.rittrnVhcle;
vm.troblOcrnSearchResult=response.data.troblOcrn;
})
.catch(function (error) {
console.log("analysisSearch - error : ", error);
alert("통계분석 조회 오류, 관리자에게 문의해주세요.");
});
},
//상황발생 정보 목록 조회
statisticalAnalysisAll(url) {
const vm = this;
axios({
url: url,
method: "post",
headers: {
"Content-Type": "application/json; charset=UTF-8",
},
data: vm.address,
}).then(function (response) {
// console.log("statisticalAnalysisAll response : ",response.data);
const testData={sigungu_nm:"수성구", wtrms_crosng_cnt:0};
vm.sigunguData=response.data.sigunguCount;
vm.dongData=response.data.dongCount;
vm.nodeData=response.data.nodeCount;
vm.crslkData=response.data.crslkCount;
vm.dayData=response.data.dayCount;
vm.weekData=response.data.dayOfWeekCount;
vm.timeData=response.data.hourCount;
vm.monthData=response.data.monthCount;
})
.catch(function (error) {
console.log("statisticalAnalysisAll - error : ", error);
alert("통계분석 상황발생 정보 조회 오류, 관리자에게 문의해주세요.");
});
},
//DongSelectList에서 dong_cd 받아오기
setDongCd(value) {
// console.log("value : ", value);
this.address = value;
},
//시/도/군/구 Select 선택시 바로 위치 이동
siDoGunGuSelectF: function (event) {
this.activeTab3=2;
this.analysisSearch();
this.nodeSelectCk=false;
this.address.crslk_az=0;
if (this.itemsCk == 1) {
this.statisticalAnalysisAll("/statisticalAnalysis/statisticalAnalysisJaywalk.json");
if (this.clusterCk) {
this.$refs.open_layers.removeLayerAll();
this.$refs.open_layers.setBaseMap(vworldBaseLayer, event.target.value);
this.$refs.open_layers.addVectorLayerAutoSizeByUrl("/common/getDongsGeoJson.json","multiPolygonLayer","EPSG:5181",baseStyles["MultiPolygon"],"MultiPolygon",this.address.dong_cd);
this.$refs.open_layers.addClusterLayerByUrl( "/common/getNodeGeoJsonWtrmsCrosngAnalysis.json", "clusterLayer", "EPSG:5181", baseStyles["clusterStyle"], "clusterStyle", this.address );
} else if (this.layerCk) {
this.$refs.open_layers.removeLayerAll();
this.$refs.open_layers.setBaseMap(vworldBaseLayer, event.target.value);
this.$refs.open_layers.addVectorLayerAutoSizeByUrl("/common/getDongsGeoJson.json","multiPolygonLayer","EPSG:5181",baseStyles["MultiPolygon"],"MultiPolygon",this.address.dong_cd);
this.$refs.open_layers.addLayerTypeLayer("/common/getPolygonGeoJsonWtrmsCrosngLayerTypeCntAnalysis.json","multiPolygonForAnalysis","EPSG:5181",baseStyles["MultiPolygonForAnalysis"],"MultiPolygonForAnalysis",this.address);
this.$refs.open_layers.addLayerTypeLayer("/common/getGeoJsonWtrmsCrosngLayerTypeCntAnalysis.json","labelForAnalysis","EPSG:5181",baseStyles["labelForAnalysis"],"labelForAnalysis",this.address);
}else if (this.heatmapCk) {
this.$refs.open_layers.removeLayerAll();
this.$refs.open_layers.setBaseMap(vworldBaseLayer, event.target.value);
this.$refs.open_layers.addVectorLayerAutoSizeByUrl("/common/getDongsGeoJson.json","multiPolygonLayer","EPSG:5181",baseStyles["MultiPolygon"],"MultiPolygon",this.address.dong_cd);
this.$refs.open_layers.addHeatmapLayer( "/common/getNodeGeoJsonWtrmsCrosngAnalysis.json", "clusterLayer", "EPSG:5181", baseStyles["clusterStyle"], "clusterStyle", this.address );
}
}
else if (this.itemsCk == 2) {
this.statisticalAnalysisAll("/statisticalAnalysis/statisticalAnalysisSignalExtension.json");
if (this.clusterCk) {
this.$refs.open_layers.removeLayerAll();
this.$refs.open_layers.setBaseMap(vworldBaseLayer, event.target.value);
this.$refs.open_layers.addVectorLayerAutoSizeByUrl("/common/getDongsGeoJson.json","multiPolygonLayer","EPSG:5181",baseStyles["MultiPolygon"],"MultiPolygon",this.address.dong_cd);
this.$refs.open_layers.addClusterLayerByUrl( "/common/getNodeGeoJsonSignExtnAnalysis.json", "clusterLayer", "EPSG:5181", baseStyles["clusterStyle"], "clusterStyle", this.address );
}else if (this.layerCk) {
this.$refs.open_layers.removeLayerAll();
this.$refs.open_layers.setBaseMap(vworldBaseLayer, event.target.value);
this.$refs.open_layers.addVectorLayerAutoSizeByUrl("/common/getDongsGeoJson.json","multiPolygonLayer","EPSG:5181",baseStyles["MultiPolygon"],"MultiPolygon",this.address.dong_cd);
this.$refs.open_layers.addLayerTypeLayer("/common/getPolygonGeoJsonSignExtnLayerTypeCntAnalysis.json","multiPolygonForAnalysis","EPSG:5181",baseStyles["MultiPolygonForAnalysis"],"MultiPolygonForAnalysis",this.address);
this.$refs.open_layers.addLayerTypeLayer("/common/getGeoJsonSignExtnLayerTypeCntAnalysis.json","labelForAnalysis","EPSG:5181",baseStyles["labelForAnalysis"],"labelForAnalysis",this.address);
}else if (this.heatmapCk) {
this.$refs.open_layers.removeLayerAll();
this.$refs.open_layers.setBaseMap(vworldBaseLayer, event.target.value);
this.$refs.open_layers.addVectorLayerAutoSizeByUrl("/common/getDongsGeoJson.json","multiPolygonLayer","EPSG:5181",baseStyles["MultiPolygon"],"MultiPolygon",this.address.dong_cd);
this.$refs.open_layers.addHeatmapLayer( "/common/getNodeGeoJsonSignExtnAnalysis.json", "clusterLayer", "EPSG:5181", baseStyles["clusterStyle"], "clusterStyle", this.address );
}
}
else if (this.itemsCk == 3) {
this.statisticalAnalysisAll("/statisticalAnalysis/statisticalAnalysisSignalViolation.json");
if (this.clusterCk) {
this.$refs.open_layers.removeLayerAll();
this.$refs.open_layers.setBaseMap(vworldBaseLayer, event.target.value);
this.$refs.open_layers.addClusterLayerByUrl( "/common/getNodeGeoJsonRittrnVhcleAnalysis.json", "clusterLayer", "EPSG:5181", baseStyles["clusterStyle"], "clusterStyle", this.address );
}else if (this.layerCk) {
this.$refs.open_layers.removeLayerAll();
this.$refs.open_layers.setBaseMap(vworldBaseLayer, event.target.value);
this.$refs.open_layers.addVectorLayerAutoSizeByUrl("/common/getDongsGeoJson.json","multiPolygonLayer","EPSG:5181",baseStyles["MultiPolygon"],"MultiPolygon",this.address.dong_cd);
this.$refs.open_layers.addLayerTypeLayer("/common/getPolygonGeoJsonRittrnVhcleLayerTypeCntAnalysis.json","multiPolygonForAnalysis","EPSG:5181",baseStyles["MultiPolygonForAnalysis"],"MultiPolygonForAnalysis",this.address);
this.$refs.open_layers.addLayerTypeLayer("/common/getGeoJsonRittrnVhcleLayerTypeCntAnalysis.json","labelForAnalysis","EPSG:5181",baseStyles["labelForAnalysis"],"labelForAnalysis",this.address);
}else if (this.heatmapCk) {
this.$refs.open_layers.removeLayerAll();
this.$refs.open_layers.setBaseMap(vworldBaseLayer, event.target.value);
this.$refs.open_layers.addVectorLayerAutoSizeByUrl("/common/getDongsGeoJson.json","multiPolygonLayer","EPSG:5181",baseStyles["MultiPolygon"],"MultiPolygon",this.address.dong_cd);
this.$refs.open_layers.addHeatmapLayer( "/common/getNodeGeoJsonRittrnVhcleAnalysis.json", "clusterLayer", "EPSG:5181", baseStyles["clusterStyle"], "clusterStyle", this.address );
}
}
else if (this.itemsCk == 4) {
this.statisticalAnalysisAll("/statisticalAnalysis/statisticalAnalysisError.json");
if (this.clusterCk) {
this.$refs.open_layers.removeLayerAll();
this.$refs.open_layers.setBaseMap(vworldBaseLayer, event.target.value);
this.$refs.open_layers.addClusterLayerByUrl( "/common/getNodeGeoJsonTroblOcrnAnalysis.json", "clusterLayer", "EPSG:5181", baseStyles["clusterStyle"], "clusterStyle", this.address );
}else if (this.layerCk) {
this.$refs.open_layers.removeLayerAll();
this.$refs.open_layers.setBaseMap(vworldBaseLayer, event.target.value);
this.$refs.open_layers.addVectorLayerAutoSizeByUrl("/common/getDongsGeoJson.json","multiPolygonLayer","EPSG:5181",baseStyles["MultiPolygon"],"MultiPolygon",this.address.dong_cd);
this.$refs.open_layers.addLayerTypeLayer("/common/getPolygonGeoJsonTroblOcrnLayerTypeCntAnalysis.json","multiPolygonForAnalysis","EPSG:5181",baseStyles["MultiPolygonForAnalysis"],"MultiPolygonForAnalysis",this.address);
this.$refs.open_layers.addLayerTypeLayer("/common/getGeoJsonTroblOcrnLayerTypeCntAnalysis.json","labelForAnalysis","EPSG:5181",baseStyles["labelForAnalysis"],"labelForAnalysis",this.address);
}else if (this.heatmapCk) {
this.$refs.open_layers.removeLayerAll();
this.$refs.open_layers.setBaseMap(vworldBaseLayer, event.target.value);
this.$refs.open_layers.addVectorLayerAutoSizeByUrl("/common/getDongsGeoJson.json","multiPolygonLayer","EPSG:5181",baseStyles["MultiPolygon"],"MultiPolygon",this.address.dong_cd);
this.$refs.open_layers.addHeatmapLayer( "/common/getNodeGeoJsonTroblOcrnAnalysis.json", "clusterLayer", "EPSG:5181", baseStyles["clusterStyle"], "clusterStyle", this.address );
}
}
},
//행정동 Select 선택시 바로 위치 이동
dongSelectF: function (event) {
this.activeTab3=3;
this.analysisSearch();
this.nodeSelectCk=false;
this.address.crslk_az=0;
if (this.itemsCk == 1) {
this.statisticalAnalysisAll("/statisticalAnalysis/statisticalAnalysisJaywalk.json");
if (this.clusterCk) {
this.$refs.open_layers.removeLayerAll();
this.$refs.open_layers.setBaseMap(vworldBaseLayer, event.target.value);
this.$refs.open_layers.addVectorLayerAutoSizeByUrl("/common/getDongsGeoJson.json","multiPolygonLayer","EPSG:5181",baseStyles["MultiPolygon"],"MultiPolygon",this.address.dong_cd);
this.$refs.open_layers.addClusterLayerByUrl( "/common/getNodeGeoJsonWtrmsCrosngAnalysis.json", "clusterLayer", "EPSG:5181", baseStyles["clusterStyle"], "clusterStyle", this.address );
} else if (this.layerCk) {
this.$refs.open_layers.removeLayerAll();
this.$refs.open_layers.setBaseMap(vworldBaseLayer, event.target.value);
this.$refs.open_layers.addVectorLayerAutoSizeByUrl("/common/getDongsGeoJson.json","multiPolygonLayer","EPSG:5181",baseStyles["MultiPolygon"],"MultiPolygon",this.address.dong_cd);
this.$refs.open_layers.addLayerTypeLayer("/common/getPolygonGeoJsonWtrmsCrosngLayerTypeCntAnalysis.json","multiPolygonForAnalysis","EPSG:5181",baseStyles["MultiPolygonForAnalysis"],"MultiPolygonForAnalysis",this.address);
this.$refs.open_layers.addLayerTypeLayer("/common/getGeoJsonWtrmsCrosngLayerTypeCntAnalysis.json","labelForAnalysis","EPSG:5181",baseStyles["labelForAnalysis"],"labelForAnalysis",this.address);
}else if (this.heatmapCk) {
this.$refs.open_layers.removeLayerAll();
this.$refs.open_layers.setBaseMap(vworldBaseLayer, event.target.value);
this.$refs.open_layers.addVectorLayerAutoSizeByUrl("/common/getDongsGeoJson.json","multiPolygonLayer","EPSG:5181",baseStyles["MultiPolygon"],"MultiPolygon",this.address.dong_cd);
this.$refs.open_layers.addHeatmapLayer( "/common/getNodeGeoJsonWtrmsCrosngAnalysis.json", "clusterLayer", "EPSG:5181", baseStyles["clusterStyle"], "clusterStyle", this.address );
}
}
else if (this.itemsCk == 2) {
this.statisticalAnalysisAll("/statisticalAnalysis/statisticalAnalysisSignalExtension.json");
if (this.clusterCk) {
this.$refs.open_layers.removeLayerAll();
this.$refs.open_layers.setBaseMap(vworldBaseLayer, event.target.value);
this.$refs.open_layers.addVectorLayerAutoSizeByUrl("/common/getDongsGeoJson.json","multiPolygonLayer","EPSG:5181",baseStyles["MultiPolygon"],"MultiPolygon",this.address.dong_cd);
this.$refs.open_layers.addClusterLayerByUrl( "/common/getNodeGeoJsonSignExtnAnalysis.json", "clusterLayer", "EPSG:5181", baseStyles["clusterStyle"], "clusterStyle", this.address );
}else if (this.layerCk) {
this.$refs.open_layers.removeLayerAll();
this.$refs.open_layers.setBaseMap(vworldBaseLayer, event.target.value);
this.$refs.open_layers.addVectorLayerAutoSizeByUrl("/common/getDongsGeoJson.json","multiPolygonLayer","EPSG:5181",baseStyles["MultiPolygon"],"MultiPolygon",this.address.dong_cd);
this.$refs.open_layers.addLayerTypeLayer("/common/getPolygonGeoJsonSignExtnLayerTypeCntAnalysis.json","multiPolygonForAnalysis","EPSG:5181",baseStyles["MultiPolygonForAnalysis"],"MultiPolygonForAnalysis",this.address);
this.$refs.open_layers.addLayerTypeLayer("/common/getGeoJsonSignExtnLayerTypeCntAnalysis.json","labelForAnalysis","EPSG:5181",baseStyles["labelForAnalysis"],"labelForAnalysis",this.address);
}else if (this.heatmapCk) {
this.$refs.open_layers.removeLayerAll();
this.$refs.open_layers.setBaseMap(vworldBaseLayer, event.target.value);
this.$refs.open_layers.addVectorLayerAutoSizeByUrl("/common/getDongsGeoJson.json","multiPolygonLayer","EPSG:5181",baseStyles["MultiPolygon"],"MultiPolygon",this.address.dong_cd);
this.$refs.open_layers.addHeatmapLayer( "/common/getNodeGeoJsonSignExtnAnalysis.json", "clusterLayer", "EPSG:5181", baseStyles["clusterStyle"], "clusterStyle", this.address );
}
}
else if (this.itemsCk == 3) {
this.statisticalAnalysisAll("/statisticalAnalysis/statisticalAnalysisSignalViolation.json");
if (this.clusterCk) {
this.$refs.open_layers.removeLayerAll();
this.$refs.open_layers.setBaseMap(vworldBaseLayer, event.target.value);
this.$refs.open_layers.addClusterLayerByUrl( "/common/getNodeGeoJsonRittrnVhcleAnalysis.json", "clusterLayer", "EPSG:5181", baseStyles["clusterStyle"], "clusterStyle", this.address );
}else if (this.layerCk) {
this.$refs.open_layers.removeLayerAll();
this.$refs.open_layers.setBaseMap(vworldBaseLayer, event.target.value);
this.$refs.open_layers.addVectorLayerAutoSizeByUrl("/common/getDongsGeoJson.json","multiPolygonLayer","EPSG:5181",baseStyles["MultiPolygon"],"MultiPolygon",this.address.dong_cd);
this.$refs.open_layers.addLayerTypeLayer("/common/getPolygonGeoJsonRittrnVhcleLayerTypeCntAnalysis.json","multiPolygonForAnalysis","EPSG:5181",baseStyles["MultiPolygonForAnalysis"],"MultiPolygonForAnalysis",this.address);
this.$refs.open_layers.addLayerTypeLayer("/common/getGeoJsonRittrnVhcleLayerTypeCntAnalysis.json","labelForAnalysis","EPSG:5181",baseStyles["labelForAnalysis"],"labelForAnalysis",this.address);
}else if (this.heatmapCk) {
this.$refs.open_layers.removeLayerAll();
this.$refs.open_layers.setBaseMap(vworldBaseLayer, event.target.value);
this.$refs.open_layers.addVectorLayerAutoSizeByUrl("/common/getDongsGeoJson.json","multiPolygonLayer","EPSG:5181",baseStyles["MultiPolygon"],"MultiPolygon",this.address.dong_cd);
this.$refs.open_layers.addHeatmapLayer( "/common/getNodeGeoJsonRittrnVhcleAnalysis.json", "clusterLayer", "EPSG:5181", baseStyles["clusterStyle"], "clusterStyle", this.address );
}
}
else if (this.itemsCk == 4) {
this.statisticalAnalysisAll("/statisticalAnalysis/statisticalAnalysisError.json");
if (this.clusterCk) {
this.$refs.open_layers.removeLayerAll();
this.$refs.open_layers.setBaseMap(vworldBaseLayer, event.target.value);
this.$refs.open_layers.addClusterLayerByUrl( "/common/getNodeGeoJsonTroblOcrnAnalysis.json", "clusterLayer", "EPSG:5181", baseStyles["clusterStyle"], "clusterStyle", this.address );
}else if (this.layerCk) {
this.$refs.open_layers.removeLayerAll();
this.$refs.open_layers.setBaseMap(vworldBaseLayer, event.target.value);
this.$refs.open_layers.addVectorLayerAutoSizeByUrl("/common/getDongsGeoJson.json","multiPolygonLayer","EPSG:5181",baseStyles["MultiPolygon"],"MultiPolygon",this.address.dong_cd);
this.$refs.open_layers.addLayerTypeLayer("/common/getPolygonGeoJsonTroblOcrnLayerTypeCntAnalysis.json","multiPolygonForAnalysis","EPSG:5181",baseStyles["MultiPolygonForAnalysis"],"MultiPolygonForAnalysis",this.address);
this.$refs.open_layers.addLayerTypeLayer("/common/getGeoJsonTroblOcrnLayerTypeCntAnalysis.json","labelForAnalysis","EPSG:5181",baseStyles["labelForAnalysis"],"labelForAnalysis",this.address);
}else if (this.heatmapCk) {
this.$refs.open_layers.removeLayerAll();
this.$refs.open_layers.setBaseMap(vworldBaseLayer, event.target.value);
this.$refs.open_layers.addVectorLayerAutoSizeByUrl("/common/getDongsGeoJson.json","multiPolygonLayer","EPSG:5181",baseStyles["MultiPolygon"],"MultiPolygon",this.address.dong_cd);
this.$refs.open_layers.addHeatmapLayer( "/common/getNodeGeoJsonTroblOcrnAnalysis.json", "clusterLayer", "EPSG:5181", baseStyles["clusterStyle"], "clusterStyle", this.address );
}
}
},
//노드 Select 선택시 바로 위치 이동 횡단보도 노드
nodeSelectF: function (event) {
this.activeTab3=4;
this.analysisSearch();
this.nodeSelectCk=true;
this.address.crslk_az=0;
if (this.itemsCk == 1) {
this.statisticalAnalysisAll("/statisticalAnalysis/statisticalAnalysisJaywalk.json");
if (this.clusterCk) {
this.$refs.open_layers.removeLayerAll();
this.$refs.open_layers.setBaseMap(vworldBaseLayer, event.target.value);
this.$refs.open_layers.addVectorLayerAutoSizeByUrl("/common/getDongsGeoJson.json","multiPolygonLayer","EPSG:5181",baseStyles["MultiPolygon"],"MultiPolygon",this.address.dong_cd);
this.$refs.open_layers.addClusterLayerByUrl( "/common/getNodeGeoJsonWtrmsCrosngAnalysis.json", "clusterLayer", "EPSG:5181", baseStyles["clusterStyle"], "clusterStyle", this.address );
} else if (this.layerCk) {
this.$refs.open_layers.removeLayerAll();
this.$refs.open_layers.setBaseMap(vworldBaseLayer, event.target.value);
this.$refs.open_layers.addVectorLayerAutoSizeByUrl("/common/getDongsGeoJson.json","multiPolygonLayer","EPSG:5181",baseStyles["MultiPolygon"],"MultiPolygon",this.address.dong_cd);
this.$refs.open_layers.addLayerTypeLayer("/common/getPolygonGeoJsonWtrmsCrosngLayerTypeCntAnalysis.json","multiPolygonForAnalysis","EPSG:5181",baseStyles["MultiPolygonForAnalysis"],"MultiPolygonForAnalysis",this.address);
this.$refs.open_layers.addLayerTypeLayer("/common/getGeoJsonWtrmsCrosngLayerTypeCntAnalysis.json","labelForAnalysis","EPSG:5181",baseStyles["labelForAnalysis"],"labelForAnalysis",this.address);
}else if (this.heatmapCk) {
this.$refs.open_layers.removeLayerAll();
this.$refs.open_layers.setBaseMap(vworldBaseLayer, event.target.value);
this.$refs.open_layers.addVectorLayerAutoSizeByUrl("/common/getDongsGeoJson.json","multiPolygonLayer","EPSG:5181",baseStyles["MultiPolygon"],"MultiPolygon",this.address.dong_cd);
this.$refs.open_layers.addHeatmapLayer( "/common/getNodeGeoJsonWtrmsCrosngAnalysis.json", "clusterLayer", "EPSG:5181", baseStyles["clusterStyle"], "clusterStyle", this.address );
}
}
else if (this.itemsCk == 2) {
this.statisticalAnalysisAll("/statisticalAnalysis/statisticalAnalysisSignalExtension.json");
if (this.clusterCk) {
this.$refs.open_layers.removeLayerAll();
this.$refs.open_layers.setBaseMap(vworldBaseLayer, event.target.value);
this.$refs.open_layers.addVectorLayerAutoSizeByUrl("/common/getDongsGeoJson.json","multiPolygonLayer","EPSG:5181",baseStyles["MultiPolygon"],"MultiPolygon",this.address.dong_cd);
this.$refs.open_layers.addClusterLayerByUrl( "/common/getNodeGeoJsonSignExtnAnalysis.json", "clusterLayer", "EPSG:5181", baseStyles["clusterStyle"], "clusterStyle", this.address );
}else if (this.layerCk) {
this.$refs.open_layers.removeLayerAll();
this.$refs.open_layers.setBaseMap(vworldBaseLayer, event.target.value);
this.$refs.open_layers.addVectorLayerAutoSizeByUrl("/common/getDongsGeoJson.json","multiPolygonLayer","EPSG:5181",baseStyles["MultiPolygon"],"MultiPolygon",this.address.dong_cd);
this.$refs.open_layers.addLayerTypeLayer("/common/getPolygonGeoJsonSignExtnLayerTypeCntAnalysis.json","multiPolygonForAnalysis","EPSG:5181",baseStyles["MultiPolygonForAnalysis"],"MultiPolygonForAnalysis",this.address);
this.$refs.open_layers.addLayerTypeLayer("/common/getGeoJsonSignExtnLayerTypeCntAnalysis.json","labelForAnalysis","EPSG:5181",baseStyles["labelForAnalysis"],"labelForAnalysis",this.address);
}else if (this.heatmapCk) {
this.$refs.open_layers.removeLayerAll();
this.$refs.open_layers.setBaseMap(vworldBaseLayer, event.target.value);
this.$refs.open_layers.addVectorLayerAutoSizeByUrl("/common/getDongsGeoJson.json","multiPolygonLayer","EPSG:5181",baseStyles["MultiPolygon"],"MultiPolygon",this.address.dong_cd);
this.$refs.open_layers.addHeatmapLayer( "/common/getNodeGeoJsonSignExtnAnalysis.json", "clusterLayer", "EPSG:5181", baseStyles["clusterStyle"], "clusterStyle", this.address );
}
}
else if (this.itemsCk == 3) {
this.statisticalAnalysisAll("/statisticalAnalysis/statisticalAnalysisSignalViolation.json");
if (this.clusterCk) {
this.$refs.open_layers.removeLayerAll();
this.$refs.open_layers.setBaseMap(vworldBaseLayer, event.target.value);
this.$refs.open_layers.addClusterLayerByUrl( "/common/getNodeGeoJsonRittrnVhcleAnalysis.json", "clusterLayer", "EPSG:5181", baseStyles["clusterStyle"], "clusterStyle", this.address );
}else if (this.layerCk) {
this.$refs.open_layers.removeLayerAll();
this.$refs.open_layers.setBaseMap(vworldBaseLayer, event.target.value);
this.$refs.open_layers.addVectorLayerAutoSizeByUrl("/common/getDongsGeoJson.json","multiPolygonLayer","EPSG:5181",baseStyles["MultiPolygon"],"MultiPolygon",this.address.dong_cd);
this.$refs.open_layers.addLayerTypeLayer("/common/getPolygonGeoJsonRittrnVhcleLayerTypeCntAnalysis.json","multiPolygonForAnalysis","EPSG:5181",baseStyles["MultiPolygonForAnalysis"],"MultiPolygonForAnalysis",this.address);
this.$refs.open_layers.addLayerTypeLayer("/common/getGeoJsonRittrnVhcleLayerTypeCntAnalysis.json","labelForAnalysis","EPSG:5181",baseStyles["labelForAnalysis"],"labelForAnalysis",this.address);
}else if (this.heatmapCk) {
this.$refs.open_layers.removeLayerAll();
this.$refs.open_layers.setBaseMap(vworldBaseLayer, event.target.value);
this.$refs.open_layers.addVectorLayerAutoSizeByUrl("/common/getDongsGeoJson.json","multiPolygonLayer","EPSG:5181",baseStyles["MultiPolygon"],"MultiPolygon",this.address.dong_cd);
this.$refs.open_layers.addHeatmapLayer( "/common/getNodeGeoJsonRittrnVhcleAnalysis.json", "clusterLayer", "EPSG:5181", baseStyles["clusterStyle"], "clusterStyle", this.address );
}
}
else if (this.itemsCk == 4) {
this.statisticalAnalysisAll("/statisticalAnalysis/statisticalAnalysisError.json");
if (this.clusterCk) {
this.$refs.open_layers.removeLayerAll();
this.$refs.open_layers.setBaseMap(vworldBaseLayer, event.target.value);
this.$refs.open_layers.addClusterLayerByUrl( "/common/getNodeGeoJsonTroblOcrnAnalysis.json", "clusterLayer", "EPSG:5181", baseStyles["clusterStyle"], "clusterStyle", this.address );
}else if (this.layerCk) {
this.$refs.open_layers.removeLayerAll();
this.$refs.open_layers.setBaseMap(vworldBaseLayer, event.target.value);
this.$refs.open_layers.addVectorLayerAutoSizeByUrl("/common/getDongsGeoJson.json","multiPolygonLayer","EPSG:5181",baseStyles["MultiPolygon"],"MultiPolygon",this.address.dong_cd);
this.$refs.open_layers.addLayerTypeLayer("/common/getPolygonGeoJsonTroblOcrnLayerTypeCntAnalysis.json","multiPolygonForAnalysis","EPSG:5181",baseStyles["MultiPolygonForAnalysis"],"MultiPolygonForAnalysis",this.address);
this.$refs.open_layers.addLayerTypeLayer("/common/getGeoJsonTroblOcrnLayerTypeCntAnalysis.json","labelForAnalysis","EPSG:5181",baseStyles["labelForAnalysis"],"labelForAnalysis",this.address);
}else if (this.heatmapCk) {
this.$refs.open_layers.removeLayerAll();
this.$refs.open_layers.setBaseMap(vworldBaseLayer, event.target.value);
this.$refs.open_layers.addVectorLayerAutoSizeByUrl("/common/getDongsGeoJson.json","multiPolygonLayer","EPSG:5181",baseStyles["MultiPolygon"],"MultiPolygon",this.address.dong_cd);
this.$refs.open_layers.addHeatmapLayer( "/common/getNodeGeoJsonTroblOcrnAnalysis.json", "clusterLayer", "EPSG:5181", baseStyles["clusterStyle"], "clusterStyle", this.address );
}
}
},
crslkSelectF(event){
this.activeTab3=4;
this.analysisSearch();
if (this.itemsCk == 1) {
this.statisticalAnalysisAll("/statisticalAnalysis/statisticalAnalysisJaywalk.json");
if (this.clusterCk) {
this.$refs.open_layers.removeLayerAll();
this.$refs.open_layers.setBaseMap(vworldBaseLayer, event.target.value);
this.$refs.open_layers.addVectorLayerAutoSizeByUrl("/common/getDongsGeoJson.json","multiPolygonLayer","EPSG:5181",baseStyles["MultiPolygon"],"MultiPolygon",this.address.dong_cd);
this.$refs.open_layers.addClusterLayerByUrl( "/common/getNodeGeoJsonWtrmsCrosngAnalysis.json", "clusterLayer", "EPSG:5181", baseStyles["clusterStyle"], "clusterStyle", this.address );
} else if (this.layerCk) {
this.$refs.open_layers.removeLayerAll();
this.$refs.open_layers.setBaseMap(vworldBaseLayer, event.target.value);
this.$refs.open_layers.addVectorLayerAutoSizeByUrl("/common/getDongsGeoJson.json","multiPolygonLayer","EPSG:5181",baseStyles["MultiPolygon"],"MultiPolygon",this.address.dong_cd);
this.$refs.open_layers.addLayerTypeLayer("/common/getPolygonGeoJsonWtrmsCrosngLayerTypeCntAnalysis.json","multiPolygonForAnalysis","EPSG:5181",baseStyles["MultiPolygonForAnalysis"],"MultiPolygonForAnalysis",this.address);
this.$refs.open_layers.addLayerTypeLayer("/common/getGeoJsonWtrmsCrosngLayerTypeCntAnalysis.json","labelForAnalysis","EPSG:5181",baseStyles["labelForAnalysis"],"labelForAnalysis",this.address);
}else if (this.heatmapCk) {
this.$refs.open_layers.removeLayerAll();
this.$refs.open_layers.setBaseMap(vworldBaseLayer, event.target.value);
this.$refs.open_layers.addVectorLayerAutoSizeByUrl("/common/getDongsGeoJson.json","multiPolygonLayer","EPSG:5181",baseStyles["MultiPolygon"],"MultiPolygon",this.address.dong_cd);
this.$refs.open_layers.addHeatmapLayer( "/common/getNodeGeoJsonWtrmsCrosngAnalysis.json", "clusterLayer", "EPSG:5181", baseStyles["clusterStyle"], "clusterStyle", this.address );
}
}
else if (this.itemsCk == 2) {
this.statisticalAnalysisAll("/statisticalAnalysis/statisticalAnalysisSignalExtension.json");
if (this.clusterCk) {
this.$refs.open_layers.removeLayerAll();
this.$refs.open_layers.setBaseMap(vworldBaseLayer, event.target.value);
this.$refs.open_layers.addVectorLayerAutoSizeByUrl("/common/getDongsGeoJson.json","multiPolygonLayer","EPSG:5181",baseStyles["MultiPolygon"],"MultiPolygon",this.address.dong_cd);
this.$refs.open_layers.addClusterLayerByUrl( "/common/getNodeGeoJsonSignExtnAnalysis.json", "clusterLayer", "EPSG:5181", baseStyles["clusterStyle"], "clusterStyle", this.address );
}else if (this.layerCk) {
this.$refs.open_layers.removeLayerAll();
this.$refs.open_layers.setBaseMap(vworldBaseLayer, event.target.value);
this.$refs.open_layers.addVectorLayerAutoSizeByUrl("/common/getDongsGeoJson.json","multiPolygonLayer","EPSG:5181",baseStyles["MultiPolygon"],"MultiPolygon",this.address.dong_cd);
this.$refs.open_layers.addLayerTypeLayer("/common/getPolygonGeoJsonSignExtnLayerTypeCntAnalysis.json","multiPolygonForAnalysis","EPSG:5181",baseStyles["MultiPolygonForAnalysis"],"MultiPolygonForAnalysis",this.address);
this.$refs.open_layers.addLayerTypeLayer("/common/getGeoJsonSignExtnLayerTypeCntAnalysis.json","labelForAnalysis","EPSG:5181",baseStyles["labelForAnalysis"],"labelForAnalysis",this.address);
}else if (this.heatmapCk) {
this.$refs.open_layers.removeLayerAll();
this.$refs.open_layers.setBaseMap(vworldBaseLayer, event.target.value);
this.$refs.open_layers.addVectorLayerAutoSizeByUrl("/common/getDongsGeoJson.json","multiPolygonLayer","EPSG:5181",baseStyles["MultiPolygon"],"MultiPolygon",this.address.dong_cd);
this.$refs.open_layers.addHeatmapLayer( "/common/getNodeGeoJsonSignExtnAnalysis.json", "clusterLayer", "EPSG:5181", baseStyles["clusterStyle"], "clusterStyle", this.address );
}
}
else if (this.itemsCk == 3) {
this.statisticalAnalysisAll("/statisticalAnalysis/statisticalAnalysisSignalViolation.json");
if (this.clusterCk) {
this.$refs.open_layers.removeLayerAll();
this.$refs.open_layers.setBaseMap(vworldBaseLayer, event.target.value);
this.$refs.open_layers.addClusterLayerByUrl( "/common/getNodeGeoJsonRittrnVhcleAnalysis.json", "clusterLayer", "EPSG:5181", baseStyles["clusterStyle"], "clusterStyle", this.address );
}else if (this.layerCk) {
this.$refs.open_layers.removeLayerAll();
this.$refs.open_layers.setBaseMap(vworldBaseLayer, event.target.value);
this.$refs.open_layers.addVectorLayerAutoSizeByUrl("/common/getDongsGeoJson.json","multiPolygonLayer","EPSG:5181",baseStyles["MultiPolygon"],"MultiPolygon",this.address.dong_cd);
this.$refs.open_layers.addLayerTypeLayer("/common/getPolygonGeoJsonRittrnVhcleLayerTypeCntAnalysis.json","multiPolygonForAnalysis","EPSG:5181",baseStyles["MultiPolygonForAnalysis"],"MultiPolygonForAnalysis",this.address);
this.$refs.open_layers.addLayerTypeLayer("/common/getGeoJsonRittrnVhcleLayerTypeCntAnalysis.json","labelForAnalysis","EPSG:5181",baseStyles["labelForAnalysis"],"labelForAnalysis",this.address);
}else if (this.heatmapCk) {
this.$refs.open_layers.removeLayerAll();
this.$refs.open_layers.setBaseMap(vworldBaseLayer, event.target.value);
this.$refs.open_layers.addVectorLayerAutoSizeByUrl("/common/getDongsGeoJson.json","multiPolygonLayer","EPSG:5181",baseStyles["MultiPolygon"],"MultiPolygon",this.address.dong_cd);
this.$refs.open_layers.addHeatmapLayer( "/common/getNodeGeoJsonRittrnVhcleAnalysis.json", "clusterLayer", "EPSG:5181", baseStyles["clusterStyle"], "clusterStyle", this.address );
}
}
else if (this.itemsCk == 4) {
this.statisticalAnalysisAll("/statisticalAnalysis/statisticalAnalysisError.json");
if (this.clusterCk) {
this.$refs.open_layers.removeLayerAll();
this.$refs.open_layers.setBaseMap(vworldBaseLayer, event.target.value);
this.$refs.open_layers.addClusterLayerByUrl( "/common/getNodeGeoJsonTroblOcrnAnalysis.json", "clusterLayer", "EPSG:5181", baseStyles["clusterStyle"], "clusterStyle", this.address );
}else if (this.layerCk) {
this.$refs.open_layers.removeLayerAll();
this.$refs.open_layers.setBaseMap(vworldBaseLayer, event.target.value);
this.$refs.open_layers.addVectorLayerAutoSizeByUrl("/common/getDongsGeoJson.json","multiPolygonLayer","EPSG:5181",baseStyles["MultiPolygon"],"MultiPolygon",this.address.dong_cd);
this.$refs.open_layers.addLayerTypeLayer("/common/getPolygonGeoJsonTroblOcrnLayerTypeCntAnalysis.json","multiPolygonForAnalysis","EPSG:5181",baseStyles["MultiPolygonForAnalysis"],"MultiPolygonForAnalysis",this.address);
this.$refs.open_layers.addLayerTypeLayer("/common/getGeoJsonTroblOcrnLayerTypeCntAnalysis.json","labelForAnalysis","EPSG:5181",baseStyles["labelForAnalysis"],"labelForAnalysis",this.address);
}else if (this.heatmapCk) {
this.$refs.open_layers.removeLayerAll();
this.$refs.open_layers.setBaseMap(vworldBaseLayer, event.target.value);
this.$refs.open_layers.addVectorLayerAutoSizeByUrl("/common/getDongsGeoJson.json","multiPolygonLayer","EPSG:5181",baseStyles["MultiPolygon"],"MultiPolygon",this.address.dong_cd);
this.$refs.open_layers.addHeatmapLayer( "/common/getNodeGeoJsonTroblOcrnAnalysis.json", "clusterLayer", "EPSG:5181", baseStyles["clusterStyle"], "clusterStyle", this.address );
}
}
},
statusSearch: function () {
//무단횡단
if (this.itemsCk == 1) {
this.$refs.open_layers.removeLayerAll();
this.$refs.open_layers.setBaseMap(vworldBaseLayer);
this.$refs.open_layers.addVectorLayerRemoveAutoSizeByUrl("/common/getDongsPolygonGeoJson.json","multPolygonLayer","EPSG:5181",baseStyles["MultiPolygon"],"MultiPolygon",this.address.dong_cd);
this.$refs.open_layers.addClusterLayerByUrl( "/common/getNodeGeoJsonWtrmsCrosngAnalysis.json", "clusterLayer", "EPSG:5181", baseStyles["clusterStyle"], "clusterStyle", this.address );
this.statisticalAnalysisAll("/statisticalAnalysis/statisticalAnalysisJaywalk.json");
this.analysisSearch();
}
//신호연장
if (this.itemsCk == 2) {
this.$refs.open_layers.removeLayerAll();
this.$refs.open_layers.setBaseMap(vworldBaseLayer);
this.$refs.open_layers.addVectorLayerRemoveAutoSizeByUrl("/common/getDongsPolygonGeoJson.json","multPolygonLayer","EPSG:5181",baseStyles["MultiPolygon"],"MultiPolygon",this.address.dong_cd);
this.$refs.open_layers.addClusterLayerByUrl( "/common/getNodeGeoJsonSignExtnAnalysis.json", "clusterLayer", "EPSG:5181", baseStyles["clusterStyle"], "clusterStyle", this.address );
this.statisticalAnalysisAll("/statisticalAnalysis/statisticalAnalysisSignalExtension.json");
this.analysisSearch()
}
//우회전 차량
if (this.itemsCk == 3) {
this.$refs.open_layers.removeLayerAll();
this.$refs.open_layers.setBaseMap(vworldBaseLayer);
this.$refs.open_layers.addVectorLayerRemoveAutoSizeByUrl("/common/getDongsPolygonGeoJson.json","multPolygonLayer","EPSG:5181",baseStyles["MultiPolygon"],"MultiPolygon",this.address.dong_cd);
this.$refs.open_layers.addClusterLayerByUrl( "/common/getNodeGeoJsonRittrnVhcleAnalysis.json", "clusterLayer", "EPSG:5181", baseStyles["clusterStyle"], "clusterStyle", this.address );
this.statisticalAnalysisAll("/statisticalAnalysis/statisticalAnalysisSignalViolation.json");
this.analysisSearch()
}
// 장애발생
if (this.itemsCk == 4) {
this.$refs.open_layers.removeLayerAll();
this.$refs.open_layers.setBaseMap(vworldBaseLayer);
this.$refs.open_layers.addVectorLayerRemoveAutoSizeByUrl("/common/getDongsPolygonGeoJson.json","multPolygonLayer","EPSG:5181",baseStyles["MultiPolygon"],"MultiPolygon",this.address.dong_cd);
this.$refs.open_layers.addClusterLayerByUrl( "/common/getNodeGeoJsonTroblOcrnAnalysis.json", "clusterLayer", "EPSG:5181", baseStyles["clusterStyle"], "clusterStyle", this.address );
this.statisticalAnalysisAll("/statisticalAnalysis/statisticalAnalysisError.json");
this.analysisSearch()
}
},
changeClusterLayer: function () {
//클러스터 체크
this.clusterCk = true;
//레이어 체크
this.layerCk = false;
//히트맵 체크
this.heatmapCk = false;
//무단횡단
if (this.itemsCk == 1) {
this.$refs.open_layers.removeLayerAll();
this.$refs.open_layers.setBaseMap(vworldBaseLayer);
this.$refs.open_layers.addVectorLayerRemoveAutoSizeByUrl("/common/getDongsPolygonGeoJson.json","multPolygonLayer","EPSG:5181",baseStyles["MultiPolygon"],"MultiPolygon",this.address.dong_cd);
this.$refs.open_layers.addClusterLayerByUrl( "/common/getNodeGeoJsonWtrmsCrosngAnalysis.json", "clusterLayer", "EPSG:5181", baseStyles["clusterStyle"], "clusterStyle", this.address );
}
//신호연장
if (this.itemsCk == 2) {
this.$refs.open_layers.removeLayerAll();
this.$refs.open_layers.setBaseMap(vworldBaseLayer);
this.$refs.open_layers.addVectorLayerRemoveAutoSizeByUrl("/common/getDongsPolygonGeoJson.json","multPolygonLayer","EPSG:5181",baseStyles["MultiPolygon"],"MultiPolygon",this.address.dong_cd);
this.$refs.open_layers.addClusterLayerByUrl( "/common/getNodeGeoJsonSignExtnAnalysis.json", "clusterLayer", "EPSG:5181", baseStyles["clusterStyle"], "clusterStyle", this.address );
}
//우회전 차량
if (this.itemsCk == 3) {
this.$refs.open_layers.removeLayerAll();
this.$refs.open_layers.setBaseMap(vworldBaseLayer);
this.$refs.open_layers.addVectorLayerRemoveAutoSizeByUrl("/common/getDongsPolygonGeoJson.json","multPolygonLayer","EPSG:5181",baseStyles["MultiPolygon"],"MultiPolygon",this.address.dong_cd);
this.$refs.open_layers.addClusterLayerByUrl( "/common/getNodeGeoJsonRittrnVhcleAnalysis.json", "clusterLayer", "EPSG:5181", baseStyles["clusterStyle"], "clusterStyle", this.address );
}
// 장애발생
if (this.itemsCk == 4) {
this.$refs.open_layers.removeLayerAll();
this.$refs.open_layers.setBaseMap(vworldBaseLayer);
this.$refs.open_layers.addVectorLayerRemoveAutoSizeByUrl("/common/getDongsPolygonGeoJson.json","multPolygonLayer","EPSG:5181",baseStyles["MultiPolygon"],"MultiPolygon",this.address.dong_cd);
this.$refs.open_layers.addClusterLayerByUrl( "/common/getNodeGeoJsonTroblOcrnAnalysis.json", "clusterLayer", "EPSG:5181", baseStyles["clusterStyle"], "clusterStyle", this.address );
}
},
changeLayer: function () {
//클러스터 체크
this.clusterCk = false;
//레이어 체크
this.layerCk = true;
//히트맵 체크
this.heatmapCk = false;
//무단횡단
if (this.itemsCk == 1) {
this.$refs.open_layers.removeLayerAll();
this.$refs.open_layers.setBaseMap(vworldBaseLayer);
this.$refs.open_layers.addVectorLayerRemoveAutoSizeByUrl("/common/getDongsPolygonGeoJson.json","multPolygonLayer","EPSG:5181",baseStyles["MultiPolygon"],"MultiPolygon",this.address.dong_cd);
this.$refs.open_layers.addLayerTypeLayer("/common/getPolygonGeoJsonWtrmsCrosngLayerTypeCntAnalysis.json","multiPolygonForAnalysis","EPSG:5181",baseStyles["MultiPolygonForAnalysis"],"MultiPolygonForAnalysis",this.address);
this.$refs.open_layers.addLayerTypeLayer("/common/getGeoJsonWtrmsCrosngLayerTypeCntAnalysis.json","labelForAnalysis","EPSG:5181",baseStyles["labelForAnalysis"],"labelForAnalysis",this.address);
}
//신호연장
if (this.itemsCk == 2) {
this.$refs.open_layers.removeLayerAll();
this.$refs.open_layers.setBaseMap(vworldBaseLayer);
this.$refs.open_layers.addVectorLayerRemoveAutoSizeByUrl("/common/getDongsPolygonGeoJson.json","multPolygonLayer","EPSG:5181",baseStyles["MultiPolygon"],"MultiPolygon",this.address.dong_cd);
this.$refs.open_layers.addLayerTypeLayer("/common/getPolygonGeoJsonSignExtnLayerTypeCntAnalysis.json","multiPolygonForAnalysis","EPSG:5181",baseStyles["MultiPolygonForAnalysis"],"MultiPolygonForAnalysis",this.address);
this.$refs.open_layers.addLayerTypeLayer("/common/getGeoJsonSignExtnLayerTypeCntAnalysis.json","labelForAnalysis","EPSG:5181",baseStyles["labelForAnalysis"],"labelForAnalysis",this.address);
}
//우회전 차량
if (this.itemsCk == 3) {
this.$refs.open_layers.removeLayerAll();
this.$refs.open_layers.setBaseMap(vworldBaseLayer);
this.$refs.open_layers.addVectorLayerRemoveAutoSizeByUrl("/common/getDongsPolygonGeoJson.json","multPolygonLayer","EPSG:5181",baseStyles["MultiPolygon"],"MultiPolygon",this.address.dong_cd);
this.$refs.open_layers.addLayerTypeLayer("/common/getPolygonGeoJsonRittrnVhcleLayerTypeCntAnalysis.json","multiPolygonForAnalysis","EPSG:5181",baseStyles["MultiPolygonForAnalysis"],"MultiPolygonForAnalysis",this.address);
this.$refs.open_layers.addLayerTypeLayer("/common/getGeoJsonRittrnVhcleLayerTypeCntAnalysis.json","labelForAnalysis","EPSG:5181",baseStyles["labelForAnalysis"],"labelForAnalysis",this.address);
}
// 장애발생
if (this.itemsCk == 4) {
this.$refs.open_layers.removeLayerAll();
this.$refs.open_layers.setBaseMap(vworldBaseLayer);
this.$refs.open_layers.addVectorLayerRemoveAutoSizeByUrl("/common/getDongsPolygonGeoJson.json","multPolygonLayer","EPSG:5181",baseStyles["MultiPolygon"],"MultiPolygon",this.address.dong_cd);
this.$refs.open_layers.addLayerTypeLayer("/common/getPolygonGeoJsonTroblOcrnLayerTypeCntAnalysis.json","multiPolygonForAnalysis","EPSG:5181",baseStyles["MultiPolygonForAnalysis"],"MultiPolygonForAnalysis",this.address);
this.$refs.open_layers.addLayerTypeLayer("/common/getGeoJsonTroblOcrnLayerTypeCntAnalysis.json","labelForAnalysis","EPSG:5181",baseStyles["labelForAnalysis"],"labelForAnalysis",this.address);
}
},
changeHeatmapLayer: function () {
//클러스터 체크
this.clusterCk = false;
//레이어 체크
this.layerCk = false;
//히트맵 체크
this.heatmapCk = true;
if (this.itemsCk == 1) {
this.$refs.open_layers.removeLayerAll();
this.$refs.open_layers.setBaseMap(vworldBaseLayer);
this.$refs.open_layers.addVectorLayerRemoveAutoSizeByUrl("/common/getDongsPolygonGeoJson.json","multPolygonLayer","EPSG:5181",baseStyles["MultiPolygon"],"MultiPolygon",this.address.dong_cd);
this.$refs.open_layers.addHeatmapLayer( "/common/getNodeGeoJsonWtrmsCrosngAnalysis.json", "clusterLayer", "EPSG:5181", baseStyles["clusterStyle"], "clusterStyle", this.address );
}
if (this.itemsCk == 1) {
this.$refs.open_layers.removeLayerAll();
this.$refs.open_layers.setBaseMap(vworldBaseLayer);
this.$refs.open_layers.addVectorLayerRemoveAutoSizeByUrl("/common/getDongsPolygonGeoJson.json","multPolygonLayer","EPSG:5181",baseStyles["MultiPolygon"],"MultiPolygon",this.address.dong_cd);
this.$refs.open_layers.addHeatmapLayer( "/common/getNodeGeoJsonWtrmsCrosngAnalysis.json", "clusterLayer", "EPSG:5181", baseStyles["clusterStyle"], "clusterStyle", this.address );
}
//신호연장
if (this.itemsCk == 2) {
this.$refs.open_layers.removeLayerAll();
this.$refs.open_layers.setBaseMap(vworldBaseLayer);
this.$refs.open_layers.addVectorLayerRemoveAutoSizeByUrl("/common/getDongsPolygonGeoJson.json","multPolygonLayer","EPSG:5181",baseStyles["MultiPolygon"],"MultiPolygon",this.address.dong_cd);
this.$refs.open_layers.addHeatmapLayer( "/common/getNodeGeoJsonSignExtnAnalysis.json", "clusterLayer", "EPSG:5181", baseStyles["clusterStyle"], "clusterStyle", this.address );
}
//우회전 차량
if (this.itemsCk == 3) {
this.$refs.open_layers.removeLayerAll();
this.$refs.open_layers.setBaseMap(vworldBaseLayer);
this.$refs.open_layers.addVectorLayerRemoveAutoSizeByUrl("/common/getDongsPolygonGeoJson.json","multPolygonLayer","EPSG:5181",baseStyles["MultiPolygon"],"MultiPolygon",this.address.dong_cd);
this.$refs.open_layers.addHeatmapLayer( "/common/getNodeGeoJsonRittrnVhcleAnalysis.json", "clusterLayer", "EPSG:5181", baseStyles["clusterStyle"], "clusterStyle", this.address );
}
// 장애발생
if (this.itemsCk == 4) {
this.$refs.open_layers.removeLayerAll();
this.$refs.open_layers.setBaseMap(vworldBaseLayer);
this.$refs.open_layers.addVectorLayerRemoveAutoSizeByUrl("/common/getDongsPolygonGeoJson.json","multPolygonLayer","EPSG:5181",baseStyles["MultiPolygon"],"MultiPolygon",this.address.dong_cd);
this.$refs.open_layers.addHeatmapLayer( "/common/getNodeGeoJsonTroblOcrnAnalysis.json", "clusterLayer", "EPSG:5181", baseStyles["clusterStyle"], "clusterStyle", this.address );
}
},
childMoveEnd() {},
childClick() {},
childWheel() {},
toggleSlide: function () {
if (this.showSlide) {
this.slideText = "검색하기";
} else {
this.slideText = "창닫기";
}
this.showSlide = !this.showSlide;
},
changeTab(tabId) {
this.activeTab = tabId;
},
changeTab2(tabId) {
this.activeTab2 = tabId;
},
changeTab3(tabId) {
this.activeTab3 = tabId;
},
toggleActive: function (item) {
this.itemsCk=item.id;
//무단횡단 탭
if (item.id == 1) {
this.statisticalAnalysisAll("/statisticalAnalysis/statisticalAnalysisJaywalk.json");
if (this.clusterCk) {
this.$refs.open_layers.removeLayerAll();
this.$refs.open_layers.setBaseMap(vworldBaseLayer);
this.$refs.open_layers.addVectorLayerRemoveAutoSizeByUrl("/common/getDongsPolygonGeoJson.json","multPolygonLayer","EPSG:5181",baseStyles["MultiPolygon"],"MultiPolygon",this.address.dong_cd);
this.$refs.open_layers.addClusterLayerByUrl( "/common/getNodeGeoJsonWtrmsCrosngAnalysis.json", "clusterLayer", "EPSG:5181", baseStyles["clusterStyle"], "clusterStyle", this.address );
} else if (this.layerCk) {
this.$refs.open_layers.removeLayerAll();
this.$refs.open_layers.setBaseMap(vworldBaseLayer);
this.$refs.open_layers.addVectorLayerRemoveAutoSizeByUrl("/common/getDongsPolygonGeoJson.json","multPolygonLayer","EPSG:5181",baseStyles["MultiPolygon"],"MultiPolygon",this.address.dong_cd);
this.$refs.open_layers.addLayerTypeLayer("/common/getPolygonGeoJsonWtrmsCrosngLayerTypeCntAnalysis.json","multiPolygonForAnalysis","EPSG:5181",baseStyles["MultiPolygonForAnalysis"],"MultiPolygonForAnalysis",this.address);
this.$refs.open_layers.addLayerTypeLayer("/common/getGeoJsonWtrmsCrosngLayerTypeCntAnalysis.json","labelForAnalysis","EPSG:5181",baseStyles["labelForAnalysis"],"labelForAnalysis",this.address);
} else if (this.heatmapCk) {
this.$refs.open_layers.removeLayerAll();
this.$refs.open_layers.setBaseMap(vworldBaseLayer, event.target.value);
this.$refs.open_layers.addVectorLayerRemoveAutoSizeByUrl("/common/getDongsGeoJson.json","multiPolygonLayer","EPSG:5181",baseStyles["MultiPolygon"],"MultiPolygon",this.address.dong_cd);
this.$refs.open_layers.addHeatmapLayer( "/common/getNodeGeoJsonWtrmsCrosngAnalysis.json", "clusterLayer", "EPSG:5181", baseStyles["clusterStyle"], "clusterStyle", this.address );
}
this.searchResultState = "무단횡단 발생";
}
//신호연장 탭
else if (item.id == 2) {
this.statisticalAnalysisAll("/statisticalAnalysis/statisticalAnalysisSignalExtension.json");
if (this.clusterCk) {
this.$refs.open_layers.removeLayerAll();
this.$refs.open_layers.setBaseMap(vworldBaseLayer);
this.$refs.open_layers.addVectorLayerRemoveAutoSizeByUrl("/common/getDongsPolygonGeoJson.json","multPolygonLayer","EPSG:5181",baseStyles["MultiPolygon"],"MultiPolygon",this.address.dong_cd);
this.$refs.open_layers.addClusterLayerByUrl( "/common/getNodeGeoJsonSignExtnAnalysis.json", "clusterLayer", "EPSG:5181", baseStyles["clusterStyle"], "clusterStyle", this.address );
}else if (this.layerCk) {
this.$refs.open_layers.removeLayerAll();
this.$refs.open_layers.setBaseMap(vworldBaseLayer);
this.$refs.open_layers.addVectorLayerRemoveAutoSizeByUrl("/common/getDongsPolygonGeoJson.json","multPolygonLayer","EPSG:5181",baseStyles["MultiPolygon"],"MultiPolygon",this.address.dong_cd);
this.$refs.open_layers.addLayerTypeLayer("/common/getPolygonGeoJsonSignExtnLayerTypeCntAnalysis.json","multiPolygonForAnalysis","EPSG:5181",baseStyles["MultiPolygonForAnalysis"],"MultiPolygonForAnalysis",this.address);
this.$refs.open_layers.addLayerTypeLayer("/common/getGeoJsonSignExtnLayerTypeCntAnalysis.json","labelForAnalysis","EPSG:5181",baseStyles["labelForAnalysis"],"labelForAnalysis",this.address);
}else if (this.heatmapCk) {
this.$refs.open_layers.removeLayerAll();
this.$refs.open_layers.setBaseMap(vworldBaseLayer, event.target.value);
this.$refs.open_layers.addVectorLayerRemoveAutoSizeByUrl("/common/getDongsGeoJson.json","multiPolygonLayer","EPSG:5181",baseStyles["MultiPolygon"],"MultiPolygon",this.address.dong_cd);
this.$refs.open_layers.addHeatmapLayer( "/common/getNodeGeoJsonSignExtnAnalysis.json", "clusterLayer", "EPSG:5181", baseStyles["clusterStyle"], "clusterStyle", this.address );
}
this.searchResultState = "신호연장 발생";
}
//우회전 차량 탭
else if (item.id == 3) {
this.statisticalAnalysisAll("/statisticalAnalysis/statisticalAnalysisSignalViolation.json");
if (this.clusterCk) {
this.$refs.open_layers.removeLayerAll();
this.$refs.open_layers.setBaseMap(vworldBaseLayer);
this.$refs.open_layers.addVectorLayerRemoveAutoSizeByUrl("/common/getDongsPolygonGeoJson.json","multPolygonLayer","EPSG:5181",baseStyles["MultiPolygon"],"MultiPolygon",this.address.dong_cd);
this.$refs.open_layers.addClusterLayerByUrl( "/common/getNodeGeoJsonRittrnVhcleAnalysis.json", "clusterLayer", "EPSG:5181", baseStyles["clusterStyle"], "clusterStyle", this.address );
}else if (this.layerCk) {
this.$refs.open_layers.removeLayerAll();
this.$refs.open_layers.setBaseMap(vworldBaseLayer);
this.$refs.open_layers.addVectorLayerRemoveAutoSizeByUrl("/common/getDongsPolygonGeoJson.json","multPolygonLayer","EPSG:5181",baseStyles["MultiPolygon"],"MultiPolygon",this.address.dong_cd);
this.$refs.open_layers.addLayerTypeLayer("/common/getPolygonGeoJsonRittrnVhcleLayerTypeCntAnalysis.json","multiPolygonForAnalysis","EPSG:5181",baseStyles["MultiPolygonForAnalysis"],"MultiPolygonForAnalysis",this.address);
this.$refs.open_layers.addLayerTypeLayer("/common/getGeoJsonRittrnVhcleLayerTypeCntAnalysis.json","labelForAnalysis","EPSG:5181",baseStyles["labelForAnalysis"],"labelForAnalysis",this.address);
}else if (this.heatmapCk) {
this.$refs.open_layers.removeLayerAll();
this.$refs.open_layers.setBaseMap(vworldBaseLayer, event.target.value);
this.$refs.open_layers.addVectorLayerRemoveAutoSizeByUrl("/common/getDongsGeoJson.json","multiPolygonLayer","EPSG:5181",baseStyles["MultiPolygon"],"MultiPolygon",this.address.dong_cd);
this.$refs.open_layers.addHeatmapLayer( "/common/getNodeGeoJsonRittrnVhcleAnalysis.json", "clusterLayer", "EPSG:5181", baseStyles["clusterStyle"], "clusterStyle", this.address );
}
this.searchResultState = "불법 우회전 발생";
}
//장애발생 탭
else if (item.id == 4) {
this.statisticalAnalysisAll("/statisticalAnalysis/statisticalAnalysisError.json");
if (this.clusterCk) {
this.$refs.open_layers.removeLayerAll();
this.$refs.open_layers.setBaseMap(vworldBaseLayer);
this.$refs.open_layers.addVectorLayerRemoveAutoSizeByUrl("/common/getDongsPolygonGeoJson.json","multPolygonLayer","EPSG:5181",baseStyles["MultiPolygon"],"MultiPolygon",this.address.dong_cd);
this.$refs.open_layers.addClusterLayerByUrl( "/common/getNodeGeoJsonTroblOcrnAnalysis.json", "clusterLayer", "EPSG:5181", baseStyles["clusterStyle"], "clusterStyle", this.address );
}else if (this.layerCk) {
console.log("layerck");
this.$refs.open_layers.removeLayerAll();
this.$refs.open_layers.setBaseMap(vworldBaseLayer);
this.$refs.open_layers.addVectorLayerRemoveAutoSizeByUrl("/common/getDongsPolygonGeoJson.json","multPolygonLayer","EPSG:5181",baseStyles["MultiPolygon"],"MultiPolygon",this.address.dong_cd);
this.$refs.open_layers.addLayerTypeLayer("/common/getPolygonGeoJsonTroblOcrnLayerTypeCntAnalysis.json","multiPolygonForAnalysis","EPSG:5181",baseStyles["MultiPolygonForAnalysis"],"MultiPolygonForAnalysis",this.address);
this.$refs.open_layers.addLayerTypeLayer("/common/getGeoJsonTroblOcrnLayerTypeCntAnalysis.json","labelForAnalysis","EPSG:5181",baseStyles["labelForAnalysis"],"labelForAnalysis",this.address);
}else if (this.heatmapCk) {
this.$refs.open_layers.removeLayerAll();
this.$refs.open_layers.setBaseMap(vworldBaseLayer, event.target.value);
this.$refs.open_layers.addVectorLayerRemoveAutoSizeByUrl("/common/getDongsGeoJson.json","multiPolygonLayer","EPSG:5181",baseStyles["MultiPolygon"],"MultiPolygon",this.address.dong_cd);
this.$refs.open_layers.addHeatmapLayer( "/common/getNodeGeoJsonTroblOcrnAnalysis.json", "clusterLayer", "EPSG:5181", baseStyles["clusterStyle"], "clusterStyle", this.address );
}
this.searchResultState = "장애발생";
}
for (var i = 0; i < 4; i++) {
this.items[i].isActive = false;
}
item.isActive = !item.isActive;
},
initialDate: function () {
const end_date = new Date(new Date().setDate(new Date().getDate()-1));
this.address.end_date=this.yyyyMMdd(end_date);
const max_limit_date = new Date(end_date);
this.max_limit_date=this.yyyyMMdd(max_limit_date);
const start_date = new Date(end_date.setMonth(end_date.getMonth()-1));
this.address.start_date=this.yyyyMMdd(start_date);
// console.log("this.address.start_date : ",this.address.start_date);
// console.log("this.address.end_date : ",this.address.end_date);
},
yyyyMMdd : function(value){
// 들어오는 value 값이 공백이면 그냥 공백으로 돌려줌
if(value == '') return '';
// 현재 Date 혹은 DateTime 데이터를 javaScript date 타입화
var js_date = new Date(value);
// 연도, 월, 일 추출
var year = js_date.getFullYear();
var month = js_date.getMonth() + 1;
var day = js_date.getDate();
// 월, 일의 경우 한자리 수 값이 있기 때문에 공백에 0 처리
if(month < 10){
month = '0' + month;
}
if(day < 10){
day = '0' + day;
}
// 최종 포맷 (ex - '2021-10-08')
return year + '-' + month + '-' + day;
}
},
watch: {
'itemsCk' :function(newValue,oldValue){
// console.log("itemsCk newValue : ", newValue);
},
'address.start_date' :function(newValue){
// console.log("address.start_date newValue : ", newValue);
const min_limit_date = new Date(newValue);
this.min_limit_date=this.yyyyMMdd(min_limit_date);
},
'min_limit_date':function(newValue){
// console.log("address.min_limit_date newValue : ", newValue);
},
'address.end_date' :function(newValue){
// console.log("address.end_date newValue : ", newValue);
},
},
computed: {},
mounted() {
console.log("Main2 mounted");
this.initialDate();
this.analysisSearch();
this.statisticalAnalysisAll("/statisticalAnalysis/statisticalAnalysisJaywalk.json");
this.$refs.open_layers.setBaseMap(vworldBaseLayer);
this.statusSearch();
},
};
</script>
<style scoped>
@media all and (max-width: 479px) {
.wrap {
margin: 0 !important;
}
.result {
min-height: 30rem;
}
.iconlist {
width: -webkit-fill-available;
height: 6rem;
padding: 1rem;
}
.iconlist ul {
display: flex;
align-items: center;
justify-content: space-around;
}
.top p {
padding-right: 1rem;
}
.chart {
width: -webkit-fill-available !important;
}
.top {
width: auto;
right: -1rem;
}
.top ul {
width: 137rem;
overflow: hidden;
justify-content: space-between !important;
padding: 2rem 1rem !important;
}
.top li {
display: flex;
align-items: center;
}
.search {
width: inherit;
}
.toggle {
color: #fff;
font-weight: bold;
background: #13833b;
display: block !important;
position: absolute;
z-index: 150;
top: 7.5rem;
right: 1rem;
}
.wrap {
height: auto !important;
width: inherit;
display: block;
}
.slide-content {
position: absolute;
z-index: 104;
top: 0rem;
left: 0rem;
/* width: 46rem;*/
background-color: #f0f0f0;
transition: transform 0.3s ease;
transform: translateX(100%);
}
.slide-content.active {
transform: translateX(0);
}
}
.ulbox ul li p{font-size: 13px;}
.boxwrap {
height: calc(100% - 3rem);
}
.tab-content {
height: calc(100% - 6rem);
}
.tab-content .box {
padding: 1rem;
}
.tab-buttons .ulbox {
height: calc(100% - 3rem);
overflow: scroll;
overflow-x: hidden;
}
.ulbox ul {
height: 30rem;
}
.toggle {
display: none;
}
.wrap {
flex-wrap: unset;
}
.boxwrap {
height: 100%;
}
.boxwrap h2 {
border-radius: 10px 10px 0 0;
}
.minichart {
height: 90%;
}
.inner {
width: 100%;
height: 100%;
}
.inner > div {
height: 100%;
}
.box button.gray-btn.active {
/* Your CSS styles for the button when it's active (clicked) */
background-color: #13833b;
color: #fff;
/* Add any other styles you want to apply when the button is active */
}
.chart {
width: 25%;
height: 97%;
position: absolute;
right: 2rem;
top: 2rem;
}
/* .chart .box > div {
height: 69%;
} */
.chart .box {
width: -webkit-fill-available;
height: 100%;
}
.chart .box button {
border-radius: 0;
}
.chart > div {
/* height: 95%; */
}
.chart h2 {
padding: 0.5rem 0;
height: 3.4rem;
}
.search .box ul {
}
.search .box ul li {
padding: 1rem 1rem 1rem 3rem;
}
.result {
position: relative;
}
h5 {
position: absolute;
left: 0;
font-size: 2rem;
}
.box {
text-align: left;
}
h4 {
position: relative;
border-bottom: 1px solid #e5e3e3;
padding: 0 0 1rem 0;
text-align: left;
}
.btn_set {
height: revert !important;
}
.btn_set div {
position: absolute;
top: 40px;
width: 313px;
height: 380px;
background: #fff;
padding: 1rem;
}
.bg-white::-webkit-scrollbar-thumb {
background-color: #fff;
}
h2 {
background: #50ba8a;
text-align: center;
color: #fff;
padding: 1.6rem 0;
}
.top {
position: absolute;
top: 0;
background: none;
margin: 2rem;
height: 2rem;
}
.wrap {
z-index: 100;
top: 0;
height: 100%;
}
.left {
background: #fff;
}
.right {
width: -webkit-fill-available;
position: relative;
}
.top button.clicked {
background: #50ba8a;
}
.map {
width: 100%;
height: 100%;
}
</style>