zeakd / react-naver-maps

React Navermaps API integration for modern development.
https://zeakd.github.io/react-naver-maps/
118 stars 23 forks source link

Overlay 예제 질문 #14

Closed bearics closed 5 years ago

bearics commented 5 years ago

개발자님, react 포팅 감사합니다. react 초보자인 저에게 큰 도움이 되고 있습니다. 그런데 질문이 있어서 이슈를 통해 남깁니다.

개발자님께서 올려주신 예제를 실행해보고 있는데 제대로 나타나지 않습니다. 예제소스

결과 화면 [아래 소스 코드 실행 결과 화면] image

소스코드

import {  RenderAfterNavermapsLoaded,  NaverMap, Circle } from "react-naver-maps";

const cx = classNames.bind(styles);

class Map extends Component {

  render() {
    return (
      <div className={cx("map-panel")}>
        <Header>위치</Header>
        <div className={cx("body")}>
          <RenderAfterNavermapsLoaded ncpClientId="####">
          <NaverMap 
            naverRef={ref => { this.mapRef = ref }}
            id='maps-examples-map-simple'
            style={{
              width: '100%',
              height: '600px',
            }}
            defaultCenter={{x: 126.5343612, y: 33.3590625}}
          >
            <Circle 
              center={{x: 126.5343612, y: 33.3590625}}
              radius={100}
              fillOpacity={0.5}
              fillColor={'#FF0000'}
              strokeColor={'red'}
              console.log('');kable={true} // click event를 다루기 위해서는 true로 설정되어야함.
              onClick={() => {
                alert('여기는 한라산 입니다.')
              }}
            />
          </NaverMap>
          </RenderAfterNavermapsLoaded>
        </div>
        <Footer />
      </div>
    );
  }

}

export default Map;

위 소스코드는 제가 테스트 해본 코드 입니다. 혹시 어디가 문제인지 알 수 있을까요?

zeakd commented 5 years ago

@bearics 님 안녕하세요. 메일까지 주셨는데 답변이 너무 늦어서 죄송합니다. 확인해본결과 퍼포먼스 관련한 지난 업데이트이후로 생긴 버그였습니다. 동적으로 children이 추가될 경우엔 잘 동작하지만, componentDidMount시 children이 있을 때 setMap이 되지 않는 이슈였습니다. 업데이트 해서 배포하도록 하겠습니다.

zeakd commented 5 years ago

v0.0.13 hotfix 버전이 배포 되었습니다. @bearics 최신버전으로 인스톨하여 사용해보시고 다시알려주세요. 왜 안되지 하고 마음많이 쓰셨을 거 같은데 죄송합니다 ㅠㅠ

bearics commented 5 years ago

개발자님 감사합니다. Circle 나오는거 확인했습니다. 감사합니다. image