HTML को इमेज में बदलें


22

पृष्ठभूमि

बैच विभिन्न सिंटैक्स-हाइलाइटेड स्रोत फ़ाइलों (सी, एसक्यूएल, जावा, पीएचपी, बैच, बैश) को उच्च-रिज़ॉल्यूशन छवियों (600 डीपीआई) में परिवर्तित करता है, जो एक ईबुक और मुद्रित पुस्तक के लिए उपयुक्त है।

विफल समाधान

अब तक के कई प्रयास:

  • OpenOffice या LibreOffice - स्रोत फ़ाइल में हर बार दस्तावेज़ में स्रोत कोड को फिर से आयात करना होगा। (अर्थात, समाधान को सैकड़ों या हजारों स्रोत फ़ाइलों के लिए आसानी से स्वचालित नहीं किया जा सकता है।)
  • enscript। आसानी से रंग नहीं बदल सकते, अपूर्ण रूप से आउटपुट प्रस्तुत करते हैं, व्यापक नहीं।
  • लाइक्स / LaTeX। उत्पादन को बारीकी से प्रस्तुत करता है।
  • HTML के लिए gvim - पोस्टस्क्रिप्ट के लिए HTMLDOC - PNG के लिए घोस्टस्क्रिप्ट। HTMLDOC fontटैग को अनदेखा करता है ।
  • gvim to HTML - html2ps - घोस्टस्क्रिप्ट टू पीएनजी। RGB रंगों द्वारा मान्यता प्राप्त नहीं है html2ps
  • फ़ायरफ़ॉक्स टू पोस्टस्क्रिप्ट - पीएसजी को घोस्टस्क्रिप्ट। अप्रिय रूप से सर्जिकल।
  • HTML के लिए gvim - कुछ भी OmniFormat। बैच प्रसंस्करण के लिए मुफ्त संस्करण अनुपयुक्त; बहुत सारे विज्ञापन पॉप-अप।
  • pygments। छवि रिज़ॉल्यूशन को आसानी से नहीं बदल सकते; gvim की रंग योजनाओं की श्रेणी नहीं है।

निकटतम समाधान

समाधान जो लगभग काम करता है:

  • gvim to HTML - पीडीएफ में wkhtmltopdf। ImageMagick के साथ पोस्ट-प्रोसेसिंग की आवश्यकता होगी ( wkhtmltoimage छवि रिज़ॉल्यूशन सेट नहीं कर सकता, केवल पृष्ठ चौड़ाई)।

आवश्यकताएँ

  • विंडोज और लिनक्स, लेकिन या तो स्वीकार्य है।
  • नि: शुल्क या ओ.एस.एस.
  • केवल कमांड लाइन (बैच प्रसंस्करण के लिए उपयुक्त)
  • आसानी से रंग योजना बदलें
  • समर्थन: PHP, बैच, बैश, जावा, जावास्क्रिप्ट, आर, सी और एसक्यूएल

सवाल

सिंटैक्स-हाइलाइट किए गए स्रोत कोड को उच्च-रिज़ॉल्यूशन (600dpi) छवि में बदलने के लिए कोई अन्य तरीका?

धन्यवाद!


@ जार्विस: wkhtmltoimageपेज की चौड़ाई पर्याप्त क्यों नहीं है? ऊंचाई को निर्दिष्ट नहीं किया जा सकता है क्योंकि यह HTML सामग्री की सामग्री द्वारा निर्धारित किया गया है। imho चौड़ाई वास्तव में आप की जरूरत है, आप कितने पिक्सल प्रति इंच आप चाहते हैं के आधार पर आवश्यक चौड़ाई की गणना कर सकते हैं।
अकीरा

@ जार्विस: ठीक है, बस मुझे बताएं कि आप कितने इंच का आवरण चाहते हैं और मैं आपको बताता हूं कि आपको कितने पिक्सेल की आवश्यकता होगी। बाद में परिवर्तित होने के साथ परिणाम 'ट्रिमिंग' एक अच्छा विचार है, लेकिन 'डीपीआई' के विचार को कुछ हद तक नष्ट कर देता है। आप हमेशा "मुझे इस x इंच के स्थान को भरने की आवश्यकता है और मैं इसे प्रति इंच z डॉट्स से भरना चाहता हूं" .. और उस सूत्र के आधार पर आप पिक्सेल का अनुरोध करते हैं।
अकीरा

