Я сделал проект для преобразования HTML
в файл PDF
.Как сделать результат PDF-преобразования, используя jspdf-открытие в новой вкладке?
Однако, вместо того, чтобы заставить клиента загружать файл, я хочу, чтобы он был открыт в новом окне. Как я могу это сделать?
В этом коде я просто могу конвертировать таблицу HTML
и highchart
в pdf, и она будет сохранена в моем корневом файле или файле загрузки. Как открыть PDF на новой вкладке? Вот мой код:
<script>
$(document).ready(function() {
// create canvas function from highcharts example http://jsfiddle.net/highcharts/PDnmQ/
(function (H) {
H.Chart.prototype.createCanvas = function (divId) {
var svg = this.getSVG(),
width = parseInt(svg.match(/width="([0-9]+)"/)[1]),
height = parseInt(svg.match(/height="([0-9]+)"/)[1]),
canvas = document.createElement('canvas');
canvas.setAttribute('width', width);
canvas.setAttribute('height', height);
if (canvas.getContext && canvas.getContext('2d')) {
canvg(canvas, svg);
return canvas.toDataURL("image/jpeg");
}
else {
alert("Your browser doesn't support this feature, please use a modern browser");
return false;
}
}
}(Highcharts));
$('#save').click(function() {
var doc = new jsPDF();
// chart height defined here so each chart can be palced
// in a different position
var chartHeight = 90;
// All units are in the set measurement for the document
// This can be changed to "pt" (points), "mm" (Default), "cm", "in"
doc.setFontSize(40);
html2canvas($("#kanan"), {
onrendered: function (canvas) {
var imgData = canvas.toDataURL(
'image/png');
var doc = new jsPDF('p', 'mm');
$('.myChart').each(function (index) {
var imageData = $(this).highcharts().createCanvas();
// add image to doc, if you have lots of charts,
// you will need to check if you have gone bigger
// than a page and do doc.addPage() before adding
// another image.
/**
* addImage(imagedata, type, x, y, width, height)
*/
doc.addImage(imgData, 'PNG', 10, 10);
doc.addImage(imageData, 'JPEG', 45, (index * chartHeight) + 40, 120, chartHeight);
doc.save('Laporan Termocouple.pdf');
});
}
});
//loop through each chart
//save with name
});
//charts
// JavaScript Document
$(function() {
var chart;
$(document).ready(function() {
$.getJSON("dataline.php", function (json) {
chart = new Highcharts.Chart({
chart: {
renderTo: 'chart1',
type: 'line'
},
title: {
text: 'Termocouple Graph Result'
},
subtitle: {
text: ''
},
xAxis: {
title: {
text: 'Sensor'
},
categories: ['1', '2', '3', '4', '5', '6', '7', '8', '9', '10', '11', '12']
},
yAxis: {
title: {
text: 'Temperature (°C)'
},
plotLines: [{
value: 0,
width: 1,
color: '#808080'
}]
},
tooltip: {
formatter: function() {
return '<b>' + this.series.name + '</b><br/>' +
this.x + ': ' + this.y;
}
},
legend: {
layout: 'vertical',
align: 'right',
verticalAlign: 'top',
x: -10,
y: 120,
borderWidth: 0
},
series: json
});
});
});
});
});
<!-- language: lang-html -->
<div class="container">
<div id="grafik" style="width: auto; height:300px;"></div>
<input class="btn btn-default" type="button" value="Save" name="save" id="save" />
<div id="chart1" class="myChart" style="min-width: 310px; height: 400px; margin: 0 auto"></div>
</div>
</form>
</div>
Итак, вы хотите отобразить pdf-файл? после преобразования его из HTML? Вы опубликовали код, но где в коде вы столкнулись с проблемами? Вы пробовали конвертировать и открывать PDF? –
из этого кода я могу получить pdf-файл, но файл pdf должен быть загружен первым. –
Мне нужно сделать результат преобразования PDF только загруженным только в новую вкладку. вы знаете, как это? –