Haroop Webagency team BICTOR

원격 및 파견 개발팀분들을 위한 하룹소속 개발자전용 빅터 오픈소스 커뮤니티입니다

이곳은 하룹 개발팀 소속 직원들에 전체 개발기술력 및 전체 평균 능력치 강화를 위한, 빅터팀 리드개발자들에 오픈소스 개발 커뮤니티 공간입니다, 만약 고객이시라면 여기를 이용해주세요.

제목
하.....지도api 관련 문제..ㅠㅠㅠㅠ 도와주십쇼ㅠㅠ
작성자
제이
작성일
2022-05-26 13:56
조회
209
답변완료
지도를 숨겼다가 특정 액션에 도달할 경우에, 이벤트를 걸어서
지도가 나타나게 하였습니다.
기존에 바로 지도를 뜨게 할 경우에는, 지도가 바로 노출이 되는데
숨겼다가 이벤트 발생시 뜨게 하면, 지도가 거의 다 꺠져서 나오네요...ㅠ

지도는 카카오 개발자센터에서 api 앱 만들고, rest api로 연결한뒤에
현재 개발중인 병원 홈페이지 도메인 추가까지 다 해놓았습니다.

이벤트를 안걸면 상관이 없는데.... 이게 무조건 이벤트를 걸어서 특정 액션에 도달할때 띄워줘야 해서...ㅠㅠ
부탁드리겠습니다ㅠㅠ
전체 2

  • 2022-05-26 16:02

    안녕하세요 위와 같은 증상은 카카오지도api에 호출시점 때문에 주로 발생됩니다.
    카카오지도경우 지도안에 넣는 html 너비와 높이에 따라 영역을 잡는데
    이것이 제대로 설정되지 않으면, 문제가 발생됩니다.

    즉 페이지 시작부터 display:none을 걸어버리셨기에
    특정 이벤트시 출력이 시작되면서, 카카오지도에서 해당부분에 너비 높이등을 정확히 불러오지 못하게 되는것입니다.
    이러한 경우 보통 두가지가 있습니다.

    첫번째는 map.relayout(); 함수를 이용하시는것입니다.
    block으로 변경처리 되신 직후 위 함수를 실행시켜주시게끔 코드를 짜시면
    정상적으로 잘 로드되실것입니다. 이외에 map.setCenter(), map,setLevel()을 호출해서 지도중심을 재설정하셔야 할수도있습니다.

    두번째 방식은 애초에 페이지 진입시 출력시켜버리는것입니다.
    시간을 설정하신후 일부 시간동안만 노출을 시키는것이죠.
    대략 200을 설정하시면 정상적으로 되실것이고 200이하로는 정상적 노출이 안되실겁니다.
    즉 0.2초동안 뜨다가 그후에 display:none을 걸어주시면, 나중에 이벤트 발생시 정상적으로 뜨실거에요.
    만약 지도가 페이지 입장시 바로 보인다면, 이방법보다 위방법이 나을것이고
    만약 지도가 페이지 입장에서도 바로는 보이지 않는다면 이방법으로 출력시킨후 0.2초후 display:none을 걸어주시는방법이
    개발하시긴 좀 더 편하실거에요.

    제이님이야 코드를 워낙 잘 짜시기에, 상세 코드는 안짜드려도되겠죠?^^
    (일단 한번 코드를 짜보시고 그래도 안되면 말씀해주시면, 저희가 짜드리도록 하겠습니다.)

    그럼 도움이 되셨길 바라며, 언제든 도움 필요하신경우 말씀해주세요.


    • 2022-05-27 10:42

      감사합니다ㅠㅠ 두번째 방식으로 처리하였습니다. set time을 제이쿼리로 200을 주고
      처리시키는 명령을 짜니, 아주 잘되네요ㅠ 항상 감사드립니다