반응형 전체 글119 maplibre gl : Event 'data', 'dataloading' 차이 map.on('dataloading', () => { // Display a loading indicator // 데이터 로딩시작, 로딩중일 때 발생 console.log('Data loading...'); }); map.on('data', () => { // Data is loaded and ready to be displayed // 데이터가 로드되고 화면에 보여질 준비가 끝났을 때 발생 console.log('Data loaded.'); }); 2023. 3. 21. maplibre-gl-geocoder 사용법 +Carmen GeoJSON https://maplibre.org/maplibre-gl-js-docs/example/geocoder/ https://github.com/maplibre/maplibre-gl-geocoder npm install --save @maplibre/maplibre-gl-geocoder 패키지 설치 import MaplibreGeocoder from '@maplibre/maplibre-gl-geocoder'; import '@maplibre/maplibre-gl-geocoder/dist/maplibre-gl-geocoder.css'; // Functions should return Carmen GeoJSON https://github.com/mapbox/carmen/blob/mas.. 2023. 3. 16. maplibreGl 드래그 이벤트 구현 const { data: { rows: levelDatas = \[\] } = {} } = await this.$axios.get('/api', { params: { facilityId: this.facility.\_id, indoor: 'level', }, }) this.levelDatas = levelDatas this.map.addSource('facility-level', { type: 'geojson', data: turfFeatureCollection(levelDatas), // generateId: true, promoteId: 'level', }) this.map.addLayer({ id: 'facility-le.. 2023. 3. 10. mapLibreGl layer style(paint) property # mapLibreGl layer 속성 paint: { 'fill-opacity': ['get', 'color'], // data-expression 사용 가능 ... } paint: { 'fill-extrusion-opacity': 0.5 // data-expression 사용 불가능 } 2023. 3. 7. kibana ids 필드 (_id 를 or 조건으로 검색) GET {index}/_search { "query": { "ids" : { "values" : ["_id_1", "_id_2", "_id_3"] } } } ids 필드만 사용했을 때는 bool 필드를 넣으면 검색이 안된다. or { "bool": { "must": { "match": { "_all": "your search text" } }, "filter": { "ids": { "values": ["_id_1", "_id_2", "_id_3"] } } } }document 의 _id 필드로 or 검색을 하고 싶을 때 사용. 2023. 3. 6. 자바스크립트 무한 스크롤 (팝업 다이얼로그) javascript infinite scroll DIV ENTRY DIV ENTRY DIV ENTRY ... id 가 data 인 div 에 무한스크롤을 적용할 때 scroll 이벤트 발생시 아래 조건에 의해 함수가 실행되도록 작성한다. document.querySelector('#data').scrollTop + document.querySelector('#data').offsetHeight >= document.querySelector('#data').scrollHeight + 10(offset용) // + 10을 해준 이유는 스크롤 최하단이 scrollHeight값보다 1픽셀 작은 경우가 있기 때문에 // 스크롤 최하단에 닿지 않더라도 10픽셀정도 여유를 준 것이다. // 스크롤 최하단 - 10 에 스크.. 2023. 1. 27. linux set default text editor 리눅스 기본 텍스트 에디터 설정 sudo update-alternatives --config editor입력 후 사용가능한 텍스트 에디터 목록이 나온다. 번호를 입력해서 변경해주면 즉시 적용된다. 2023. 1. 25. kurento 용어집 Bower 웹용 패키지 관리자입니다. 빌드 스택에서 사용할 수 있는 API를 통해 패키지 종속성 모델을 노출하면서 프런트 엔드 패키지 관리 문제에 대한 일반적인 솔루션을 제공합니다. 빌더패턴 빌더 패턴은 텔레스코핑 생성자 안티 패턴에 대한 솔루션을 찾는 것이 목적인 객체 생성 소프트웨어 디자인 패턴입니다. 텔레스코핑 생성자 안티 패턴은 개체 생성자 매개 변수 조합의 증가로 인해 생성자의 기하급수적 목록이 생성될 때 발생합니다. 수많은 생성자를 사용하는 대신 빌더 패턴은 각 초기화 매개변수를 단계별로 수신한 다음 생성된 결과 객체를 한 번에 반환하는 또 다른 객체인 빌더를 사용합니다. EOS End Of Stream은 일부 미디어 소스의 재생이 완료되었을 때 발생하는 이벤트입니다. Kurento에서 일부 .. 2023. 1. 12. tistory markdown 공백 여러줄 삽입(공백두칸, 엔터두번 안먹힐때) 보통 마크다운에서 ' ' 공백 두칸, 엔터 두번을 입력하면 개행이 된다. 하지만 단락과 단락 사이에는 공백을 몇칸 입력해도, 엔터를 몇번 입력해도 개행은 한번만 된다. 위처럼 수평줄 (***)을 입력하고 위 아래 여러줄 공백을 삽입하고 싶을 때는 ` `(백틱, 물결표시 ~ 입력키 사이에 공백한칸) 이나 백슬래시 \(₩ 원화기호 키) 를 사용하면 된다. 첫번째줄 ` ` ` ` 두번째줄\ \ \ *** ` ` \ 위처럼 입력하면 첫번째줄 두번째줄 \ 위처럼 나온다/ ₩ 원화기호 키는 문장 뒤에 한번만 사용할 수 있으니 참고하자. 2023. 1. 6. 이전 1 2 3 4 5 6 ··· 14 다음 반응형