File talk:US Natural Gas Production.svg

From Wikimedia Commons, the free media repository
Jump to navigation Jump to search

SVG Chart

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="-22.8,-79.2,200.4,100.8"      
  width="750" height="380"
  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="-22.8" y="-79.2" width="200.4" height="100.8" stroke-width="0.12" 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.
  ----------------&#13;   Source:         Energy Information Administration
  Available from: http://tonto.eia.gov/dnav/ng/hist/n9050us2a.htm
  1 MMcf = 28 317 m3, 0.353147 MMcf = 10 000 m3, 0.706293 MMcf = 20 000 m3
  2011: 24 036 352 MMcf = 680 633 692 215 m3
</desc>

<style id="styles" type="text/css"> <![CDATA[
  .graphgeneral {         /*-- general look of graphs and markers, e.g. in legend --*/
    stroke-width:    0.84;
    fill:            none;
    stroke-linejoin: round;
    stroke-linecap:  round;
  }
  .graphgeneralstretch {  /*-- general look of graphs and markers on a stretched chart --*/ 
    stroke-width:    0.34;
    fill:            none;
    stroke-linejoin: round;
    stroke-linecap:  round;
  } 
.graph1lineblank { /*-- look of graph 1 --*/ stroke: rgb(00%, 00%, 60%); } .graph1line { stroke: rgb(00%, 00%, 60%); }
.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.42; stroke-linecap: round; } .titletext { font-size: 7.92px; } .axistext-x { font-size: 7.2px; } .axistext-x-number { font-size: 7.2px; } .axistext-y { font-size: 7.2px; } .axismark-main { stroke: black; stroke-width: 0.29; } .axismark-second { stroke: black; stroke-width: 0.29; }   .legendtext { font-size: 7.2px; text-anchor: start; } ]]></style> <defs> <!--== axis dashes definitions ==--> <!-- x-axis mark, modify "height" --> <pattern id="x-axismark-main" x="0" width="10" height="2.4" patternUnits="userSpaceOnUse"> <line x1="0" y1="-1" x2="0" y2="2.4" class="axismark-main"/> </pattern> <!-- y-axis mark, modify "width" --> <pattern id="y-axismark-main" width="2.4" height="10" patternUnits="userSpaceOnUse"> <line x1="-1" y1="0" x2="2.4" y2="0" class="axismark-main"/> </pattern> <!-- y-axis2 mark, modify "width" --> <pattern id="y-axis2mark-main" width="1.2" height="10" patternUnits="userSpaceOnUse"> <line x1="-1" y1="0" x2="11" y2="0" class="axismark-main"/> </pattern> </defs> <g transform="scale(1, -1)"> <!-- x axis, modify "x2" and "width" --> <rect id="x-axismark" x="-0.6" y="-2.1" width="122.4" height="2.1" fill="url(#x-axismark-main)"/> <line id="x-axis" x1="0" y1="0" x2="120" y2="0" class="axisline"/> <!-- y axis, modify "height" --> <rect id="y-axismark" x="-2.1" y="-0.6" width="2.1" height="76" fill="url(#y-axismark-main)"/> <line id="y-axis" x1="0" y1="0" x2="0" y2="75" class="axisline"/> </g> <!-- x axis text, modify each value --> <g id="axistext-x" class="axistext-x-number" transform="translate(0, 9.4)" text-anchor="middle"> <text id="title-x" class="axistext-x" x="60" y="9.4" >Year</text> </g> <!-- y axis text, modify each value --> <g id="axistext-y" class="axistext-y" text-anchor="end" transform="translate(-3.6, 1.8)">   <text y=  "-0">0</text>   <text y="-12.5">5</text>   <text y= "-25">10</text>   <text y="-37.5">15</text>   <text y= "-50">20</text>   <text y="-62.5">25</text>   <text y= "-75">30</text>   <text y="-87.5">35</text>   <text y="-100">40</text>   <text y="-112.5">45</text>   <text y="-125">50</text> <text id="title-y" x="37.5" y="-13.1" transform="rotate(-90)" text-anchor="middle" >Trillion cubic feet per year</text> </g>
<!-- legend --> <g id="legend" class="legendtext" transform="translate(126, -67.5)">
<g id="legend-background" class="axismark-main"> <rect x="0" y="0" fill="white" width="48" height="19.4"/> </g>
  <g class="graphgeneral"><g class="graph1line"> <polyline id="legend-line1" points="2.4 5.54 8.4 5.54" marker-start="none" marker-end="none"/> </g></g> <text id="legend-text1" x="10.8" y="7.68">1st W </text>
  <g class="graphgeneral"><g class="graph2line"> <polyline id="legend-line2" points="2.4 13.46 8.4 13.46" marker-start="none" marker-end="none"/> </g></g> <text id="legend-text2" x="10.8" y="15.6">2nd W </text> </g> <!--====== graph data with origin values, you can manually copy or attach the values here ======--> <!-- modify displacement "translate" --> <defs> <g id="graphs">
<!-- graph 2 -->
<polyline id="graph2" points=" 25 40 40 10 55 35 70 10 85 40 "/> </g> <g id="graph1"> <!-- graph 1 --> <polyline id="graph1-line" stroke-width="0.34" points=" 15 40 30 10 45 35 60 10 75 40 "/> </g> </defs> <g class="graphgeneralstretch" transform="scale(1, -2.5) translate(-1900, -0)">
  <!-- graph 2 --> <use id="graphuse2p2" transform="translate(0.247, 0)" class="graph2lineblank" xlink:href="#graph2"/> <use id="graphuse2m2" transform="translate(-0.247, 0)" class="graph2lineblank" xlink:href="#graph2"/> <use id="graphuse2p3" transform="translate(-0.081, 0)" class="graph2lineblank" xlink:href="#graph2"/> <use id="graphuse2m3" transform="translate(0.081, 0)" class="graph2lineblank" xlink:href="#graph2"/> <use id="graphuse2-1" transform="translate(0, 0)" class="graph2line" xlink:href="#graph2"/>
  <!-- graph 1 --> <use id="graphuse1p2" transform="translate(0.247, 0)" class="graph1lineblank" xlink:href="#graph1"/> <use id="graphuse1m2" transform="translate(-0.247, 0)" class="graph1lineblank" xlink:href="#graph1"/> <use id="graphuse1p3" transform="translate(-0.081, 0)" class="graph1lineblank" xlink:href="#graph1"/> <use id="graphuse1m3" transform="translate(0.081, 0)" class="graph1lineblank" xlink:href="#graph1"/> <use id="graphuse1-1" transform="translate(0, 0)" class="graph1line" xlink:href="#graph1"/> </g> </svg>


Erroneous left scale[edit]

Hi,

I'm not sure where I should edit the SVG file, but the left scale seems to be twice its expected value. The EIA gives about 25 MMcf but the plot shows 50. The right scale is ok. --Factsory (talk) 11:40, 29 September 2013 (UTC)[reply]

You are right. I have changed and uploaded the new file. -- Con-struct (talk) 21:01, 30 September 2013 (UTC)[reply]