Skip to content

Commit a1d7efb

Browse files
MrRioMrRio
committed
Add beginnings of new SVG API
1 parent e8da3e2 commit a1d7efb

10 files changed

Lines changed: 660 additions & 239 deletions

File tree

‎examples/canvg_context2d/bar_graph_with_text_and_lines.html‎

Lines changed: 56 additions & 42 deletions
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,9 @@
88
<script type="text/javascript" src="../../libs/canvg_context2d/canvg.js"></script>
99

1010
<script src="../../dist/jspdf.debug.js"></script>
11+
<script src="../../plugins/canvas.js"></script>
1112

13+
<script src="../../plugins/svg.js"></script>
1214
</head>
1315

1416
<body>
@@ -21,7 +23,8 @@ <h1>Bar Graph With Text And Lines</h1>
2123
<svg id="svg" class="v-m-root" style="left: 600px; top: 600px; display: block; cursor: default" width="1000"
2224
height="500">
2325
<svg class="v-m-root" width="711" height="442"
24-
style="left: 0px; top: 0px; direction: ltr; cursor: default; position: absolute; box-sizing: border-box;">
26+
style="left: 0px; top: 0px; direction: ltr; cursor: default; position: absolute; box-sizing: border-box;"
27+
>
2528
<rect class="v-eventLayer" x="0" y="0" fill-opacity="0" width="711" height="442"></rect>
2629
<g class="v-backgroundutil">
2730
<rect class="v-background-body viz-plot-background v-morphable-background"
@@ -636,53 +639,64 @@ <h1>Bar Graph With Text And Lines</h1>
636639
</svg>
637640

638641
<div id="source"></div>
639-
640642
<script type="text/javascript">
643+
window.onload = function () {
644+
var doc = new jsPDF()
645+
doc.svg(document.querySelector('#svg'), {
646+
x: 0,
647+
y: 0
648+
})
649+
document.getElementById('result').setAttribute('src', doc.output('dataurlstring'))
650+
}
641651

642-
// IE does not support outerHTML on SVGElement
643-
if (typeof SVGElement === 'object' && !SVGElement.prototype.outerHTML) {
644-
Object.defineProperty(SVGElement.prototype, 'outerHTML', {
645-
get: function () {
646-
var $node, $temp;
647-
$temp = document.createElement('div');
648-
$node = this.cloneNode(true);
649-
$temp.appendChild($node);
650-
return $temp.innerHTML;
651-
},
652-
enumerable: false,
653-
configurable: true
654-
});
655-
}
656-
657-
window.onload = function () {
658-
doRefresh();
659-
};
660652

661-
var doRefresh = function () {
662-
var makePdf = function () {
663-
var pdf = new jsPDF('p', 'pt', 'c1');
664-
var c = pdf.canvas;
665-
c.width = 1000;
666-
c.height = 500;
667653

668-
var ctx = c.getContext('2d');
669-
ctx.ignoreClearRect = true;
670-
ctx.fillStyle = '#ffffff';
671-
ctx.fillRect(0, 0, 1000, 700);
654+
// // IE does not support outerHTML on SVGElement
655+
// if (typeof SVGElement === 'object' && !SVGElement.prototype.outerHTML) {
656+
// Object.defineProperty(SVGElement.prototype, 'outerHTML', {
657+
// get: function () {
658+
// var $node, $temp;
659+
// $temp = document.createElement('div');
660+
// $node = this.cloneNode(true);
661+
// $temp.appendChild($node);
662+
// return $temp.innerHTML;
663+
// },
664+
// enumerable: false,
665+
// configurable: true
666+
// });
667+
// }
668+
//
669+
// window.onload = function () {
670+
// doRefresh();
671+
// };
672+
//
673+
// var doRefresh = function () {
674+
// var makePdf = function () {
675+
// var pdf = new jsPDF('p', 'pt', 'c1');
676+
// var c = pdf.canvas;
677+
// c.width = 1000;
678+
// c.height = 500;
679+
//
680+
// var ctx = c.getContext('2d');
681+
// ctx.ignoreClearRect = true;
682+
// ctx.fillStyle = '#ffffff';
683+
// ctx.fillRect(0, 0, 1000, 700);
684+
//
685+
// //load a svg snippet in the canvas with id = 'drawingArea'
686+
// canvg(c, document.getElementById('svg').outerHTML, {
687+
// ignoreMouse: true,
688+
// ignoreAnimation: true,
689+
// ignoreDimensions: true
690+
// });
691+
//
692+
// return pdf;
693+
// };
694+
// document.getElementById('result').setAttribute('src', makePdf().output('dataurlstring'));
695+
// document.getElementById('source').innerText = makePdf().output();
696+
// //makePdf().save();
697+
// };
672698

673-
//load a svg snippet in the canvas with id = 'drawingArea'
674-
canvg(c, document.getElementById('svg').outerHTML, {
675-
ignoreMouse: true,
676-
ignoreAnimation: true,
677-
ignoreDimensions: true
678-
});
679699

680-
return pdf;
681-
};
682-
document.getElementById('result').setAttribute('src', makePdf().output('dataurlstring'));
683-
document.getElementById('source').innerText = makePdf().output();
684-
//makePdf().save();
685-
};
686700
</script>
687701

688702
</body>

0 commit comments

Comments
 (0)