shp 파일 JSON으로 변환하기

2025.08.28 09:36

1. mapshaper 사이트 접속https://mapshaper.org/ mapshaper mapshaper.org 2. 파일첨부.dbf .shp .shx 파일 모두 첨부 3. Simplify1. 우측 상단 Simplify 클릭2. Visvlingam / weighted area 선택, Apply 클릭3. 게이지 조절 4. 파일 저장1. 우측 상단 Export 클릭2. GeoJSON 선택3. Export 인코딩이 깨져서 나올 때파일 오픈 시 옵션을 입력해줘야 한다. 1. 파일 첨부 전 with advanced options 체크2. 파일 첨부 (.dbf .shp .shx 파일 모두 첨부)3. input 창에 encoding=cp949 입력4. Submit 좌표계 문제 (GeoJSON..

forEach와 Promise.all

2025.02.05 22:02

ForEach의 동작먼저 예시 프로그램을 하나 보겠습니다.function test() { const testFunction = num => new Promise((resolve) => setTimeout(() => resolve(`${num}`), num)); const list = [3000, 2000, 3000, 4000, 1000, 1000, 2000, 3000, 1000, 1000]; list.forEach( val => { const result = testFunction(val); result.then(cosole.log); })}test(); list 에는 순서대로 timeout의 값들이 들어가 있고, forEach를 통해 순회하면서 testFunction을 실행하여 해..

깃(Git) 개념과 상황별 팁

2025.02.02 00:18

기본 개념과 명령어초기화깃을 올바로 사용하려면 깃이 파일의 변경 내용을 추적하는 방식을 이해하는 것이 무척 중요하다. 그렇지 않고 백업 용도로만 깃을 사용하면 장님이 코끼리 만지는 것처럼 딱 그만큼만 알게 되기 때문이다. 깃은 폴더의 어떤 파일이라도 모두 트래킹 할 수 있다. 원하는 폴더로 이동해 깃 초기화 커맨드부터 시작한다.$ git init .git 이라는 이름의 숨김 폴더가 하나 생긴다. 이것을 저장소라고 하는데 깃은 이 폴더의 모든 변경 내용을 여기에 저장한다. 이 파일을 지우면 더 이상 깃으로 폴더의 변경사항을 추적할 수 없다.  스테이징깃이 파일의 변경 내역을 저장하는데 곧바로 저장하는 것이 아니라 스테이징이라는 단계를 거친다. 스테이징은 변경사항 중에서 저장하고 싶은 부분만 선택해 임시로 ..

Web Components : Custom Elements

2025.01.24 08:43

