본문 바로가기

분류 전체보기340

[React.js] react-leaflet Tooltip에 EventHandler 구현하기(interactive Option) react-leaflet의 Marker는 기본적으로 Interactive Layer로 동작하여, 클릭하면 PopUp 메세지를 띄울 수 있다. Tooltip은 보통 Marker를 설명하는 말풍선 느낌으로 사용하는데, Tooltip을 클릭할 시 다른 화면을 띄우고 싶었다. React API를 참고하면 Tooltip에 아래와 같은 Option을 확인할 수 있다. 이 중 interactive의 값을 true로 하면 해당 컴포넌트를 Interactive Layer로 적용한다. 아래는 React API에 설명되어 있는 Interactive Layer에 대한 설명으로, Interactive Layer는 click이나 mouseover와 같은 마우스 이벤트를 다룰 수 있는 레이어이다. 사용할 수 있는 이벤트 종류는 사.. 2021. 4. 9.
헤로쿠(Heroku)로 Node.js 호스팅하기 2022년 11월 28일 이후부터는 유료화가 되었습니다.. Bye Heroku 원래는 Node.js 무료 호스팅 방법으로 Firebase를 이용하고는 했었다. 하지만 최근에 Firebase spark 요금제에서 Cloud Functions 서비스를 종료하는 바람에 무료 호스팅이 불가능하게 되었다.. 자세한 내용은 아래 내용을 참고한다. Firebase spark 요금제 Cloud Functions 서비스 종료 Spark 요금제에서 Cloud Functions를 더 이상 이용할 수 없다. 2020년 6월 22일부터 Cloud Functions에서 Node.js Version 10을 사용하려면 Blaze 요금제를 사용하도록 했다. Spark 요금제로 Cloud Functions을 사.. doqtqu.tist.. 2021. 4. 7.
[React.js] 'Class Component' Vs 'Functional Component' React Component에는 Class형과, Function형 두 가지가 존재한다. 두 컴포넌트를 코드를 이용해서 분석해보자. 1. Rendering JSX JSX란? JSX란 JavaScript XML의 약자로, JavaScript를 확장한 문법이다. React에서는 이벤트가 처리되는 방식, 시간에 따라 state가 변하는 방식, 화면에 표시하기 위해 데이터가 준비되는 방식 등 렌더링 조직이 본질적으로 다른 UI 로직과 연결된다는 사실을 받아들인다. React는 별도의 파일에 마크업과 로직을 넣어 기술을 인위적으로 분리하는 대신, 둘 다 포함하는 "컴포넌트"라고 부르는 느슨하게 연결된 유닛으로 관심사를 분리한다. React는 JSX 사용이 필수가 아니지만, 대부분의 사람은 JavaScript 코드 .. 2021. 3. 26.
Firebase spark 요금제 Cloud Functions 서비스 종료 Spark 요금제에서 Cloud Functions를 더 이상 이용할 수 없다. 2020년 6월 22일부터 Cloud Functions에서 Node.js Version 10을 사용하려면 Blaze 요금제를 사용하도록 했다. Spark 요금제로 Cloud Functions을 사용하기 위해서 Node Version을 8로 다운그레이드 하는 편법을 사용했지만, 2021년 3월 15일부터는 Cloud Functions에서 Node.js Version 8 사용이 아예 불가능하게 바뀌었다. 아래는 Node.js version 8에서, firebase deploy --only functions로 functions deploy시 발생하는 오류 Deploys to runtimes below Node.js 10 are no.. 2021. 3. 25.
[Ubuntu 18.04.5] PHP에서 Anaconda 환경변수 사용하기 1. Anaconda 설치하기 Anaconda | Individual Edition Anaconda's open-source Individual Edition is the easiest way to perform Python/R data science and machine learning on a single machine. www.anaconda.com 위 링크에서 Linux 64-Bit(x86) Installer의 마우스 오른쪽 클릭 후 링크주소복사를 한다. 그 다음 사용자 홈디렉터리에서 벗어나서 모든 사용자가 접근할 수 있는 경로에 리눅스 설치 파일을 다운받은 후 설치 해준다. cd /opt #예시 sudo wget https://repo.anaconda.com/archive/Anaconda3-20.. 2021. 3. 23.
[OpenCV] tracker API를 이용해 영상의 사물 추적 import cv2 import sys # cv2 버전 확인 (major_ver, minor_ver, subminor_ver) = (cv2.__version__).split('.') if __name__ == '__main__' : tracker_types = ['BOOSTING', 'MIL','KCF', 'TLD', 'MEDIANFLOW', 'GOTURN', 'MOSSE'] tracker_type = tracker_types[2] if int(minor_ver) < 3: tracker = cv2.Tracker_create(tracker_type) else: if tracker_type == 'BOOSTING': tracker = cv2.TrackerBoosting_create() if tracker_t.. 2021. 3. 22.
반응형

티스토리툴바