• 카테고리

    질문 & 답변

  • 세부 분야

    풀스택

  • 해결 여부

    미해결

마커 표시가 안됩니다.

21.05.13 12:16 작성 조회수 96

1

<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8"/>
  <title>myfirstmap</title>
  <style>

body {
  padding: 0px !important;
  margin: 0px !important;
}

#navbar {
  height: 50px;
  width: 100%;
  background: #262626;
  color: white;
  font-weight: bolder;
  font-size: 25px;
  display: flex;
  justify-content: center;
  align-items: center;

}

#infoBox {
  position: absolute;
  top: 100px;
  z-index: 10000;
  background: white;
  left: 20px;
  padding: 15px;
  border: solid 1px #262626;
  border-radius: 4px;
  text-align: center;
}

#infoTitle {
  font-size: 15px;
  font-weight: bolder;
}

.marker {
  border: solid 1px #000000;
  background: green;
  opacity: 0.8;
  width: 24px;
  height: 24px;
}
  </style>

</head>
<body>
  <div id="navbar">myfirstmap</div>
  <div id="infoBox">
    <div id="infoTitle">현재 날짜</div>
    <div id="infoContent">2021.05.09</div>
  </div>
  <div id="map" style="width:100%;height:100vh;"></div>

  <script type="text/javascript" src="//dapi.kakao.com/v2/maps/sdk.js?appkey=앱키"></script>
  <script>
    var container = document.getElementById('map');
    var options = {
      center: new kakao.maps.LatLng(33.396273295560555, 126.4955679259172),
      level: 3
    };
    var map = new kakao.maps.Map(container, options);

    marker = new kakao.maps.Marker({
      map: map,
      position : new kakao.maps.LatLng(33.396273295560555, 126.4955679259172),
      icon: {
        content: "<div class='marker'></div>"
      }
    })
  </script>
</body>
</html>
course-thumbnail

코로나맵 개발자와 함께하는 지도서비스 만들기 1

마커 만들고 지도위에 표시하기

강의실 바로가기

답변 1

답변을 작성해보세요.

0

이동훈님의 프로필

이동훈

지식공유자

2021.05.25

질문 주셔서 감사합니다:)

자세한 에러 사항을 알기 위해서 브라우저의 콘솔에 뜨는 에러를 캡쳐해서 보내주시면 좀 더 빠르게 해결이 가능할 것 같습니다~!!

감사합니다~!:)

이 글과 비슷한 Q&A