diff --git a/src/assets/css/custom.css b/src/assets/css/custom.css
index c84e8a16..630b945f 100644
--- a/src/assets/css/custom.css
+++ b/src/assets/css/custom.css
@@ -406,13 +406,14 @@ h1.logo span{display:block;color:#f4f4f4;font-weight:bold;letter-spacing:2px;fon
.tooltip-test{position:absolute;left:500px;top:500px;}
.tooltip-box{background:#283046;padding:10px;border-radius:6px;position:relative;max-width:150px;word-break: break-all;}
/* .tooltip-box div{text-align:left;font-size:13px;} */
-.tooltip-ti{border-bottom:1px solid #bbb;padding-bottom:4px;}
+.tooltip-ti{border-bottom:1px solid #bbb;padding-bottom:3px;font-size:0.875rem;color:#f4f4f4;}
/* .tooltip-ti span, .tooltip-txt .ti{color:#f4f4f4;font-weight:400;} */
-.tooltip-txt{color:#f4f4f4;font-weight:400;font-size:12px}
+.tooltip-txt{font-weight:400;font-size:12px;padding-top:6px}
.tooltip-txt-list + .tooltip-txt-list{margin-top:4px;}
.tooltip-box .arrow {position:absolute;bottom:-10px;left:50%;transform: translateX(-50%);display:block;width: 0px;height: 0px;border-top:10px solid #283046;border-bottom:10px solid none;border-right: 10px solid transparent;border-left: 10px solid transparent;}
.tooltip-txt-list .ti:before{content:'/';margin:0 2px;}
.tooltip-txt-list .ti:first-child::before{display:none;}
+
/* 데이터블록 */
.dblock-box{background:#283046;padding:6px 8px;border-radius:6px;width:150px;word-break: break-all;position:absolute}
.dblock-box div{text-align:left;font-size:11px;color:#bbb;}
@@ -842,4 +843,6 @@ background-size: 75% auto;
.layer-weather-address{display:flex;align-items:center;justify-content:space-between;}
.box_4n{display:flex;flex-wrap: wrap;}
-.box_4n div{width:50%;height:50vh;}
\ No newline at end of file
+.box_4n div{width:50%;height:50vh;}
+.mapboxgl-popup-content {padding: 0 !important;border-radius:6px !important;}
+.mapboxgl-popup-tip {display: none!important;}
\ No newline at end of file
diff --git a/src/components/analysis/simulation/AnalysisSimulatorSlider.js b/src/components/analysis/simulation/AnalysisSimulatorSlider.js
index c5bb4219..f7f8ef3a 100644
--- a/src/components/analysis/simulation/AnalysisSimulatorSlider.js
+++ b/src/components/analysis/simulation/AnalysisSimulatorSlider.js
@@ -7,6 +7,22 @@ const AnalysisSimulatorSlider = ({
playCount,
setSliderCount
}) => {
+ // hh:mm 형식으로 바꿔주는 코드
+ function convertToTimeFormat(number) {
+ // 시간과 분 계산
+ const hours = Math.floor(number / 60);
+ const minutes = Math.floor(number % 60);
+
+ // 2자리 숫자로 포맷팅
+ const formattedHours = String(hours).padStart(2, '0');
+ const formattedMinutes = String(minutes).padStart(2, '0');
+
+ // 시간 문자열 생성
+ const timeString = `${formattedHours}:${formattedMinutes}`;
+
+ return timeString;
+ }
+
const colorOptions = {
start: [playCount ? playCount : 0],
// connect: true,
@@ -20,9 +36,10 @@ const AnalysisSimulatorSlider = ({
format: {
// 'to' the formatted value. Receives a number.
to: function (value) {
- return Math.round(value);
+ return convertToTimeFormat(value);
},
- // 'from' the formatted value.
+
+ // // 'from' the formatted value.
// Receives a string, should return a number.
from: function (value) {
return Math.round(value);
@@ -34,7 +51,13 @@ const AnalysisSimulatorSlider = ({
density: 3
},
onChange: e => {
- setSliderCount(e);
+ function timeStringToMinutes(timeString) {
+ const [hours, minutes] = timeString.split(':').map(Number);
+ const totalMinutes = hours * 60 + minutes;
+ return totalMinutes.toString();
+ }
+
+ setSliderCount(e.map(timeStringToMinutes));
},
direction
};
diff --git a/src/components/map/MapControl.js b/src/components/map/MapControl.js
index e550c41e..993c7138 100644
--- a/src/components/map/MapControl.js
+++ b/src/components/map/MapControl.js
@@ -5,8 +5,8 @@ import MapBoxMap from './mapbox/MapBoxMap';
export const MapControl = props => {
return (
- <>{props.mapType === 'google' ? : }
+ // <>{props.mapType === 'google' ? : }
//
- //
+
);
};
diff --git a/src/components/map/mapbox/MapBoxMap.js b/src/components/map/mapbox/MapBoxMap.js
index 07e81586..aa01ca27 100644
--- a/src/components/map/mapbox/MapBoxMap.js
+++ b/src/components/map/mapbox/MapBoxMap.js
@@ -314,38 +314,38 @@ export default function MapBoxMap() {
type: 'raster-dem',
url: 'mapbox://mapbox.mapbox-terrain-dem-v1',
tileSize: 512,
- maxZoom: 16
+ maxZoom: 14
});
map.setTerrain({ source: 'mapbox-dem', exaggeration: 1.5 });
- map.addLayer({
- id: 'contour-labels',
- type: 'symbol',
- source: {
- type: 'vector',
- url: 'mapbox://mapbox.mapbox-terrain-v2'
- },
- 'source-layer': 'contour',
- layout: {
- visibility: 'visible',
- 'symbol-placement': 'line',
- 'text-field': ['concat', ['to-string', ['get', 'ele']], 'm']
- },
- paint: {
- 'icon-color': '#877b59',
- 'icon-halo-width': 1,
- 'text-color': '#877b59',
- 'text-halo-width': 1
- }
- });
- map.addLayer({
- id: 'sky',
- type: 'sky',
- paint: {
- 'sky-type': 'atmosphere',
- 'sky-atmosphere-sun': [0.0, 90.0],
- 'sky-atmosphere-sun-intensity': 15
- }
- });
+ // map.addLayer({
+ // id: 'contour-labels',
+ // type: 'symbol',
+ // source: {
+ // type: 'vector',
+ // url: 'mapbox://mapbox.mapbox-terrain-v2'
+ // },
+ // 'source-layer': 'contour',
+ // layout: {
+ // visibility: 'visible',
+ // 'symbol-placement': 'line',
+ // 'text-field': ['concat', ['to-string', ['get', 'ele']], 'm']
+ // },
+ // paint: {
+ // 'icon-color': '#877b59',
+ // 'icon-halo-width': 1,
+ // 'text-color': '#877b59',
+ // 'text-halo-width': 1
+ // }
+ // });
+ // map.addLayer({
+ // id: 'sky',
+ // type: 'sky',
+ // paint: {
+ // 'sky-type': 'atmosphere',
+ // 'sky-atmosphere-sun': [0.0, 90.0],
+ // 'sky-atmosphere-sun-intensity': 15
+ // }
+ // });
// 지형 3d end
// 등고선 start
map.addLayer({
diff --git a/src/components/map/mapbox/dron/DronMarker.js b/src/components/map/mapbox/dron/DronMarker.js
index bbcd23dc..6952ac46 100644
--- a/src/components/map/mapbox/dron/DronMarker.js
+++ b/src/components/map/mapbox/dron/DronMarker.js
@@ -370,32 +370,33 @@ export const DronMarker = props => {
// anchor: getIcon.anchor
// });
};
-
+ //
const moveInfos = (info, position, item, idx) => {
if (info) {
info.setLngLat([position.lng, position.lat]);
- // info.setPosition(position, info);
- // // info._element.html(`${info?._id}
- // // ${item?.speed}${item?.speedType} | ${item?.elev}${item?.elevType} | ${item?.heading}
`);
- // info._element.html(`
- //
- // ${info?._id}
- //
- //
- //
- // ${item?.elev}M
- // ${item?.speed}km
- // ${
- // typeof item?.lat === 'number' && typeof item?.lng === 'number'
- // ? `
- //
- // ${(item?.lat).toFixed(6)} ${(item?.lng).toFixed(6)}
- // `
- // : ''
- // }
- //
- //
+
+ ${info?._id}
+
+
+
+ ${item?.elev}M
+ ${item?.speed}km
+ ${
+ typeof item?.lat === 'number' && typeof item?.lng === 'number'
+ ? `
+
+ ${(item?.lat).toFixed(6)} ${(item?.lng).toFixed(6)}
+ `
+ : ''
+ }
+
+
+