기본 설명Custom Elements는 사용자 HTML Element를 만들게 해준다. 그리고 이는 DOM의 모든 기능을 다 사용할 수 있다.기본적으로 두 가지 타입으로 생성한다.표준 HTML 요소를 상속하지 않은 Elements. 요소는 상속하지 않지만 HTML Element는 상속 한다.표준 HTML 요소를 상속한 Element.이렇게 생성한 Element는 Lifecycle callback을 class 안에 정의하여 특정 시점에 동작 하도록 한다.  기본 사용법독립적인 사용자 정의 요소class MyComponent extends HTMLElement { constructor() { // 항상 super를 호출 해야 한다. super(); this.innerHTML = `T..

svg see: SVG 파일 미리보기 extention

2024.11.25 10:24

svg 미리 보기 활성화 하는 방법파일을 직접 열지 않아도 미리 볼 수 있기 때문에, 작업 속도가 빨라집니다. 특히 여러 SVG 파일을 다루는 경우 시간 절약 효과가 더욱 뛰어납니다.  확장 프로그램 설치 하기https://github.com/tibold/svg-explorer-extension/releasesSVG SEE 프로그래 설치 사이트로 이동해서 컴퓨터 사양에 맞는 버전을 다운로드 합니다.(32bit -> x86, 64bit -> x64)    https://mu08.tistory.com/198 [윈도우 팁]SVG 파일, 이제 미리보기로 확인해보자(svg see)안녕하세요 무택입니다 :) 오늘은 아주 간단하게 SVG 미리 보기 활성화하는 방법에 대해 포스팅해 보도록 하겠습니다! 웹 디자인 작업 ..

맥북 (Mac OS) M2 톰캣 설치하기

2024.09.03 15:02

1. 톰캣 설치아파치 톰캣 사이트에 접속합니다.https://tomcat.apache.org/ 페이지 왼쪽의 `Download` 카테고리에서 다운로드 할 톰캣 버전을 클릭합니다.내게 맞는 톰캣 버전을 찾는 방법 참고: https://itworldyo.tistory.com/88  `Binary Distributions` 항목에서 `tar.gz` 파일을 클릭 해 다운로드 합니다.  저장 경로를 설정하고 `저장` 버튼을 클릭합니다.다운로드가 시작됩니다.   설치 된 `tar.gz` 파일을 더블 클릭하여 압축을 해제 합니다.  2. 톰캣 실행  `Finder`에서 톰캣이 설치된 경로로 접속합니다.키보드에서 `command` + `option` + `c` 를 동시에 눌러 경로를 복사합니다.  터미널을 실행합니다...

input type=password ios/aos 폰트 크로스브라우징 이슈

2023.04.06 22:09

이슈`input type="password"`는 값을 입력하면 value가●●●●● 형태로 출력이 되는데, 이 도트의 사이즈가 브라우저별로 상이하여디자인적으로 value가 input 가로사이즈 영역을 넘어서는 문제, 크로스브라우징 문제가 발생했다. 검색결과문제는 (2016년 기준) 비밀번호 입력란에 파이어폭스와 인터넷 익스플로러는 유니코드 코드포인트를 사용하는 '검은 동그라미'(●) 문자를 사용하지만, 크롬은 ' 25CF불렛'(•) 문자를 사용한다는 점이다. ios safari 에서도 큰 검은 동그라미 형태로 출력되어, 디자인적으로 input 가로사이즈 영역을 넘어서는 문제가 발생하게 되었다.  해결방법'pass' 라는 base64 사용자정의 글꼴을 사용하여 도트의 사이즈를 통일했다.placeholde..

오픈그래프(Open Graph) 메타태그(meta tag)

2021.11.16 10:07

open graph 태그란? - 페이스북이나 네이버 블로그, 카카오톡 등에서 링크를 공유하면 자동으로 링크에 대한 미리보기 제목, 설명, 이미지를 제공하게 되는데, 이를 제어할 수 있는 태그 - 오픈그래프 프로토콜은 페이스북에 의해서 처음 만들어 짐 - 오픈그래프는 HTML문서의 메타정보를 쉽게 표시하기 위해 만들어짐 - 메타정보에 해당하는 제목, 설명, 문서의 타입, 대표 URL등 다양한 요소들에 대해서 사람들이 통일하여 쓸 수 있도록 정의해 놓은 프로토콜임. open graph 작동원리 1. 사용자가 링크를 입력창에 입력 2. 페이스북, 네이버 블로그, 카카오톡은 입력창의 문자열이 '링크'라는 것을 파악함 3. 링크라는 것이 파악되면 페이스북, 네이버 블로그, 카카오톡의 크롤러는 미리 그 웹사이트를 ..

shp 파일 JSON으로 변환하기

2025.08.28 09:36

1. mapshaper 사이트 접속https://mapshaper.org/ mapshaper mapshaper.org 2. 파일첨부.dbf .shp .shx 파일 모두 첨부 3. Simplify1. 우측 상단 Simplify 클릭2. Visvlingam / weighted area 선택, Apply 클릭3. 게이지 조절 4. 파일 저장1. 우측 상단 Export 클릭2. GeoJSON 선택3. Export 인코딩이 깨져서 나올 때파일 오픈 시 옵션을 입력해줘야 한다. 1. 파일 첨부 전 with advanced options 체크2. 파일 첨부 (.dbf .shp .shx 파일 모두 첨부)3. input 창에 encoding=cp949 입력4. Submit 좌표계 문제 (GeoJSON..