Esta publicación servirá para ir colocando fragmentos de consultas que en algún momento me fueron útiles para usarlo en MongoDB Fragmento 1: Se requería obtener todos los elementos que dentro de un atributo que es de tipo array(arreglo) coincida con type:"fire" Fragmento 2: Se requería actualizar el atributo " lastUpdate " de toda la colección donde la edad sea mayor o igual a 15.
"El tema es" que debia hacer un documento pdf apartir de una grafica hihgcharts, con esto no hay problema pues hihgchart tiene la caracteristica de exportar habilitando exporting: { enabled: false }, bien el detalle es que tenia mas de una grafica las cuales debia poner en solo un documento PDF, Entonces esto fue o que me funciono:
Tengo las graficas:
http://jsfiddle.net/xola139/y8kwg5Lh/
Antes de seguir es necesario agregar las siguientes librerias para poder continuar
http://cdnjs.cloudflare.com/ajax/libs/jspdf/0.9.0rc1/jspdf.js
http://canvg.googlecode.com/svn/trunk/rgbcolor.js
http://canvg.googlecode.com/svn/trunk/canvg.js
http://code.highcharts.com/modules/exporting.js
//Vamos agregar la funcion para que podamos crear la grafica hihgcharts en canvas, esto se hace con el siquinte codigo:
(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));
//Agregamos el evento al boton que nos ayudara a exportar el pdf
$('#exporta').click(function () {});
Dentro del evento click vamos a seleccionar las graficas que comiencen con el class =chart, en este ejemplo asi empiezan las clases
de los div donde se dibujan las graficas esto lo hacemos con este pedazo de codigo:
$('.chart').each(function (index) {
console.log(this.id);
});
Y para exportar con a pdf ya con el evento click configurado y con el ciclo que recorre cada grafica tenemos que poner mas o menos asi el siguiente codigo
var imageData = $(this).highcharts().createCanvas();
doc.addImage(imageData, 'JPEG', 45, (index * chartHeight) + 40, 120, chartHeight);
Al final este es mi resultado:
http://jsfiddle.net/xola139/y8kwg5Lh/3/
Y claro como era de esperarse la mayoria de las cosas las investigue en la red y me encontre estas url que me fueron de mucha utilidad para hcer mi ejemplo y entender como funciona.
http://hayageek.com/generate-pdf-with-javascript/
https://github.com/hongru/canvas2image/blob/master/index.html
http://fiddle.jshell.net/8ypxW/3/show/
http://jsfiddle.net/8ypxW/3/
https://parall.ax/products/jspdf#
http://fiddle.jshell.net/leighking2/dct9tfvn/
http://stackoverflow.com/questions/19807870/how-to-export-the-html-tables-data-into-pdf-using-jspdf
Amigo, muchas gracias por tu aporte. Quería comentarte que el botón de graficar no funciona. Agradecería si pudieras revisar que pasó. Gracias.
ResponderBorrarAlejandro
Excelente, muy buena información justo lo que andaba buscando
ResponderBorraramigo debido a que problema no funcione el boton de exportar
ResponderBorrar