@akira: चौड़ाई स्रोत कोड का उपयोग करने वाले स्तंभों की संख्या पर निर्भर है। कभी-कभी चौड़ाई 75 अक्षर होगी। कभी-कभी यह 40 अक्षर का होगा। तो So५ पात्रों को लगभग ५.५ इंच और ४० पात्रों को आधे से थोड़ा अधिक होना चाहिए। 5.5 मान पुस्तक के मार्जिन पर निर्भर करता है, जो परिवर्तन के अधीन हैं (एक या दो बार)। यह एक गणना है जिसे स्वचालित रूप से किया जाना चाहिए, अन्यथा समाधान को स्वचालित नहीं किया जा सकता है, जो पूरे उद्देश्य को हरा देता है।
डेव जार्विस

@ जार्विस: हाँ, मैं आपकी समस्या समझता हूँ। आप इस बात से भाग्यशाली हैं कि आपके मामले में वेबकिट का आउटपुट वास्तव में स्केलेबल है और इस तरह आप पीडीएफ को बाद में 'आकार बदल' सकते हैं। एक एकीकृत समाधान के लिए मुझे संदेह है कि किसी को किसी प्रकार के ज़ूम-स्तर और 'ब्राउज़र' की चौड़ाई की आवश्यकता होगी
अकीरा

btw, दस्तावेज़ प्रारूप क्या है जो आप ebook या मुद्रित पुस्तक (लेटेक्स, xsl-fo .. आदि) बनाने के लिए उपयोग कर रहे हैं
akira

जवाबों:


9

सॉफ़्टवेयर आवश्यकताएं

निम्नलिखित सॉफ्टवेयर पैकेज विंडोज और लिनक्स सिस्टम दोनों के लिए उपलब्ध हैं, और एक पूर्ण, काम करने वाले समाधान के लिए आवश्यक हैं:

  • gvim - HTML में सिंटैक्स हाइलाइट किए गए स्रोत कोड को निर्यात करने के लिए उपयोग किया जाता है।
  • मोरिया - सिंटैक्स हाइलाइटिंग के लिए रंग योजना।
  • wkhtmltoimage - HTML दस्तावेजों को PNG फ़ाइलों में बदलने के लिए उपयोग किया जाता है।
  • gawk और sed - टेक्स्ट प्रोसेसिंग टूल।
  • ImageMagick - पीएनजी को ट्रिम करने और एक सीमा जोड़ने के लिए उपयोग किया जाता है।

सामान्य चरण

यहाँ समाधान कैसे काम करता है:

  1. स्रोत कोड को एक संपादक में लोड करें जो रंग के छींटे जोड़ सकता है।
  2. HTML कोड के रूप में स्रोत कोड निर्यात करें (एम्बेडेड FONTटैग के साथ )।
  3. HTML डॉक्यूमेंट से बैकग्राउंड एट्रिब्यूट (पारदर्शिता की अनुमति देने के लिए) स्ट्रिप करें।
  4. HTML दस्तावेज़ को PNG फ़ाइल में कनवर्ट करें।
  5. PNG बॉर्डर ट्रिम।
  6. छवि के चारों ओर एक छोटी, 25 पिक्सेल सीमा जोड़ें।
  7. अस्थायी फ़ाइलें हटाएं।

स्क्रिप्ट उन छवियों को उत्पन्न करती है जो स्रोत फ़ाइलों के लिए समान चौड़ाई की होती हैं, जिनमें वे लाइनें होती हैं जो सभी लंबाई में 80 वर्णों से कम होती हैं। 80 से अधिक वर्णों वाली लाइनों वाली फाइलें, संपूर्ण रेखा को बनाए रखने के लिए आवश्यक चौड़ी छवियों के रूप में लंबी होती हैं।

स्थापना

निम्नलिखित स्थानों में घटकों को स्थापित करें:

  • जीवीएम -C:\Program Files\Vim
  • मोरिया -C:\Program Files\Vim\vim73\colors
  • wkhtmltoimage -C:\Program Files\wkhtml
  • ImageMagick -C:\Program Files\ImageMagick
  • गौक और सेड -C:\Program Files\GnuWin32

नोट: ImageMagick में एक प्रोग्राम है convert.exe, जो विंडोज convertकमांड को सुपरडेड नहीं कर सकता है । इस वजह से, convert.exeबैच फ़ाइल में हार्ड-कोड किया जाना चाहिए (जैसा कि ImageMagick जोड़ने के लिए विरोध किया गया है PATH)।

पर्यावरण चर

PATH पर्यावरण चर को इसके लिए सेट करें :

"C:\Program Files\Vim\vim73";"C:\Program Files\wkhtml";"C:\Program Files\GnuWin32\bin"

बैच फ़ाइल

इसे चलाएं:

src2png.bat src2png.bat

src2png.batनिम्नलिखित सामग्रियों को कॉपी करके एक बैच फ़ाइल बनाएँ :

@ECHO OFF

SET NUMBERS=-c "set number"
IF "%2" == "" SET NUMBERS=

ECHO Converting %1 to %1.html...
gvim -e %1 -c "set nobackup" %NUMBERS% -c ":colorscheme moria" ^
  -c :TOhtml -c wq -c :q

