svggenerated.xml

<svg style="overflow-x: hidden; overflow-y: hidden; position: relative; " height="105" version="1.1" width="266" xmlns="http://www.w3.org/2000/svg"><desc style="-webkit-tap-highlight-color: rgba(0, 0, 0, 0); ">Created with Raphaël 2.0.1</desc><defs style="-webkit-tap-highlight-color: rgba(0, 0, 0, 0); "><path style="-webkit-tap-highlight-color: rgba(0, 0, 0, 0); " fill="none" stroke="#000000" d="M59.71043843318451,70.28956156681551L59.71043843318451,70.28956156681551A42.01690497626037,42.01690497626037,0,0,1,0.28956156681550027,70.2895615668155" id="92DBA6EA-81B9-4460-A4FB-3CE1D229E6B1"></path></defs><text style="-webkit-tap-highlight-color: rgba(0, 0, 0, 0); text-anchor: middle; font: normal normal normal 10px/normal Arial; " x="0" y="0" text-anchor="middle" font="10px &quot;Arial&quot;" stroke="none" fill="#000000"><tspan style="-webkit-tap-highlight-color: rgba(0, 0, 0, 0); " dy="3.5">Your text here</tspan></text><text style="-webkit-tap-highlight-color: rgba(0, 0, 0, 0); text-anchor: middle; font: normal normal normal 10px/normal Arial; " x="0" y="0" text-anchor="middle" font="10px &quot;Arial&quot;" stroke="none" fill="#000000"><tspan style="-webkit-tap-highlight-color: rgba(0, 0, 0, 0); " dy="3.5">Your text here</tspan></text><path style="-webkit-tap-highlight-color: rgba(0, 0, 0, 0); " fill="none" stroke="#000000" d="M59.71043843318451,70.28956156681551L59.71043843318451,70.28956156681551A42.01690497626037,42.01690497626037,0,0,1,0.28956156681550027,70.2895615668155"></path><text style="-webkit-tap-highlight-color: rgba(0, 0, 0, 0); font: normal normal normal 10px/normal Arial; " font="10px &quot;Arial&quot;" stroke="none" fill="#000000"><textPath style="-webkit-tap-highlight-color: rgba(0, 0, 0, 0); " href="#92DBA6EA-81B9-4460-A4FB-3CE1D229E6B1">Your text here</textPath></text></svg>

the curvermaker

var flatWidth = text.getBBox().width;
                
				if(this.text.curve < 0) {
					/*curve = -1 * this.text.curve;
					
					curve = curve/10;
					a = curve * Math.PI;*/
					a = Math.PI/2;
					
					r = flatWidth / a;
					t1 = (Math.PI/2 + a/2);
					
					y1 = r * Math.cos(t1) + 100;
					x1 = r * Math.sin(t1) + 30;
					
					y2 = r * Math.cos(a + t1) + 100;
					x2 = r * Math.sin(a + t1) + 30;
					
					cx = 40;
					cy = 40;
					
					rotate = Math.PI/2;
					
					pathString = "M "+x1+" "+y1+" "+x1+","+y1+" A "+r+","+r+" 0 0 1 "+x2+","+y2;
					
					console.debug("pathstrang: " + pathString);
					p = this.canvas.path(pathString).attr("stroke", "#000000");
					this.canvas.textPath(pathString, this.text.string);
				}
				if(this.text.curve > 0) {
					//p = this.canvas.path("M0.378,92.722c0,0,179.5-207.5,387,0").attr("stroke", "none");
				}