Jump to content

File:20221002 SVG Pie chart creation using circle stroke-dasharray attribute.svg

Page contents not supported in other languages.
This is a file from the Wikimedia Commons
From Wikipedia, the free encyclopedia

Original file (SVG file, nominally 1,200 × 740 pixels, file size: 2 KB)

Summary

Description
English: Graphical demonstration of SVG pie chart creation using circle stroke-dasharray attribute
  • Wedges of pie chart are created using circles having SVG strokes of width twice that of the circle's radius, and using SVG's stroke-dasharray attribute to determine the circumferential extent of each wedge. The rotate(n) attribute determines the "starting angle" of the wedge.
  • Credit for general idea: https://sparkbox.com/foundry/how_to_code_an_SVG_pie_chart
* Related YouTube video from Sparkbox source: https://www.youtube.com/watch?v=XEUCs7Sh8FI
  • It turns out that libsvg doesn't render this file's use of stroke-dasharray correctly
See the talk page discussion, "Incorrect rendering of SVG circles using stroke-dasharray attribute (vs. "Arc" specification)" here.
Date
Source Own work
Author RCraig09

Licensing

I, the copyright holder of this work, hereby publish it under the following license:
w:en:Creative Commons
attribution share alike
This file is licensed under the Creative Commons Attribution-Share Alike 4.0 International license.
You are free:
  • to share – to copy, distribute and transmit the work
  • to remix – to adapt the work
Under the following conditions:
  • attribution – You must give appropriate credit, provide a link to the license, and indicate if changes were made. You may do so in any reasonable manner, but not in any way that suggests the licensor endorses you or your use.
  • share alike – If you remix, transform, or build upon the material, you must distribute your contributions under the same or compatible license as the original.

Captions

Graphical demonstration of SVG pie chart creation using circle stroke-dasharray attribute

Items portrayed in this file

depicts

inception

2 October 2022

media type

image/svg+xml

checksum

b9103c45daa1f3d7223bf1b6db988f83bbb338ce

determination method or standard: SHA-1

data size

1,803 byte

height

740 pixel

width

1,200 pixel

File history

Click on a date/time to view the file as it appeared at that time.

Date/TimeThumbnailDimensionsUserComment
current04:03, 9 October 2022Thumbnail for version as of 04:03, 9 October 20221,200 × 740 (2 KB)RCraig09Version 4: re-arranging . . . . adding colored background to make anomalies more evident
03:57, 3 October 2022Thumbnail for version as of 03:57, 3 October 20221,200 × 740 (2 KB)RCraig09Version 3: removing the spaces that were in "stroke-dasharray="157.0796326794897, 10000" to see if it correct rendering errors
03:49, 3 October 2022Thumbnail for version as of 03:49, 3 October 20221,200 × 740 (2 KB)RCraig09Version 2: removes leftover "-->" characters from near end of file.
03:08, 3 October 2022Thumbnail for version as of 03:08, 3 October 20221,200 × 740 (2 KB)RCraig09Uploaded own work with UploadWizard

The following page uses this file:

Metadata

This file contains additional information, probably added from the digital camera or scanner used to create or digitize it.

If the file has been modified from its original state, some details may not fully reflect the modified file.

Retrieved from "https://en.wikipedia.org/wiki/File:20221002_SVG_Pie_chart_creation_using_circle_stroke-dasharray_attribute.svg"