<![CDATA[
<p>1) highcharts    <br>주소 : <a href="https://www.highcharts.com/" target="_blank" class="ke-link">https://www.highcharts.com/</a></p><p>사용방법 : <a href="https://coor.tistory.com/18" target="_blank" class="ke-link">https://coor.tistory.com/18</a></p><div class="figure-open" contenteditable="false" data-ke-type="opengraph" data-ke-align="alignLeft" data-og-type="website" data-og-title="하이차트 (Highcharts) 사용하기" data-og-description="들어가며 장비 모니터링 시스템에서 프로세스 상세 정보를 보고자 하는 대상 장비에 대한 전체 프로세스, CPU, Memory, I/O 모니터링이 보기 위해서 시각적으로 한눈에 들어오는 라" data-og-host="coor.tistory.com" data-og-source-url="https://coor.tistory.com/18" data-og-url="https://coor.tistory.com/18" data-og-image="https://scrap.kakaocdn.net/dn/bivCNT/hyPOC1iAvd/ZhyPPOu3JrrBwf62ksWrmk/img.png?width=800&height=163&face=0_0_800_163,https://scrap.kakaocdn.net/dn/bsFMd6/hyPOLcRVDB/DcJt2SwhDH2dzllH0DF5Rk/img.png?width=800&height=163&face=0_0_800_163,https://scrap.kakaocdn.net/dn/G6RxP/hyPOHO5sm4/0jKkOiGKIiORBWBCp88Kqk/img.png?width=1669&height=760&face=0_0_1669_760"><a href="https://coor.tistory.com/18" target="_blank" data-source-url="https://coor.tistory.com/18"><div class="og-image" style="background-image:url(https://scrap.kakaocdn.net/dn/bivCNT/hyPOC1iAvd/ZhyPPOu3JrrBwf62ksWrmk/img.png?width=800&height=163&face=0_0_800_163,https://scrap.kakaocdn.net/dn/bsFMd6/hyPOLcRVDB/DcJt2SwhDH2dzllH0DF5Rk/img.png?width=800&height=163&face=0_0_800_163,https://scrap.kakaocdn.net/dn/G6RxP/hyPOHO5sm4/0jKkOiGKIiORBWBCp88Kqk/img.png?width=1669&height=760&face=0_0_1669_760)"></div><div class="og-text"><p class="og-title">하이차트 (Highcharts) 사용하기</p><p class="og-desc">들어가며 장비 모니터링 시스템에서 프로세스 상세 정보를 보고자 하는 대상 장비에 대한 전체 프로세스, CPU, Memory, I/O 모니터링이 보기 위해서 시각적으로 한눈에 들어오는 라</p><p class="og-host">coor.tistory.com</p></div></a></div><p>highcharts로 Django에서 차트 그리기 :  <a href="https://dowtech.tistory.com/3" target="_blank" class="ke-link">https://dowtech.tistory.com/3</a></p><p> </p><p> </p><p> </p><p>2) echarts <br>주소 : <a href="https://echarts.apache.org/en/index.html" target="_blank" class="ke-link">https://echarts.apache.org/en/index.html</a> <br>사용방법 : <a href="https://ggomgom22.tistory.com/8" target="_blank" class="ke-link">https://ggomgom22.tistory.com/8</a></p><div class="figure-open" contenteditable="false" data-ke-type="opengraph" data-ke-align="alignCenter" data-og-type="website" data-og-title="ECharts.js 소개 및 설치" data-og-description="Introduction Apache ECharts는 직관적이고 대화형이며 사용자 정의가 가능한 차트를 상용 제품에 쉽게 추가할 수 있는 강력한 무료 차트 및 시각화 라이브러리입니다. 순수 JavaScript로 작" data-og-host="ggomgom22.tistory.com" data-og-source-url="https://ggomgom22.tistory.com/8" data-og-url="https://ggomgom22.tistory.com/8" data-og-image="https://scrap.kakaocdn.net/dn/cb6kv3/hyPOHIiXxz/baeDU52xU9TAREKcoOc6ck/img.png?width=800&height=543&face=0_0_800_543,https://scrap.kakaocdn.net/dn/cpQpq1/hyPNWAjrW3/t8mcx60qNBIR2mZFGE58MK/img.png?width=800&height=543&face=0_0_800_543"><a href="https://ggomgom22.tistory.com/8" target="_blank" data-source-url="https://ggomgom22.tistory.com/8"><div class="og-image" style="background-image:url(https://scrap.kakaocdn.net/dn/cb6kv3/hyPOHIiXxz/baeDU52xU9TAREKcoOc6ck/img.png?width=800&height=543&face=0_0_800_543,https://scrap.kakaocdn.net/dn/cpQpq1/hyPNWAjrW3/t8mcx60qNBIR2mZFGE58MK/img.png?width=800&height=543&face=0_0_800_543)"></div><div class="og-text"><p class="og-title">ECharts.js 소개 및 설치</p><p class="og-desc">Introduction Apache ECharts는 직관적이고 대화형이며 사용자 정의가 가능한 차트를 상용 제품에 쉽게 추가할 수 있는 강력한 무료 차트 및 시각화 라이브러리입니다. 순수 JavaScript로 작</p><p class="og-host">ggomgom22.tistory.com</p></div></a></div><p> </p><p>3) D3.js <br>주소 : <a href="https://d3js.org/" target="_blank" class="ke-link">https://d3js.org/</a> <br>         <a href="https://www.w3schools.com/ai/ai_d3js.asp" target="_blank" class="ke-link">https://www.w3schools.com/ai/ai_d3js.asp</a> <br>사용방법 : <a href="https://moo-you.tistory.com/414" target="_blank" class="ke-link">https://moo-you.tistory.com/414</a></p><div class="figure-open" contenteditable="false" data-ke-type="opengraph" data-ke-align="alignCenter" data-og-type="website" data-og-title="D3.js 다운로드 설치 및 사용방법 (시각화 라이브러리)" data-og-description="D3.js란? D3.js 는 자바스크립트 기반의 대화형 데이터 시각화를 만드는 라이브러리다. D3는 Data-Driven Documents 의 약자로 웹에서 데이터 시각화 프레임워크를 구축 한다. html문서의 svg객체로 표현되" data-og-host="moo-you.tistory.com" data-og-source-url="https://moo-you.tistory.com/414" data-og-url="https://moo-you.tistory.com/414" data-og-image="https://scrap.kakaocdn.net/dn/cwzgPq/hyPNYrly5a/rf23gBHk8JjGZxSUytzkL0/img.png?width=800&height=800&face=0_0_800_800,https://scrap.kakaocdn.net/dn/2qAhO/hyPNUJhoW7/59zVxWqSdnas2jh6sp2I2k/img.png?width=800&height=800&face=0_0_800_800,https://scrap.kakaocdn.net/dn/bq1ec2/hyPOMQoR76/ngaXDCTkde3izMOgULAPUk/img.png?width=622&height=286&face=0_0_622_286"><a href="https://moo-you.tistory.com/414" target="_blank" data-source-url="https://moo-you.tistory.com/414"><div class="og-image" style="background-image:url(https://scrap.kakaocdn.net/dn/cwzgPq/hyPNYrly5a/rf23gBHk8JjGZxSUytzkL0/img.png?width=800&height=800&face=0_0_800_800,https://scrap.kakaocdn.net/dn/2qAhO/hyPNUJhoW7/59zVxWqSdnas2jh6sp2I2k/img.png?width=800&height=800&face=0_0_800_800,https://scrap.kakaocdn.net/dn/bq1ec2/hyPOMQoR76/ngaXDCTkde3izMOgULAPUk/img.png?width=622&height=286&face=0_0_622_286)"></div><div class="og-text"><p class="og-title">D3.js 다운로드 설치 및 사용방법 (시각화 라이브러리)</p><p class="og-desc">D3.js란? D3.js 는 자바스크립트 기반의 대화형 데이터 시각화를 만드는 라이브러리다. D3는 Data-Driven Documents 의 약자로 웹에서 데이터 시각화 프레임워크를 구축 한다. html문서의 svg객체로 표현되</p><p class="og-host">moo-you.tistory.com</p></div></a></div><p> </p><p>4) fusion charts</p><p>주소 : <a href="http://www.fusioncharts.com/" target="_top" class="ke-link">http://www.fusioncharts.com/</a></p><p>사용방법 : <a href="https://www.nextree.co.kr/p2419/" target="_blank" class="ke-link">https://www.nextree.co.kr/p2419/</a></p><div class="figure-open" contenteditable="false" data-ke-type="opengraph" data-ke-align="alignCenter" data-og-type="website" data-og-title="내겐 너무 이쁜 Fusion Chart" data-og-description="들어가며..새로운 프로젝트를 들어가면서 처음 접해본 기술은 차트를 그릴 수 있는 Fusion Chart라는 스크립트 API였습니다. 프로젝트에서의 요구사항은 계획과 실적을 비교하여 볼 수 있도록 화면" data-og-host="www.nextree.co.kr" data-og-source-url="https://www.nextree.co.kr/p2419/" data-og-url="https://www.nextree.co.kr/p2419/" data-og-image="https://scrap.kakaocdn.net/dn/bTPHfD/hyPN1azkoL/hPCouR3KqgkA4uuM29gQGk/img.png?width=1167&height=188&face=0_0_1167_188,https://scrap.kakaocdn.net/dn/A0Sa2/hyPN3lUKAx/xqHua28rz7inIEdke9zPmK/img.png?width=1167&height=188&face=0_0_1167_188,https://scrap.kakaocdn.net/dn/cKweWW/hyPN4rAJUA/cZ4zxLiRsKbADUMsVNtdpk/img.jpg?width=810&height=369&face=0_0_810_369"><a href="https://www.nextree.co.kr/p2419/" target="_blank" data-source-url="https://www.nextree.co.kr/p2419/"><div class="og-image" style="background-image:url(https://scrap.kakaocdn.net/dn/bTPHfD/hyPN1azkoL/hPCouR3KqgkA4uuM29gQGk/img.png?width=1167&height=188&face=0_0_1167_188,https://scrap.kakaocdn.net/dn/A0Sa2/hyPN3lUKAx/xqHua28rz7inIEdke9zPmK/img.png?width=1167&height=188&face=0_0_1167_188,https://scrap.kakaocdn.net/dn/cKweWW/hyPN4rAJUA/cZ4zxLiRsKbADUMsVNtdpk/img.jpg?width=810&height=369&face=0_0_810_369)"></div><div class="og-text"><p class="og-title">내겐 너무 이쁜 Fusion Chart</p><p class="og-desc">들어가며..새로운 프로젝트를 들어가면서 처음 접해본 기술은 차트를 그릴 수 있는 Fusion Chart라는 스크립트 API였습니다. 프로젝트에서의 요구사항은 계획과 실적을 비교하여 볼 수 있도록 화면</p><p class="og-host">www.nextree.co.kr</p></div></a></div><p>fusion charts로 Django 에서 사용하기  <a href="https://carrido-hobbies-well-being.tistory.com/135" target="_blank" class="ke-link">https://carrido-hobbies-well-being.tistory.com/135</a></p><p> </p><p> </p><p>참고 : 데이터 시각화 툴 TOP 10 사용후기 모음 <br><a href="https://www.finereport.com/kr/10-data-visualization-tools-open-sourse-that-you-cannot-miss-in-2020/" target="_blank" class="ke-link">https://www.finereport.com/kr/10-data-visualization-tools-open-sourse-that-you-cannot-miss-in-2020/</a></p><p> </p><p> </p><p>A JavaScript <b>event calendar</b>. Customizable and open source.</p><p><a href="https://fullcalendar.io/" target="_top" class="ke-link">https://fullcalendar.io/</a>      </p><p> </p><p> </p><p><span data-ke-size="size16">화면 디자인(HTML, CSS, JS 템플릿을 위한 프레임워크)  </span></p><p><span data-ke-size="size16">     </span><a href="http://getbootstrap.com/" target="_top" class="ke-link">http://getbootstrap.com/</a>    </p><p>     <a href="https://getbootstrap.kr/" target="_top" class="ke-link">https://getbootstrap.kr/</a></p><p>웹 접근성 연구소</p><p>     <a href="https://www.wah.or.kr:444/" target="_top" class="ke-link">https://www.wah.or.kr:444/</a><a href="https://www.wah.or.kr:444/" target="_blank" class="ke-link"> </a></p><p> </p><p> </p><p> </p><p>-- spring project에서 참고용 --</p><div class="figure-img" data-ke-type="image" data-ke-style="alignLeft" data-ke-mobilestyle="widthOrigin"><img src="https://t1.daumcdn.net/cafeattach/ygGb/75632b466ae63222cd4180e324496e8735799d1e" class="txc-image" width="463" height="144" data-img-src="https://t1.daumcdn.net/cafeattach/ygGb/75632b466ae63222cd4180e324496e8735799d1e" data-origin-width="1023" data-origin-height="318"></div><div class="figure-file" data-ke-type="file" data-file-src="https://t1.daumcdn.net/cafeattach/ygGb/7291d31319d4191610465a3532628024ed3e677e?download" data-file-name="DB 내용.txt" data-file-size="911" data-mimetype="text/plain" data-ke-align="alignLeft"><a href="javascript:checkVirus('grpid%3DygGb%26fldid%3DQbpR%26dataid%3D65%26fileid%3D2%26regdt%3D20220916153114&url=https%3A%2F%2Ft1.daumcdn.net%2Fcafeattach%2FygGb%2F7291d31319d4191610465a3532628024ed3e677e')"><div class="image"></div><div class="desc"><div class="filename"><span class="name">DB 내용</span><span class="type">.txt</span></div><div class="size">911B</div></div></a></div><div class="figure-file" data-ke-type="file" data-file-src="https://t1.daumcdn.net/cafeattach/ygGb/baded034704321cec0e8ae7e04f5f2f92f79364a?download" data-file-name="그래프_Dynamic.zip" data-file-size="64634" data-mimetype="application/x-zip-compressed" data-ke-align="alignLeft"><a href="javascript:checkVirus('grpid%3DygGb%26fldid%3DQbpR%26dataid%3D65%26fileid%3D3%26regdt%3D20220916153114&url=https%3A%2F%2Ft1.daumcdn.net%2Fcafeattach%2FygGb%2Fbaded034704321cec0e8ae7e04f5f2f92f79364a')"><div class="image"></div><div class="desc"><div class="filename"><span class="name">그래프_Dynamic</span><span class="type">.zip</span></div><div class="size">63.12KB</div></div></a></div><div class="figure-file" data-ke-type="file" data-file-src="https://t1.daumcdn.net/cafeattach/ygGb/4eacaf503a1eb3202f0ae4f854e6f9d20a9a8543?download" data-file-name="그래프_Spring.zip" data-file-size="251494" data-mimetype="application/x-zip-compressed" data-ke-align="alignLeft"><a href="javascript:checkVirus('grpid%3DygGb%26fldid%3DQbpR%26dataid%3D65%26fileid%3D4%26regdt%3D20220916153114&url=https%3A%2F%2Ft1.daumcdn.net%2Fcafeattach%2FygGb%2F4eacaf503a1eb3202f0ae4f854e6f9d20a9a8543')"><div class="image"></div><div class="desc"><div class="filename"><span class="name">그래프_Spring</span><span class="type">.zip</span></div><div class="size">245.60KB</div></div></a></div><p> </p><p> </p>
<!-- -->
]]>
