evert/svgcanvas
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fixes #4 angle diff should be positive by adding 2PI instead of Math.abs

Browse Source
This commit is contained in:
kerryliu 2014-04-03 20:23:23 -07:00
parent 84ace43af5
commit 20cb914014
3 changed files with 70 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
.gitignore vendored Normal file
View File

@ -0,0 +1 @@
.idea/

17
canvas2svg.js
View File

@ -1,5 +1,5 @@
/*!!
* Canvas 2 Svg v1.0.2
* Canvas 2 Svg v1.0.3
* A low level canvas to SVG converter. Uses a mock canvas context to build an SVG document.
*
* Licensed under the MIT license:
@ -190,7 +190,7 @@
/**
* The mock canvas context
* @param options - options include:
* @param o - options include:
* width - width of your canvas (defaults to 500)
* height - height of your canvas (defaults to 500)
* enableMirroring - enables canvas mirroring (get image data) (defaults to false)
@ -799,11 +799,18 @@
startX = x+radius*Math.cos(startAngle),
startY = y+radius*Math.sin(startAngle),
sweepFlag = counterClockwise ? 0 : 1,
largeArcFlag;
largeArcFlag = 0,
diff = endAngle - startAngle;
// https://github.com/gliffy/canvas2svg/issues/4
if(diff < 0) {
diff += 2*Math.PI;
}
if(counterClockwise) {
largeArcFlag = Math.abs(endAngle - startAngle) > Math.PI ? 0 : 1;
largeArcFlag = diff > Math.PI ? 0 : 1;
} else {
largeArcFlag = Math.abs(endAngle - startAngle) > Math.PI ? 1 : 0;
largeArcFlag = diff > Math.PI ? 1 : 0;
}
this.moveTo(startX, startY);

57
jasmine-tests/canvassvg.html Normal file
View File

@ -0,0 +1,57 @@
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Canvas2Svg</title>
<script type="text/javascript" src="../canvas2svg.js"></script>
<style type="text/css">
canvas {
float:left;
}
#svg {
width: 500px;
height: 500px;
float: left;
}
textarea {
width:500px;
height:100px;
}
</style>
</head>
<body>
<div id="container">
<canvas id="canvas" width="500" height="500"></canvas>
<div id="svg">
</div>
<textarea id="textarea">
</textarea>
<a href="#" id="render">Render</a>
</div>
<script type="text/javascript">
(function() {
"use strict";
document.getElementById("render").addEventListener("click", function(event){
event.preventDefault();
var ctx = document.getElementById("canvas").getContext("2d");
ctx.clearRect(0,0,500,500);
var c2s = new C2S(500,500);
var text = document.getElementById("textarea").value;
var drawFunction = new Function("ctx", text);
var svg = document.getElementById("svg");
drawFunction(ctx);
drawFunction(c2s);
if(svg.children.length>0) {
svg.removeChild(svg.children[0]);
}
svg.appendChild(c2s.getSvg());
} , false);
}());
</script>
</body>
</html>