개인공부79 카카오맵-사용자위치조회,마커, 커스텀어레이 //map 완성코드 import React, { useEffect } from "react"; // import styled from "styled-components"; import { markerdata } from "./MarkerData"; declare global { interface Window { kakao: any; closeOverlay: () => void; } } const MapComponent = () => { useEffect(() => { mapscript(); }, []); const mapscript = () => { const container = document.getElementById("map"); const options = { center: new window... 2023. 5. 16. 카카오맵 - 마커 클릭하면 설정한 창 뜨기 마커를 내맘대로 박아놨다. 마커를 클릭하면 매장 정보를 볼수있게 하고싶은데 일단은 어찌 할수 있는 아이디어가 없어서 정보를 볼수있는 네이버 창이 뜨게 했다. // //map // // 지도 컴포넌트 import React, { useEffect } from "react"; import { markerdata } from "./MarkerData"; declare global { interface Window { kakao: any; } } interface SearchProps { Place: string; } const MapComponent = ({ Place }: SearchProps) => { useEffect(() => { mapscript(); }, [Place]); const mapscrip.. 2023. 5. 16. 카카오맵 - 드디어 검색기능 성공!!!!! 드디어 카카오지도 검색 기능 성공했다. 진짜 하루종일 잡고 있었네................ 몇번을 고치고 한지 모르겠다 //Map // 지도 컴포넌트 import React, { useEffect } from "react"; declare global { interface Window { kakao: any; } } interface SearchProps { Place: string; } const MapComponent: React.FC = ({ Place }) => { useEffect(() => { const infowindow = new window.kakao.maps.InfoWindow({ zIndex: 1 }); const container = document.getElementById(".. 2023. 5. 16. 카카오맵이용 - 사용자 현재위치조회 카카오맵을 이용해서 사용자의 현재위치를 조회할수 있게 마커까지 표시되어 뜨게 구현했다. 단점이 있다면 크롬에서만 가능하다는 거다! 카카오에서 제공하는 문서이다. var mapContainer = document.getElementById('map'), // 지도를 표시할 div mapOption = { center: new kakao.maps.LatLng(33.450701, 126.570667), // 지도의 중심좌표 level: 10 // 지도의 확대 레벨 }; var map = new kakao.maps.Map(mapContainer, mapOption); // 지도를 생성합니다 // HTML5의 geolocation으로 사용할 수 있는지 확인합니다 if (navigator.geolocation) {.. 2023. 5. 16. 이전 1 ··· 9 10 11 12 13 14 15 ··· 20 다음