Browse Source

mapbox popup css 수정 및 필요없는 레이어 주석

pull/2/head
김장현 1 year ago
parent
commit
803b78d1e5
  1. 4
      src/assets/css/custom.css
  2. 4
      src/components/map/MapControl.js
  3. 60
      src/components/map/mapbox/MapBoxMap.js

4
src/assets/css/custom.css

@ -843,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;}
.box_4n div{width:50%;height:50vh;}
.mapboxgl-popup-content {padding: 0 !important;border-radius:6px !important;}
.mapboxgl-popup-tip {display: none!important;}

4
src/components/map/MapControl.js

@ -5,8 +5,8 @@ import MapBoxMap from './mapbox/MapBoxMap';
export const MapControl = props => {
return (
<>{props.mapType === 'google' ? <GoogleCustomMap /> : <NaverCustomMap />}</>
// <>{props.mapType === 'google' ? <GoogleCustomMap /> : <NaverCustomMap />}</>
// <NaverCustomMap />
// <MapBoxMap />
<MapBoxMap />
);
};

60
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({

Loading…
Cancel
Save