पीडीएफ

Question

पर लिखने के लिए छवि के रूप में फ्लोट डेटा मैं ग्राफ़ खींचने के लिए jQuery/FLOT का उपयोग कर रहा हूं, मैं चाहता हूं कि उपयोगकर्ता ग्राफ के पीडीएफ संस्करण को डाउनलोड करने में सक्षम हो। मैं कोल्डफ्यूजन का उपयोग कर पीडीएफ लिख रहा हूं। ग्राफ बनाने के बाद मैं ग्राफ़ div का HTML भेजता हूं, AJAX के माध्यम से एक सीएफ स्क्रिप्ट में जो पीडीएफ लिखने के लिए cfdocument का उपयोग करता है। समस्या यह है कि पीडीएफ में, यह केवल अक्ष और लेबल प्रदर्शित करता है, न कि वास्तविक ग्राफ डेटा। क्या किसी को कैनवास पर गतिशील रूप से बनाई गई वास्तविक छवि प्राप्त करने का कोई तरीका पता है?

Answer 1

मुझे नहीं लगता कि इस flot में लागू किया गया अभी तक बाहर देख http://code.google.com/p/flot/issues/detail?id=175

Answer 2

चेक CutyCapt (http://cutycapt.sourceforge.net/), यह Flot के साथ काम करने लगता है।

var canvas = $("canvas.base")[0]; 
var tmpimg = canvas.toDataURL("image/png"); 
//console.log(tmpimg); 
$("body").append('<img src="'+tmpimg+'"/>'); 

ध्यान दें कि छवि का उत्पादन किया सिर्फcanvas है:

Answer 3

तुम भी एक img तत्व में toDataURL() और स्थानापन्न का उपयोग, जो पीडीएफ कनवर्टर संभाल करने में सक्षम होना चाहिए अपने canvas का एक स्नैपशॉट ले सकता है सामग्री (यानी, ग्राफ स्वयं) और अक्ष या किंवदंती शामिल नहीं है। आपको फ्लोट प्लेसहोल्डर में छवि के कुछ मुश्किल प्रतिस्थापन/संरेखण करना पड़ सकता है, लेकिन यह आपको शुरू करने के लिए एक उपयोगी छवि प्राप्त करता है।

यह this question के स्वीकृत उत्तर का थोड़ा सा काम कर रहा है और मैंने सोचा कि यहां किसी को यह उपयोगी लगेगा।

Answer 4

आप सर्वर पर चार्ट को phantomJS (वेबकिट इंजन) जैसे एक हेडलेस ब्राउज़र के साथ प्रस्तुत कर सकते हैं।

आपको केवल एक ऐसी स्क्रिप्ट चाहिए जो यूआरएल लेती है और आउटपुट को बेस 64 एन्कोडेड स्ट्रिंग के रूप में कंसोल स्ट्रीम में प्रस्तुत करती है या एक छवि लिखती है।

जहां तक ​​मुझे पता है कि यह ऐसा करने वाला एकमात्र अर्ध ब्राउज़र-स्वतंत्र तरीका है।

var page = require('webpage').create(); 
var system = require('system'); 

var pageUrl = system.args[1]; 

page.viewportSize = { width: 1280, height: 720 }; 
page.open(pageUrl , function() { 
    console.log(page.renderBase64('PNG')); 
    phantom.exit(); 
});