<template>
  <div id="visualizationHome">
    <VisualizationHeader />
    <Map/>
    <TreeMenu />
    <ServiceTree />
    <FigureLegend />
    <BaseMapSwitch />
    <router-view/>
    <VisualizationBottom />
  </div>
</template>

<script>
import VisualizationHeader from "../../c-cpns/VisualizationHeader.vue";
import Map from "../../c-cpns/Map.vue";
import VisualizationBottom from "@/views/c-cpns/VisualizationBottom.vue";
import ServiceTree from "@/views/c-cpns/ServiceTree.vue";
import FigureLegend from "@/views/c-cpns/figureLegend.vue";
import TreeMenu from "@/views/c-cpns/TreeMenu.vue";
import BaseMapSwitch from "@/views/c-cpns/BaseMapSwitch.vue";
export default {
  name: "VisualizationHome",
  components: {BaseMapSwitch, TreeMenu, FigureLegend, ServiceTree, VisualizationBottom, Map, VisualizationHeader}
}
</script>

<style scoped lang="scss">
#visualizationHome{
  width: 100%;
  height: 100%;
  background: rgb(1, 27, 67);
}
</style>