REM Remove all background-color occurrences (without being self-referential)
sed -i "s/background-color: #......; \(.*\)}$/\1 }/g" %1.html

ECHO Converting %1.html to %1.png...
wkhtmltoimage --format png --transparent --minimum-font-size 80 ^
  --quality 100 --width 3600 ^
  %1.html %1.png

move %1.png %1.orig.png

REM If the text file has lines that exceed 80 characters, don't crop the
REM resulting image. (The book automatically shrinks large images to fit.)
REM The 3950 is the 80 point font at 80 characters with padding for line
REM numbers.
SET LENGTH=0
FOR /F %%l IN ('gawk ^
  "BEGIN {x=0} {if( length($0)>x ) x=length()} END {print x;}" %1') ^
DO (
  SET LENGTH=%%l
)
SET EXTENT=-extent 3950x
IF %LENGTH% GTR 80 SET EXTENT=

REM Trim the image height, then extend the width for 80 columns, if needed.
REM The result is that all images will be resized the same amount, thus
REM making the font size the same maximum for all source listings. Source
REM files beyond the 80 character limit will be scaled as necessary.
ECHO Trimming %1.png...
"C:\programs\ImageMagick\convert.exe" -format png %1.orig.png ^
  -density 150x150 ^
  -background none -antialias -trim +repage ^
  %EXTENT% ^
  -bordercolor none -border 25 ^
  %1.png

ECHO Removing old files...
IF EXIST %1.orig.png DEL /q %1.orig.png
IF EXIST %1.html DEL /q %1.html
IF EXIST sed*. DEL /q sed*.

सुधार और अनुकूलन का स्वागत करते हैं।

नोट: wkhtmltoimage का नवीनतम संस्करण पृष्ठभूमि के रंग को ओवरराइड करने के लिए ठीक से काम करता है। इस प्रकार पृष्ठभूमि रंगों के लिए सीएसएस को हटाने की रेखा अब सिद्धांत रूप में आवश्यक नहीं है।


3

इनका पेज पढ़ रहे हैं wkhtmltoimage:

 -d,    --dpi   <dpi>   Change the dpi explicitly

अगर वह मदद नहीं करता है: Qt और (शामिल) के साथ एक सरल समाधान को हैक करना वेबकिट बहुत सीधा है।


यह एक दुर्भाग्यवश प्रलेखन त्रुटि है। dpiविकल्प Windows संस्करण के साथ उपलब्ध नहीं है।
डेव जार्विस

@ डेविड जार्विस: ठीक है। तो ... पर जाएँ और QtWebkit का उपयोग करें। ।)
अकीरा

या आप VM (VirtualBox या ऐसे) के रूप में लिनक्स स्थापित कर सकते हैं और वहां रूपांतरण कर सकते हैं ...
icyrock.com

0

आप Html-> पीडीएफ रूपांतरण फ़ॉर्म कमांड लाइन के लिए ओपन ऑफ़िस का भी उपयोग कर सकते हैं:

http://www.oooninja.com/2008/02/batch-command-line-file-conversion-with.html


@ ओओ, ओओ (ओपनऑफिस) के साथ, समाधान होगा: 1. HTML फ़ाइलों को उत्पन्न करने के लिए कुछ टूल का उपयोग करें जिसमें वाक्य रचना हाइलाइट है। 2. OO से HTML को PDF में कन्वर्ट करें। चूंकि ये दोनों ऑपरेशन कमांड लाइन से किए जा सकते हैं, इसलिए एन संख्या की फाइलों के लिए प्रक्रिया को स्वचालित करना आसान होना चाहिए।
शमिता वर्मा

OpenOffice वास्तव में एक समाधान नहीं है। यह धीमा है, छोटी गाड़ी है, इसमें एक बड़ी मात्रा में ओवरहेड (यानी, जावा) है, और स्थापित करने में अधिक समय लगता है wkhtmltoimage। इसके अलावा, आपका समाधान सैद्धांतिक है। यदि आप एक वर्किंग बैच फ़ाइल बनाते हैं जो ठीक src2png.batउत्तर में दिए गए परिणामों के परिणाम को पुन: प्रस्तुत करती है (पारदर्शी पृष्ठभूमि छवियों के साथ) और HTML को कम समय wkhtmltoimageमें पूरी तरह से स्वचालित समाधान के रूप में उपयोग करते हुए धर्मान्तरित करता है , तो मैं आपको एक विकल्प के रूप में अपने परिणाम पोस्ट करने के लिए प्रोत्साहित करता हूं। । इसके अलावा, wkhtmltoimageओपनऑफिस के साथ बदलने का क्या फायदा होगा ?
डेव जार्विस
हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.