반응형
※ XAMPP 다운로드
XAMPP는 크로스 플랫폼 웹 서버 자유 소프트웨어 패키지다(아파치 웹 서버, MariaDB, PHP, Perl을 포함)
※ 데이터 시각화 예제
0. 서버 실행
실행 후, localhost에 접속하면 다음 창이 나타난다.
localhost로 연결하는 파일의 위치: C:\xampp\htdocs
1. http://d3js.org접속
2. 샘플 예제 테스트를 위해 See More Example 메뉴 선택
3. D3js 사이트에 있는 Bubblechart 예제 선택
4. bubble-chart 압축파일과 flare.csv 파일을 다운 받아 C:\xampp\htdocs에 위치시키기
+ flare.csv 파일은 files란 폴더에 위치시킨다.
5. bubble-chart 폴더 내 64e74b~.js 파일 정보 수정
export default function define(runtime, observer) {
const main = runtime.module();
const fileAttachments = new Map([["flare.csv",new URL("./files/aee5d40e70ea9830c96efe6da03ad32187ff7223ad1b7b84e38c32127ccf6661b576fe0005b42657703e7bfaaefabc74550268cc35f64122a652fc471110c832",import.meta.url)]]);
main.builtin("FileAttachment", runtime.fileAttachments(name => fileAttachments.get(name)));
main.variable(observer()).define(["md"], function(md){return(
md`# Bubble Chart
Bubble charts are non-hierarchical [packed circles](/@d3/circle-packing). The area of each circle is proportional its value (here, file size). The organic appearance of these diagrams can be intriguing, but also consider a [treemap](/@d3/treemap) or a humble [bar chart](/@d3/horizontal-bar-chart).`
)});
new Url("./files/flare.csv", import.meta.url) 수정
export default function define(runtime, observer) {
const main = runtime.module();
const fileAttachments = new Map([["flare.csv",new URL("./files/flare.csv",import.meta.url)]]);
main.builtin("FileAttachment", runtime.fileAttachments(name => fileAttachments.get(name)));
main.variable(observer()).define(["md"], function(md){return(
md`# Bubble Chart
Bubble charts are non-hierarchical [packed circles](/@d3/circle-packing). The area of each circle is proportional its value (here, file size). The organic appearance of these diagrams can be intriguing, but also consider a [treemap](/@d3/treemap) or a humble [bar chart](/@d3/horizontal-bar-chart).`
)});
5. https://localhost/bubble-chart/
※ 데이터 시각화 자료 수집
- 정부 3.0 공공데이터 포털(https://data.go.kr/)
- 경기데이터드림(https://data.gg.go.kr/portal/mainPage.do)
- TourAPI(https://api.visitkorea.or.kr/main.do)
- 농림축산식품 공공데이터 포털(https://data.mafra.go.kr/main.do)
- 네이버 데이터랩
- 미국 공공데이터 포털(https://www.data.gov/)
- 유럽연합 공공포털(https://data.gov.uk/)
반응형
'프로그래밍' 카테고리의 다른 글
[웹] JSP 예제(MySQL과 연동, 웹 브라우저 출력)(2) (0) | 2021.06.23 |
---|---|
[데이터 수집] 빅데이터 수집 시스템 개발(Selenium) (0) | 2021.06.22 |
[웹] JSP 예제(MySQL과 연동, 웹 브라우저 출력)(1) (0) | 2021.06.22 |
[HTML] jQuery, AJAX 활용 (0) | 2021.06.21 |
[Web] Login Process 제작 (0) | 2021.06.17 |