CSS에서 원형 차트를 만드는 방법

아래 그림과 같이 원형 차트를 CSS로 만들려면 어떻게해야합니까?CSS에서 원형 차트를 만드는 방법

enter image description here

2012-04-05 Rohit Azad

참고 : 원 차트는 ** 원형 차트 ** : o) – balexandre

이라고합니다. 1. http://www.htmldrive.net/items/show/751/Pure-CSS3-Pie-Charts-effect 2. http://atomicnoggin.ca/blog/2010/02/20/pure-css3-pie-charts/ 3. http://elisabethrobson.com/?p=867 (** HTML5 캔버스 사용 **) 4 . HTML5와 jQuery도 사용할 수 있습니다. [LINK] (http://www.elated.com/articles/snazzy-animated-pie-chart-html5-jquery/) –

오 마이! Google Chart Tools를 보셨습니까?

https://google-developers.appspot.com/chart/interactive/docs/gallery/piechart

이 쉽게 구현할 수 바보이지만, 내 문제는 "외부 API를"부분입니다. google이 결정할 수 있다면 google이 내려갑니다, bye bye chart! 그러나 아름다움과 다른 차트의 선택까지, Google 차트는 멋진 광고입니다.

출처

2013-02-27 21:13:02 Savanetech

google.visualization API를 다운로드 할 수 있다고 생각합니다. [Google 시각화 API 참조] (https://developers.google.com/chart/interactive/docs/reference) 페이지에서 서비스 약관에 따라 google.load 또는 google을 다운로드하고 저장하거나 호스팅 할 수 없습니다. 시각화 코드. –

는 지금까지 내가 알고 있어요 이것은 CSS3와 함께 더 (아직) 할 수 없습니다. 그러나 새로운 html5 canvas 요소는 원하는 모든 것을 제공합니다. 자바 스크립트를 통해 쉽게 액세스하고 사용할 수 있습니다. 기본 사용법에 대한 작은 자습서는 here에서 찾을 수 있습니다.

stackoverflow에 대한 다른 질문조차도 동일한 주제에있었습니다. "HTML5 Canvas pie chart"을 참조하십시오. (캔버스 요소를 사용하는 원형 차트에 대한 자습서의 첫 번째 대답은 "Graphing Data in the HTML5 Canvas Element Part IV Simple Pie Charts"입니다.)

출처

2012-04-05 12:11:50 s1lence

순수 파이어 CSS를 사용하거나 자바 스크립트를 사용하여 이러한 파이를 만드는 방법을 찾고있었습니다. 오늘 나는 그녀가 완전히 주제를 못 박는 talk from Lea Verou을 가리키는 SmashingMagazine에 관한 기사를 발견했다. 정말 정말 가치있는 시계입니다!

출처

2015-10-29 20:05:40 rafaelbiten

CSS에서 원형 차트를 만드는 방법

답변

관련 문제