본문 바로가기

분류 전체보기

 (383)
CSS display flex 수직정렬, 중앙정렬 span에도 먹힐까. (먹힌다) 부모 div에 `display: flex; justify-content: center; align-items: center;` 속성을 사용하면 자식 요소들을 수평 및 수직 중앙에 정렬할 수 있습니다. 이때 span 태그가 inline 속성을 가지더라도 정렬이 되는 이유는 flexbox 레이아웃 모델의 작동 원리 때문입니다. `display: flex;`를 설정하면 부모 요소가 flex 컨테이너가 됩니다. Flex 컨테이너는 자식 요소들을 flex 아이템으로서 관리하며, `justify-content`와 `align-items` 속성을 사용하여 아이템들을 정렬할 수 있습니다. - `justify-content`: 수평 방향 정렬을 조정합니다. `center`를 설정하면 아이템들이 수평 방향 가운데로 정렬됩..
구글 지도 위도경도 안나옴 (사실은 나옴) 지도기반 개발하다보니 간단하게 위도 경도가 필요한데.... 구글맵에서 위도경도가 보이지 않았다!! 오잉!!! 그러나 가만보니까.. 있기는 있었다!!! 1) 구글지도에서 위경도를 원하는 곳에서 마우스 오른쪽 클릭! "이곳이 궁금한가요?"를 클릭! 2) 마우스 포인터가 있던 자리에 작은 회색 마커 아이콘이 생깁니다. 이 아이콘을 다시 한번 클릭! 3) 위도 경도가 보입니다! 그러나.. 복사는 안되더라구요! 지도에서 움직이는 순간 사라집니다..!! 그래서 저는.. 메모장을 열어서 고대로 받아 적었습니다! 복사가 되면 얼마나 좋을까 싶은데...왜 이렇게 바뀐건지...? ㅡ,.ㅡ ;;
Tabulator 타블레이터 그리드(테이블) 2개 그리드1 : tableTempData = [ {ORIGIN:"남구", DETINATION:"남구", passage:"999,999", GRP_ID:"01"}, {ORIGIN:"동구", DETINATION:"남구", passage:"999,999", GRP_ID:"02"}, {ORIGIN:"서구", DETINATION:"남구", passage:"999,999", GRP_ID:"03"} ]; dsrcOD.grid1 = new Tabulator('#'+dsrcOD.pv+'Grid_od',{ data : tableTempData, placeholder:"No Data Set", movableRows:true, movableRowsConnectedTables:'#'+dsrcOD.pv+'Grid', movableR..
오픈레이어스 선 긋기 OpenLayers LineString OpenLayers 버전 v7.4.0 오픈레이어스 선 긋기 예제.. 이거 하나 하느라 몇시간을 불태웠는지.. 후.. 역시 알고나면 아무것도 아닌데, 알기전에는 너무 스트레스다. html : js : // OpenLayers에서 맵을 생성합니다. var map = new ol.Map({ target: 'map', // 맵이 표시될 영역의 ID를 지정합니다. layers: [ // 기본적으로 사용할 레이어를 추가합니다. 여기서는 OSM (OpenStreetMap)을 사용합니다. new ol.layer.Tile({ source: new ol.source.OSM() }) ], view: new ol.View({ center: ol.proj.fromLonLat([127.0287172, 37.2635620]), /..
프로그래머스 수 조작하기 1 코딩테스트 수조작하기1 JAVA 출처: 프로그래머스 코딩 테스트 연습, https://school.programmers.co.kr/learn/challenges 코딩테스트 연습 | 프로그래머스 스쿨 개발자 취업의 필수 관문 코딩테스트를 철저하게 연습하고 대비할 수 있는 문제를 총망라! 프로그래머스에서 선발한 문제로 유형을 파악하고 실력을 업그레이드해 보세요! school.programmers.co.kr 문제 : 정수 n과 문자열 control이 주어집니다. control은 "w", "a", "s", "d"의 4개의 문자로 이루어져 있으며, control의 앞에서부터 순서대로 문자에 따라 n의 값을 바꿉니다. "w" : n이 1 커집니다. "s" : n이 1 작아집니다. "d" : n이 10 커집니다. "a" : n..
프로그래머스 코딩테스트 마지막 두 원소 마지막 두 원소 JAVA 출처: 프로그래머스 코딩 테스트 연습, https://school.programmers.co.kr/learn/challenges 코딩테스트 연습 | 프로그래머스 스쿨 개발자 취업의 필수 관문 코딩테스트를 철저하게 연습하고 대비할 수 있는 문제를 총망라! 프로그래머스에서 선발한 문제로 유형을 파악하고 실력을 업그레이드해 보세요! school.programmers.co.kr 문제 설명 : 정수 리스트 num_list가 주어질 때, 마지막 원소가 그전 원소보다 크면 마지막 원소에서 그전 원소를 뺀 값을 마지막 원소가 그전 원소보다 크지 않다면 마지막 원소를 두 배한 값을 추가하여 return하도록 solution 함수를 완성해주세요. 해결 코드 : class Solution { pub..
기능개발 브런치 딸 떄, 이름 기능개발 브런치 딸 떄, 이름 참고 :feature/login 이런식 https://gmlwjd9405.github.io/2018/05/11/types-of-git-branch.html [GitHub] Git 브랜치의 종류 및 사용법 (5가지) - Heee's Development Blog Step by step goes a long way. gmlwjd9405.github.io 참고 : https://gmlwjd9405.github.io/2017/10/27/how-to-collaborate-on-GitHub-1.html [GitHub] GitHub로 협업하는 방법[1] - Feature Branch Workflow - Heee's Development Blog Step by step goes a lon..
canvas 크기 설정 시 제대로 적용 안될 때 ( chartjs 등 라이브러리사용시 ) chartjs라던가 라이브러리를 사용하면서 canvas를 사용중이라면 canvas의 크기가 지멋대로 설정되는 듯 느낀 경우가 있을 것이다. 해결 방법은 canvas를 감싸고 있는 부모 엘리먼트에 position:relative 속성을 주어서 해결 할 수 있다. 라이브러리를 사용하다보면, 미처 깨닫지 못한 부분의 영향을 받고 있는데 그걸 발견하지 못해서 생기는 경우가 허다하다. 일단 간단하게 canvas 사용시에는 부모에게 position:relative 속성으로 해결함.

티스토리툴바