phyks/timeline.js
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Option to disable rounding

Browse Source
This commit is contained in:
Phyks 2014-03-28 15:02:55 +01:00
parent 756f430c44
commit debf513daa
2 changed files with 17 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
examples/index.html
View File

@ -7,7 +7,7 @@
} }
</style> </style>
</head> </head>
<body onload="SVG.init('holder', '100%', '100%', 'both'); SVG.addPoints([[50, 50],[100,100],[150,25],[175, -200]]); SVG.draw();"> <body onload="SVG.init('holder', '100%', '100%', 'both'); SVG.addPoints([[50, 50],[100,100],[150,25],[175, -200]]); SVG.draw(true);">
<div id="holder"></div> <div id="holder"></div>
<script type="text/javascript" src="../timeline.js"></script> <script type="text/javascript" src="../timeline.js"></script>
</body> </body>

22
timeline.js
View File

@ -209,13 +209,16 @@ SVG.getControlPoints = function (data) {
return {p1:p1, p2:p2}; return {p1:p1, p2:p2};
} }
SVG.draw = function() { SVG.draw = function(rounded) {
var scale = SVG.scale(SVG.raw_points); var scale = SVG.scale(SVG.raw_points);
var x = new Array(); var x = new Array();
var y = new Array(); var y = new Array();
var circle = false; var circle = false;
var line = false; var line = false;
var point = false; var point = false;
var px = false;
var py = false;
var path = '';
/* Draw points */ /* Draw points */
for(point in SVG.raw_points) { for(point in SVG.raw_points) {
@ -235,11 +238,18 @@ SVG.draw = function() {
circle.addEventListener('mouseover', function() { this.setAttribute('r', '6'); }) circle.addEventListener('mouseover', function() { this.setAttribute('r', '6'); })
circle.addEventListener('mouseout', function() { this.setAttribute('r', '4'); }) circle.addEventListener('mouseout', function() { this.setAttribute('r', '4'); })
} }
var px = SVG.getControlPoints(x);
var py = SVG.getControlPoints(y); if(rounded === true) {
var path = ''; px = SVG.getControlPoints(x);
for(point = 0; point < SVG.raw_points.length - 1; point++) { py = SVG.getControlPoints(y);
path += 'C '+px.p1[point]+' '+py.p1[point]+' '+px.p2[point]+' '+py.p2[point]+' '+x[point+1]+' '+y[point+1]+' '; for(point = 0; point < SVG.raw_points.length - 1; point++) {
path += 'C '+px.p1[point]+' '+py.p1[point]+' '+px.p2[point]+' '+py.p2[point]+' '+x[point+1]+' '+y[point+1]+' ';
}
}
else {
for(point = 1; point < SVG.raw_points.length; point++) {
path += 'L '+x[point]+' '+y[point]+' ';
}
} }
line = document.createElementNS(SVG.ns, 'path'); line = document.createElementNS(SVG.ns, 'path');
line.setAttribute('class', 'graph'); line.setAttribute('class', 'graph');