File talk:Eritrea population.svg
Add topic
Source
[edit]
Mark and copy the following text. Paste it into a plain text file. The text file should have an svg extension, for example mychart.svg.
You can check the result with Toolforge tool SVGCheck (upload file temporarily), in W3Schools Tryit Editor (insert source code) or in Commons with File:Test.svg (upload as new file revision).
<?xml version="1.0" encoding="UTF-8" ?>
<!-- Generator: wikimedia.svg.chart, 2013-08-28 -->
<!-- modify viewBox (x,y,dx,dy) for position (x,y) and size (dx,dy) -->
<svg id="head"
xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
version="1.1"
viewBox="-15.6465,-58.6,121.3465,72.5"
width="750" height="450"
font-family="Helvetica, Arial, Liberation Sans"
>
<!-- also a workaround for librsvg: a <rect> must be placed somewhere before text for a good display of text -->
<rect id="imagebackground" x="-15.647" y="-58.6" width="121.35" height="72.5" stroke-width="0.1" stroke="none" fill="white"/>
<title>plain text svg graphic</title>
<desc>
This svg graphic is to edit with an text editor.
Please do not overwrite this file by saving with an image editor.
---------------- All values are scaled by 1000. This is necessary to keep the lines from turning into ribbons.
</desc>
<style id="styles" type="text/css"> <![CDATA[
.graphgeneral { /*-- general look of graphs and markers, e.g. in legend --*/
stroke-width: 0.29;
fill: none;
stroke-linejoin: round;
stroke-linecap: round;
}
.graphgeneralstretch { /*-- general look of graphs and markers on a stretched chart --*/
stroke-width: 0.18;
fill: none;
stroke-linejoin: round;
stroke-linecap: round;
}
.graph1lineblank { /*-- look of graph 1 --*/
stroke: #FF00FF;
}
.graph1line {
stroke: #FF00FF;
marker-start:url("#graph1markerstretch"); marker-mid:url("#graph1markerstretch"); marker-end:url("#graph1markerstretch");
}
.graph1marker { /*-- look of marker 1 --*/
stroke: #FF00FF;
fill: #FF00FF;
}
.graph2lineblank { /*-- look of graph 2 --*/
stroke: rgb(75%, 10%, 10%);
}
.graph2line {
stroke: rgb(75%, 10%, 10%);
}
.graph3lineblank { /*-- look of graph 3 --*/
stroke: rgb(00%, 60%, 00%);
}
.graph3line {
stroke: rgb(00%, 60%, 00%);
}
.graph4lineblank { /*-- look of graph 4 --*/
stroke: rgb(00%, 60%, 60%);
}
.graph4line {
stroke: rgb(00%, 60%, 60%);
}
.graph5lineblank { /*-- look of graph 5 --*/
stroke: rgb(60%, 00%, 60%);
}
.graph5line {
stroke: rgb(60%, 00%, 60%);
}
.graph6lineblank { /*-- look of graph 6 --*/
stroke: rgb(60%, 60%, 00%);
}
.graph6line {
stroke: rgb(60%, 60%, 00%);
}
.graph7lineblank { /*-- look of graph 7 --*/
stroke: rgb(00%, 00%, 30%);
}
.graph7line {
stroke: rgb(00%, 00%, 30%);
}
.graph8lineblank { /*-- look of graph 8 --*/
stroke: rgb(00%, 30%, 00%);
}
.graph8line {
stroke: rgb(00%, 30%, 00%);
}
.axisline {
stroke: black;
stroke-width: 0.36;
stroke-linecap: round;
}
.titletext {
font-size: 5.079px;
}
.axistext-x {
font-size: 4.617px;
}
.axistext-x-number {
font-size: 4.617px;
}
.axistext-y {
font-size: 4.617px;
}
.axismark-main {
stroke: black;
stroke-width: 0.25;
}
.axismark-second {
stroke: black;
stroke-width: 0.25;
}
.graphmarker {
stroke-width: 0.36;
fill: white;
stroke-linejoin: round;
}
.gridline {
stroke: black;
stroke-width: 0.18;
}
]]></style>
<defs>
<!--== axis dashes definitions ==-->
<!-- x-axis mark, modify "height" -->
<pattern id="x-axismark-main" x="0" width="18" height="2" patternUnits="userSpaceOnUse">
<line x1="0" y1="-1" x2="0" y2="2" class="axismark-main"/>
</pattern>
<!-- x-axis 2nd mark, modify "width" and "x1"-->
<pattern id="x-axismark-second" x="0" width="1.8" height="2" patternUnits="userSpaceOnUse">
<line x1="0" y1="-1" x2="0" y2="2" class="axismark-second"/>
</pattern>
<!-- y-axis 2nd mark, modify "height" and "y1" -->
<pattern id="y-axismark-second" y="0" height="5.5" width="2" patternUnits="userSpaceOnUse">
<line y1="0" x1="-1" y2="0" x2="2" class="axismark-second"/>
</pattern>
<!-- x-axis gridline vertical, modify "width" -->
<pattern id="x-gridline" height="100" width="18" patternUnits="userSpaceOnUse">
<line x1="0" x2="0" y1="0" y2="100" class="gridline"/>
</pattern>
<!-- y-axis gridline horizontal, modify "height" -->
<pattern id="y-gridline" width="114" height="11" patternUnits="userSpaceOnUse">
<line x1="0" x2="114" y1="0" y2="0" class="gridline"/>
</pattern>
<!-- y-axis mark, modify "width" -->
<pattern id="y-axismark-main" width="2" height="11" patternUnits="userSpaceOnUse">
<line x1="-1" y1="0" x2="2" y2="0" class="axismark-main"/>
</pattern>
<!-- y-axis2 mark, modify "width" -->
<pattern id="y-axis2mark-main" width="1" height="10" patternUnits="userSpaceOnUse">
<line x1="-1" y1="0" x2="11" y2="0" class="axismark-main"/>
</pattern>
<!--== graph marker ==-->
<g class="graphmarker">
<g id="graph1markershape" transform="translate(0.86,0.86)"><rect x="-0.431" y="-0.431" width="0.862" height="0.862" fill="x"/></g> <!-- regular square -->
<marker id="graph1marker" class="graph1marker" refX="0.86" refY="0.86" viewBox="0 0 1.72 1.72" markerUnits="userSpaceOnUse" markerWidth="1.72" markerHeight="1.72">
<use xlink:href="#graph1markershape"/>
</marker>
<marker id="graph1markerstretch" class="graph1marker" refX="0.527" refY="0.86" viewBox="0 0 1.72 1.72" markerUnits="userSpaceOnUse" markerWidth="1.72" markerHeight="1.72">
<use transform="scale(0.611, 1)" xlink:href="#graph1markershape"/>
</marker>
</g>
</defs>
<g transform="scale(1, -1)">
<rect id="x-gridline-area" x="0.3" y="0" width="104.7" height="55" fill="url("#x-gridline")"/>
<rect id="y-gridline-area" x="0" y="0.3" width="102.6" height="56.1" fill="url("#y-gridline")"/>
<!-- x axis, modify "x2" and "width" -->
<rect id="x-axismark2" x="-0.5" y="-1" width="102.6" height="0.95" fill="url("#x-axismark-second")"/>
<rect id="x-axismark" x="-0.5" y="-1.8" width="104.7" height="1.75" fill="url("#x-axismark-main")"/>
<line id="x-axis" x1="0" y1="0" x2="103" y2="0" class="axisline"/>
<!-- y axis, modify "height" -->
<rect id="y-axismark2" x="-0.95" y="-0.5" width="0.95" height="56" fill="url("#y-axismark-second")"/>
<rect id="y-axismark" x="-1.75" y="-0.5" width="1.75" height="56" fill="url("#y-axismark-main")"/>
<line id="y-axis" x1="0" y1="0" x2="0" y2="55" class="axisline"/>
</g>
<!-- x axis text, modify each value -->
<g id="axistext-x" class="axistext-x-number" transform="translate(0, 6)" text-anchor="middle">
<text x= "0"> <tspan dy="-0.207px"/>1960</text>
<text x= "18"> <tspan dy="-0.207px"/>1970</text>
<text x= "36"> <tspan dy="-0.207px"/>1980</text>
<text x= "54"> <tspan dy="-0.207px"/>1990</text>
<text x= "72"> <tspan dy="-0.207px"/>2000</text>
<text x= "90"> <tspan dy="-0.207px"/>2010</text>
<text id="title-x" class="axistext-x" x="51.3" y="6" > <tspan dy="-0.207px"/></text>
</g>
<!-- y axis text, modify each value -->
<g id="axistext-y" class="axistext-y" text-anchor="end" transform="translate(-3.1, 1.5)">
<text y= "-0"> <tspan dy="-0.207px"/>1000</text>
<text y= "-11"> <tspan dy="-0.207px"/>2000</text>
<text y= "-22"> <tspan dy="-0.207px"/>3000</text>
<text y= "-33"> <tspan dy="-0.207px"/>4000</text>
<text y= "-44"> <tspan dy="-0.207px"/>5000</text>
<text y= "-55"> <tspan dy="-0.207px"/>6000</text>
<text id="title-y" x="27.5" y="-8.4" transform="rotate(-90)" text-anchor="middle" > <tspan dy="-0.207px"/></text>
</g>
<!--====== graph data with origin values, you can manually copy or attach the values here ======-->
<!-- modify displacement "translate" -->
<defs>
<g id="graphs">
</g>
<g id="graph1">
<!-- graph 1 -->
<polyline id="graph1-line" stroke-width="0.18" points="
1960 13.97491
1961 14.32640
1962 14.69645
1963 15.08273
1964 15.48187
1965 15.89179
1966 16.31147
1967 16.74204
1968 17.18525
1969 17.64343
1970 18.11878
1971 18.61199
1972 19.12302
1973 19.65160
1974 20.19717
1975 20.75965
1976 21.33723
1977 21.93068
1978 22.54450
1979 23.18495
1980 23.85540
1981 24.54766
1982 25.25521
1983 25.98410
1984 26.74289
1985 27.53151
1986 28.37111
1987 29.24349
1988 30.06361
1989 30.71771
1990 31.13311
1991 31.27297
1992 31.18582
1993 30.99047
1994 30.85443
1995 30.90159
1996 31.16379
1997 31.61350
1998 32.24223
1999 33.02263
2000 33.92801
2001 34.97124
2002 36.14639
2003 37.38265
2004 38.58623
2005 39.69007
2006 40.66648
2007 41.53332
2008 42.32636
2009 43.10334
2010 43.90840
2011 44.74690
2012 45.60977
2013 46.50998
2014 47.46045
2015 48.46976
2016 49.54645
2017 50.68831
"/>
</g>
</defs>
<g class="graphgeneralstretch" transform="scale(1.8, -1.1) translate(-1960, -10)">
<!-- graph 1 -->
<use id="graphuse1p2" transform="translate(0, 0.055)" class="graph1lineblank" xlink:href="#graph1"/>
<use id="graphuse1m2" transform="translate(0, -0.055)" class="graph1lineblank" xlink:href="#graph1"/>
<use id="graphuse1-1" transform="translate(0, 0)" class="graph1line" xlink:href="#graph1"/>
</g>
</svg>
