Skip to content

Instantly share code, notes, and snippets.

@VisualMelon

VisualMelon/testing.cs

Last active September 20, 2017 17:05
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save VisualMelon/ab34de2faa64b9b46e686cf7bedcfc30 to your computer and use it in GitHub Desktop.
Save VisualMelon/ab34de2faa64b9b46e686cf7bedcfc30 to your computer and use it in GitHub Desktop.
Download ZIP
SVG Text Rendering Testing
Raw
testing.cs
var model = new PlotModel { Title = "SVG Text Rendering" };
model.Axes.Add(new LinearAxis { Position = AxisPosition.Left });
model.Axes.Add(new LinearAxis { Position = AxisPosition.Bottom });
model.Annotations.Add(new OxyPlot.Annotations.TextAnnotation()
{
    Text = "A",
    TextPosition = new DataPoint(10, 80),
    TextVerticalAlignment = VerticalAlignment.Bottom,
});
model.Annotations.Add(new OxyPlot.Annotations.TextAnnotation()
{
    Text = "A\r\nA",
    TextPosition = new DataPoint(20, 80),
    TextVerticalAlignment = VerticalAlignment.Bottom,
});
model.Annotations.Add(new OxyPlot.Annotations.TextAnnotation()
{
    Text = "A\r\nA\r\nA",
    TextPosition = new DataPoint(30, 80),
    TextVerticalAlignment = VerticalAlignment.Bottom,
});
model.Annotations.Add(new OxyPlot.Annotations.TextAnnotation()
{
    Text = "A\r\nA\r\nA\r\nA",
    TextPosition = new DataPoint(40, 80),
    TextVerticalAlignment = VerticalAlignment.Bottom,
});
model.Annotations.Add(new OxyPlot.Annotations.TextAnnotation()
{
    Text = "A\r\nA\r\nA\r\nA\r\nA",
    TextPosition = new DataPoint(50, 80),
    TextVerticalAlignment = VerticalAlignment.Bottom,
});
model.Annotations.Add(new OxyPlot.Annotations.TextAnnotation()
{
    Text = "A",
    TextPosition = new DataPoint(10, 70),
    TextVerticalAlignment = VerticalAlignment.Top,
});
model.Annotations.Add(new OxyPlot.Annotations.TextAnnotation()
{
    Text = "A\r\nA",
    TextPosition = new DataPoint(20, 70),
    TextVerticalAlignment = VerticalAlignment.Top,
});
model.Annotations.Add(new OxyPlot.Annotations.TextAnnotation()
{
    Text = "A\r\nA\r\nA",
    TextPosition = new DataPoint(30, 70),
    TextVerticalAlignment = VerticalAlignment.Top,
});
model.Annotations.Add(new OxyPlot.Annotations.TextAnnotation()
{
    Text = "A\r\nA\r\nA\r\nA",
    TextPosition = new DataPoint(40, 70),
    TextVerticalAlignment = VerticalAlignment.Top,
});
model.Annotations.Add(new OxyPlot.Annotations.TextAnnotation()
{
    Text = "A\r\nA\r\nA\r\nA\r\nA",
    TextPosition = new DataPoint(50, 70),
    TextVerticalAlignment = VerticalAlignment.Top,
});
model.Annotations.Add(new OxyPlot.Annotations.TextAnnotation()
{
    Text = "Hello1\r\nHello2\r\nHello3\r\nHello4",
    TextPosition = new DataPoint(80, 20),
    TextVerticalAlignment = VerticalAlignment.Middle,
});
model.Annotations.Add(new OxyPlot.Annotations.TextAnnotation()
{
    Text = "H\r\nHe\r\nHel\r\nHell\r\nHello",
    TextPosition = new DataPoint(80, 40),
    TextVerticalAlignment = VerticalAlignment.Middle,
});
model.Annotations.Add(new OxyPlot.Annotations.TextAnnotation()
{
    Text = "Hello1\r\nBottom\r\nHello3",
    TextPosition = new DataPoint(20, 40),
    TextRotation = -45,
    TextVerticalAlignment = VerticalAlignment.Bottom,
});
model.Annotations.Add(new OxyPlot.Annotations.TextAnnotation()
{
    Text = "Hello1\r\nMiddle\r\nHello3",
    TextPosition = new DataPoint(40, 40),
    TextRotation = -45,
    TextVerticalAlignment = VerticalAlignment.Middle,
});
model.Annotations.Add(new OxyPlot.Annotations.TextAnnotation()
{
    Text = "Hello1\r\nTop\r\nHello3",
    TextPosition = new DataPoint(60, 40),
    TextRotation = -45,
    TextVerticalAlignment = VerticalAlignment.Top,
});
model.Annotations.Add(new OxyPlot.Annotations.TextAnnotation()
{
    Text = "Hello1\r\nBottom\r\nHello3",
    TextPosition = new DataPoint(20, 20),
    TextRotation = 45,
    TextVerticalAlignment = VerticalAlignment.Bottom,
});
model.Annotations.Add(new OxyPlot.Annotations.TextAnnotation()
{
    Text = "Hello1\r\nMiddle\r\nHello3",
    TextPosition = new DataPoint(40, 20),
    TextRotation = 45,
    TextVerticalAlignment = VerticalAlignment.Middle,
});
model.Annotations.Add(new OxyPlot.Annotations.TextAnnotation()
{
    Text = "Hello1\r\nTop\r\nHello3",
    TextPosition = new DataPoint(60, 20),
    TextRotation = 45,
    TextVerticalAlignment = VerticalAlignment.Top,
});
OxyPlot.WindowsForms.PlotView plotView = new OxyPlot.WindowsForms.PlotView();
plotView.Model = model;
this.Controls.Add(plotView);
plotView.Invalidate();
plotView.Dock = DockStyle.Fill;
this.Refresh();
SvgExporter svgExporter = new SvgExporter();
using (var fs = System.IO.File.Open("test2.svg", System.IO.FileMode.Create))
{
    svgExporter.Export(model, fs);
}
svgExporter = new SvgExporter();
svgExporter.UseVerticalTextAlignmentWorkaround = true;
using (var fs = System.IO.File.Open("test3.svg", System.IO.FileMode.Create))
{
    svgExporter.Export(model, fs);
}
Display the source blob
Display the rendered blob
Raw
with.svg
<?xml version="1.0" encoding="utf-8" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg width="600" height="400" version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns="http://www.w3.org/2000/svg">
<polyline points="34.012,353.8536 30.012,353.8536" style="fill:none;stroke:black;stroke-width:1" />
<polyline points="34.012,336.7603 30.012,336.7603" style="fill:none;stroke:black;stroke-width:1" />
<polyline points="34.012,319.6669 30.012,319.6669" style="fill:none;stroke:black;stroke-width:1" />
<polyline points="34.012,285.4801 30.012,285.4801" style="fill:none;stroke:black;stroke-width:1" />
<polyline points="34.012,268.3868 30.012,268.3868" style="fill:none;stroke:black;stroke-width:1" />
<polyline points="34.012,251.2934 30.012,251.2934" style="fill:none;stroke:black;stroke-width:1" />
<polyline points="34.012,217.1066 30.012,217.1066" style="fill:none;stroke:black;stroke-width:1" />
<polyline points="34.012,200.0133 30.012,200.0133" style="fill:none;stroke:black;stroke-width:1" />
<polyline points="34.012,182.9199 30.012,182.9199" style="fill:none;stroke:black;stroke-width:1" />
<polyline points="34.012,148.7331 30.012,148.7331" style="fill:none;stroke:black;stroke-width:1" />
<polyline points="34.012,131.6398 30.012,131.6398" style="fill:none;stroke:black;stroke-width:1" />
<polyline points="34.012,114.5464 30.012,114.5464" style="fill:none;stroke:black;stroke-width:1" />
<polyline points="34.012,80.3596 30.012,80.3596" style="fill:none;stroke:black;stroke-width:1" />
<polyline points="34.012,63.2663 30.012,63.2663" style="fill:none;stroke:black;stroke-width:1" />
<polyline points="34.012,46.1729 30.012,46.1729" style="fill:none;stroke:black;stroke-width:1" />
<polyline points="61.9114,370.947 61.9114,374.947" style="fill:none;stroke:black;stroke-width:1" />
<polyline points="89.8108,370.947 89.8108,374.947" style="fill:none;stroke:black;stroke-width:1" />
<polyline points="117.7102,370.947 117.7102,374.947" style="fill:none;stroke:black;stroke-width:1" />
<polyline points="173.509,370.947 173.509,374.947" style="fill:none;stroke:black;stroke-width:1" />
<polyline points="201.4084,370.947 201.4084,374.947" style="fill:none;stroke:black;stroke-width:1" />
<polyline points="229.3078,370.947 229.3078,374.947" style="fill:none;stroke:black;stroke-width:1" />
<polyline points="285.1066,370.947 285.1066,374.947" style="fill:none;stroke:black;stroke-width:1" />
<polyline points="313.006,370.947 313.006,374.947" style="fill:none;stroke:black;stroke-width:1" />
<polyline points="340.9054,370.947 340.9054,374.947" style="fill:none;stroke:black;stroke-width:1" />
<polyline points="396.7042,370.947 396.7042,374.947" style="fill:none;stroke:black;stroke-width:1" />
<polyline points="424.6036,370.947 424.6036,374.947" style="fill:none;stroke:black;stroke-width:1" />
<polyline points="452.503,370.947 452.503,374.947" style="fill:none;stroke:black;stroke-width:1" />
<polyline points="508.3018,370.947 508.3018,374.947" style="fill:none;stroke:black;stroke-width:1" />
<polyline points="536.2012,370.947 536.2012,374.947" style="fill:none;stroke:black;stroke-width:1" />
<polyline points="564.1006,370.947 564.1006,374.947" style="fill:none;stroke:black;stroke-width:1" />
<text dominant-baseline="baseline" text-anchor="end" transform="translate(23.012,375.9735)" font-family="Segoe UI" font-size="12" font-weight="400" fill="black">0</text>
<text dominant-baseline="baseline" text-anchor="end" transform="translate(23.012,307.6)" font-family="Segoe UI" font-size="12" font-weight="400" fill="black">20</text>
<text dominant-baseline="baseline" text-anchor="end" transform="translate(23.012,239.2265)" font-family="Segoe UI" font-size="12" font-weight="400" fill="black">40</text>
<text dominant-baseline="baseline" text-anchor="end" transform="translate(23.012,170.853)" font-family="Segoe UI" font-size="12" font-weight="400" fill="black">60</text>
<text dominant-baseline="baseline" text-anchor="end" transform="translate(23.012,102.4795)" font-family="Segoe UI" font-size="12" font-weight="400" fill="black">80</text>
<text dominant-baseline="baseline" text-anchor="end" transform="translate(23.012,34.106)" font-family="Segoe UI" font-size="12" font-weight="400" fill="black">100</text>
<polyline points="34.012,370.947 27.012,370.947" style="fill:none;stroke:black;stroke-width:1" />
<polyline points="34.012,302.5735 27.012,302.5735" style="fill:none;stroke:black;stroke-width:1" />
<polyline points="34.012,234.2 27.012,234.2" style="fill:none;stroke:black;stroke-width:1" />
<polyline points="34.012,165.8265 27.012,165.8265" style="fill:none;stroke:black;stroke-width:1" />
<polyline points="34.012,97.453 27.012,97.453" style="fill:none;stroke:black;stroke-width:1" />
<polyline points="34.012,29.0795 27.012,29.0795" style="fill:none;stroke:black;stroke-width:1" />
<text dominant-baseline="baseline" text-anchor="middle" transform="translate(34.012,392)" font-family="Segoe UI" font-size="12" font-weight="400" fill="black">0</text>
<text dominant-baseline="baseline" text-anchor="middle" transform="translate(145.6096,392)" font-family="Segoe UI" font-size="12" font-weight="400" fill="black">20</text>
<text dominant-baseline="baseline" text-anchor="middle" transform="translate(257.2072,392)" font-family="Segoe UI" font-size="12" font-weight="400" fill="black">40</text>
<text dominant-baseline="baseline" text-anchor="middle" transform="translate(368.8048,392)" font-family="Segoe UI" font-size="12" font-weight="400" fill="black">60</text>
<text dominant-baseline="baseline" text-anchor="middle" transform="translate(480.4024,392)" font-family="Segoe UI" font-size="12" font-weight="400" fill="black">80</text>
<text dominant-baseline="baseline" text-anchor="middle" transform="translate(592,392)" font-family="Segoe UI" font-size="12" font-weight="400" fill="black">100</text>
<polyline points="34.012,370.947 34.012,377.947" style="fill:none;stroke:black;stroke-width:1" />
<polyline points="145.6096,370.947 145.6096,377.947" style="fill:none;stroke:black;stroke-width:1" />
<polyline points="257.2072,370.947 257.2072,377.947" style="fill:none;stroke:black;stroke-width:1" />
<polyline points="368.8048,370.947 368.8048,377.947" style="fill:none;stroke:black;stroke-width:1" />
<polyline points="480.4024,370.947 480.4024,377.947" style="fill:none;stroke:black;stroke-width:1" />
<polyline points="592,370.947 592,377.947" style="fill:none;stroke:black;stroke-width:1" />
<rect x="82.8138" y="83.4" width="13.994" height="18.053" style="fill:none;stroke:black;stroke-width:1" />
<text dominant-baseline="baseline" text-anchor="middle" transform="translate(89.8108,97.453)" font-family="Segoe UI" font-size="12" font-weight="400" fill="black">A</text>
<rect x="138.6126" y="73.347" width="13.994" height="28.106" style="fill:none;stroke:black;stroke-width:1" />
<text dominant-baseline="baseline" text-anchor="middle" transform="translate(145.6096,87.4)" font-family="Segoe UI" font-size="12" font-weight="400" fill="black">A</text>
<text dominant-baseline="baseline" text-anchor="middle" transform="translate(145.6096,97.453)" font-family="Segoe UI" font-size="12" font-weight="400" fill="black">A</text>
<rect x="194.4114" y="63.294" width="13.994" height="38.159" style="fill:none;stroke:black;stroke-width:1" />
<text dominant-baseline="baseline" text-anchor="middle" transform="translate(201.4084,77.347)" font-family="Segoe UI" font-size="12" font-weight="400" fill="black">A</text>
<text dominant-baseline="baseline" text-anchor="middle" transform="translate(201.4084,87.4)" font-family="Segoe UI" font-size="12" font-weight="400" fill="black">A</text>
<text dominant-baseline="baseline" text-anchor="middle" transform="translate(201.4084,97.453)" font-family="Segoe UI" font-size="12" font-weight="400" fill="black">A</text>
<rect x="250.2102" y="53.241" width="13.994" height="48.212" style="fill:none;stroke:black;stroke-width:1" />
<text dominant-baseline="baseline" text-anchor="middle" transform="translate(257.2072,67.294)" font-family="Segoe UI" font-size="12" font-weight="400" fill="black">A</text>
<text dominant-baseline="baseline" text-anchor="middle" transform="translate(257.2072,77.347)" font-family="Segoe UI" font-size="12" font-weight="400" fill="black">A</text>
<text dominant-baseline="baseline" text-anchor="middle" transform="translate(257.2072,87.4)" font-family="Segoe UI" font-size="12" font-weight="400" fill="black">A</text>
<text dominant-baseline="baseline" text-anchor="middle" transform="translate(257.2072,97.453)" font-family="Segoe UI" font-size="12" font-weight="400" fill="black">A</text>
<rect x="306.009" y="43.188" width="13.994" height="58.265" style="fill:none;stroke:black;stroke-width:1" />
<text dominant-baseline="baseline" text-anchor="middle" transform="translate(313.006,57.241)" font-family="Segoe UI" font-size="12" font-weight="400" fill="black">A</text>
<text dominant-baseline="baseline" text-anchor="middle" transform="translate(313.006,67.294)" font-family="Segoe UI" font-size="12" font-weight="400" fill="black">A</text>
<text dominant-baseline="baseline" text-anchor="middle" transform="translate(313.006,77.347)" font-family="Segoe UI" font-size="12" font-weight="400" fill="black">A</text>
<text dominant-baseline="baseline" text-anchor="middle" transform="translate(313.006,87.4)" font-family="Segoe UI" font-size="12" font-weight="400" fill="black">A</text>
<text dominant-baseline="baseline" text-anchor="middle" transform="translate(313.006,97.453)" font-family="Segoe UI" font-size="12" font-weight="400" fill="black">A</text>
<rect x="82.8138" y="127.6398" width="13.994" height="18.053" style="fill:none;stroke:black;stroke-width:1" />
<text dominant-baseline="baseline" text-anchor="middle" transform="translate(89.8108,141.6928)" font-family="Segoe UI" font-size="12" font-weight="400" fill="black">A</text>
<rect x="138.6126" y="127.6398" width="13.994" height="28.106" style="fill:none;stroke:black;stroke-width:1" />
<text dominant-baseline="baseline" text-anchor="middle" transform="translate(145.6096,141.6928)" font-family="Segoe UI" font-size="12" font-weight="400" fill="black">A</text>
<text dominant-baseline="baseline" text-anchor="middle" transform="translate(145.6096,151.7458)" font-family="Segoe UI" font-size="12" font-weight="400" fill="black">A</text>
<rect x="194.4114" y="127.6398" width="13.994" height="38.159" style="fill:none;stroke:black;stroke-width:1" />
<text dominant-baseline="baseline" text-anchor="middle" transform="translate(201.4084,141.6928)" font-family="Segoe UI" font-size="12" font-weight="400" fill="black">A</text>
<text dominant-baseline="baseline" text-anchor="middle" transform="translate(201.4084,151.7458)" font-family="Segoe UI" font-size="12" font-weight="400" fill="black">A</text>
<text dominant-baseline="baseline" text-anchor="middle" transform="translate(201.4084,161.7988)" font-family="Segoe UI" font-size="12" font-weight="400" fill="black">A</text>
<rect x="250.2102" y="127.6398" width="13.994" height="48.212" style="fill:none;stroke:black;stroke-width:1" />
<text dominant-baseline="baseline" text-anchor="middle" transform="translate(257.2072,141.6928)" font-family="Segoe UI" font-size="12" font-weight="400" fill="black">A</text>
<text dominant-baseline="baseline" text-anchor="middle" transform="translate(257.2072,151.7458)" font-family="Segoe UI" font-size="12" font-weight="400" fill="black">A</text>
<text dominant-baseline="baseline" text-anchor="middle" transform="translate(257.2072,161.7988)" font-family="Segoe UI" font-size="12" font-weight="400" fill="black">A</text>
<text dominant-baseline="baseline" text-anchor="middle" transform="translate(257.2072,171.8518)" font-family="Segoe UI" font-size="12" font-weight="400" fill="black">A</text>
<rect x="306.009" y="127.6398" width="13.994" height="58.265" style="fill:none;stroke:black;stroke-width:1" />
<text dominant-baseline="baseline" text-anchor="middle" transform="translate(313.006,141.6928)" font-family="Segoe UI" font-size="12" font-weight="400" fill="black">A</text>
<text dominant-baseline="baseline" text-anchor="middle" transform="translate(313.006,151.7458)" font-family="Segoe UI" font-size="12" font-weight="400" fill="black">A</text>
<text dominant-baseline="baseline" text-anchor="middle" transform="translate(313.006,161.7988)" font-family="Segoe UI" font-size="12" font-weight="400" fill="black">A</text>
<text dominant-baseline="baseline" text-anchor="middle" transform="translate(313.006,171.8518)" font-family="Segoe UI" font-size="12" font-weight="400" fill="black">A</text>
<text dominant-baseline="baseline" text-anchor="middle" transform="translate(313.006,181.9048)" font-family="Segoe UI" font-size="12" font-weight="400" fill="black">A</text>
<rect x="463.6494" y="278.4675" width="33.506" height="48.212" style="fill:none;stroke:black;stroke-width:1" />
<text dominant-baseline="baseline" text-anchor="middle" transform="translate(480.4024,292.5205)" font-family="Segoe UI" font-size="12" font-weight="400" fill="black">Hello1</text>
<text dominant-baseline="baseline" text-anchor="middle" transform="translate(480.4024,302.5735)" font-family="Segoe UI" font-size="12" font-weight="400" fill="black">Hello2</text>
<text dominant-baseline="baseline" text-anchor="middle" transform="translate(480.4024,312.6265)" font-family="Segoe UI" font-size="12" font-weight="400" fill="black">Hello3</text>
<text dominant-baseline="baseline" text-anchor="middle" transform="translate(480.4024,322.6795)" font-family="Segoe UI" font-size="12" font-weight="400" fill="black">Hello4</text>
<rect x="466.1514" y="205.0675" width="28.502" height="58.265" style="fill:none;stroke:black;stroke-width:1" />
<text dominant-baseline="baseline" text-anchor="middle" transform="translate(480.4024,219.1205)" font-family="Segoe UI" font-size="12" font-weight="400" fill="black">H</text>
<text dominant-baseline="baseline" text-anchor="middle" transform="translate(480.4024,229.1735)" font-family="Segoe UI" font-size="12" font-weight="400" fill="black">He</text>
<text dominant-baseline="baseline" text-anchor="middle" transform="translate(480.4024,239.2265)" font-family="Segoe UI" font-size="12" font-weight="400" fill="black">Hel</text>
<text dominant-baseline="baseline" text-anchor="middle" transform="translate(480.4024,249.2795)" font-family="Segoe UI" font-size="12" font-weight="400" fill="black">Hell</text>
<text dominant-baseline="baseline" text-anchor="middle" transform="translate(480.4024,259.3325)" font-family="Segoe UI" font-size="12" font-weight="400" fill="black">Hello</text>
<polygon points="108.5561,222.9453 134.3549,197.1465 161.3374,224.129 135.5386,249.9278" style="fill:none;stroke:black;stroke-width:1" />
<text dominant-baseline="baseline" text-anchor="middle" transform="translate(131.3925,219.9829) rotate(-45)" font-family="Segoe UI" font-size="12" font-weight="400" fill="black">Hello1</text>
<text dominant-baseline="baseline" text-anchor="middle" transform="translate(138.5011,227.0915) rotate(-45)" font-family="Segoe UI" font-size="12" font-weight="400" fill="black">Bottom</text>
<text dominant-baseline="baseline" text-anchor="middle" transform="translate(145.6096,234.2) rotate(-45)" font-family="Segoe UI" font-size="12" font-weight="400" fill="black">Hello3</text>
<polygon points="231.5166,232.9081 255.9153,208.5094 282.8978,235.4919 258.4991,259.8906" style="fill:none;stroke:black;stroke-width:1" />
<text dominant-baseline="baseline" text-anchor="middle" transform="translate(253.6529,230.6457) rotate(-45)" font-family="Segoe UI" font-size="12" font-weight="400" fill="black">Hello1</text>
<text dominant-baseline="baseline" text-anchor="middle" transform="translate(260.7615,237.7543) rotate(-45)" font-family="Segoe UI" font-size="12" font-weight="400" fill="black">Middle</text>
<text dominant-baseline="baseline" text-anchor="middle" transform="translate(267.87,244.8628) rotate(-45)" font-family="Segoe UI" font-size="12" font-weight="400" fill="black">Hello3</text>
<polygon points="354.1302,243.2177 377.8225,219.5254 404.805,246.5079 381.1127,270.2002" style="fill:none;stroke:black;stroke-width:1" />
<text dominant-baseline="baseline" text-anchor="middle" transform="translate(375.9133,241.3085) rotate(-45)" font-family="Segoe UI" font-size="12" font-weight="400" fill="black">Hello1</text>
<text dominant-baseline="baseline" text-anchor="middle" transform="translate(383.0219,248.4171) rotate(-45)" font-family="Segoe UI" font-size="12" font-weight="400" fill="black">Top</text>
<text dominant-baseline="baseline" text-anchor="middle" transform="translate(390.1304,255.5256) rotate(-45)" font-family="Segoe UI" font-size="12" font-weight="400" fill="black">Hello3</text>
<polygon points="156.8643,265.52 182.6631,291.3188 155.6806,318.3013 129.8818,292.5025" style="fill:none;stroke:black;stroke-width:1" />
<text dominant-baseline="baseline" text-anchor="middle" transform="translate(159.8267,288.3564) rotate(45)" font-family="Segoe UI" font-size="12" font-weight="400" fill="black">Hello1</text>
<text dominant-baseline="baseline" text-anchor="middle" transform="translate(152.7181,295.465) rotate(45)" font-family="Segoe UI" font-size="12" font-weight="400" fill="black">Bottom</text>
<text dominant-baseline="baseline" text-anchor="middle" transform="translate(145.6096,302.5735) rotate(45)" font-family="Segoe UI" font-size="12" font-weight="400" fill="black">Hello3</text>
<polygon points="258.4991,276.8829 282.8978,301.2816 255.9153,328.2641 231.5166,303.8654" style="fill:none;stroke:black;stroke-width:1" />
<text dominant-baseline="baseline" text-anchor="middle" transform="translate(260.7615,299.0192) rotate(45)" font-family="Segoe UI" font-size="12" font-weight="400" fill="black">Hello1</text>
<text dominant-baseline="baseline" text-anchor="middle" transform="translate(253.6529,306.1278) rotate(45)" font-family="Segoe UI" font-size="12" font-weight="400" fill="black">Middle</text>
<text dominant-baseline="baseline" text-anchor="middle" transform="translate(246.5444,313.2363) rotate(45)" font-family="Segoe UI" font-size="12" font-weight="400" fill="black">Hello3</text>
<polygon points="359.7871,287.8989 383.4794,311.5912 356.4969,338.5737 332.8046,314.8814" style="fill:none;stroke:black;stroke-width:1" />
<text dominant-baseline="baseline" text-anchor="middle" transform="translate(361.6963,309.682) rotate(45)" font-family="Segoe UI" font-size="12" font-weight="400" fill="black">Hello1</text>
<text dominant-baseline="baseline" text-anchor="middle" transform="translate(354.5877,316.7906) rotate(45)" font-family="Segoe UI" font-size="12" font-weight="400" fill="black">Top</text>
<text dominant-baseline="baseline" text-anchor="middle" transform="translate(347.4792,323.8991) rotate(45)" font-family="Segoe UI" font-size="12" font-weight="400" fill="black">Hello3</text>
<text dominant-baseline="baseline" text-anchor="middle" transform="translate(313.006,23.0795)" font-family="Segoe UI" font-size="18" font-weight="700" fill="black">SVG Text Rendering</text>
<polygon points="34.012,29.0795 592,29.0795 592,370.947 34.012,370.947" style="fill:none;stroke:black;stroke-width:1" />
</svg>
Display the source blob
Display the rendered blob
Raw
without.svg
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment