फोकस बिंदुओं का उपयोग कर स्मार्ट फसल

हाल ही में, मुझे एक फोटोबैंक से कई दर्जन अलग-अलग आकारों के लगभग सौ विशाल चित्रों को क्रॉप करने के कार्य का सामना करना पड़ा। इन तैयार चित्रों को तब सीएमएस ग्राहकों द्वारा अपनी साइटों को डिजाइन करने के लिए उपयोग किया जाएगा। यह पता लगाने के बाद कि फ़ोटोशॉप में यह प्रक्रिया कितना समय लेगी, मुझे थोड़ा दुख हुआ - अगले नए साल का जश्न मनाने के लिए चित्रों के साथ मेरी योजनाओं में नहीं है।

विचार

प्रोग्रामर का मस्तिष्क प्रोग्रामिंग के बिना मौजूद नहीं हो सकता है। किसी भी कार्य के लिए 3 बार से अधिक नियमित संचालन की पुनरावृत्ति की आवश्यकता होती है, तुरंत मेरे सिर में सवाल उठने लगते हैं कि "यह स्वचालित कैसे होगा?" और रूपरेखा एल्गोरिदम तैयार करें। तो इस बार ऐसा ही हुआ।

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

यहाँ तंत्र को प्रदर्शित करने के लिए एक चित्रण है।


तो, फोकल बिंदु छवि के सबसे महत्वपूर्ण भाग वाले क्षेत्र के केंद्र में बिंदु है, और जब, जब फसल होती है, वैसे भी रहना चाहिए। साधारण फोटोग्राफी के लिए, लेंस को शूटिंग के दौरान इस क्षेत्र में केंद्रित किया जाएगा, यह विशेष रूप से स्पष्ट है अगर शूटिंग क्षेत्र की उथली गहराई के साथ की गई थी। इसलिए, वास्तव में, अवधारणा के लिए नाम।

मैंने अपने निष्कर्षों की जांच करने और यह देखने का फैसला किया कि क्या किसी ने पहले ही ऐसा कुछ किया था। HTML / CSS लाइब्रेरी को अनुकूली छवि क्रॉपिंग github.com/adamdbradley/focal-point के लिए मिला था। यहाँ, "फोकस पॉइंट" की अवधारणा का भी उपयोग किया जाता है, इसलिए मेरा विचार सत्य है! लेकिन मुझे एक तैयार उपयोगिता की आवश्यकता थी जो भौतिक चित्र उत्पन्न कर सके। यह नहीं मिल सका।

कार्यान्वयन

फिर मैंने Node.js को लिया, जो कि, हालांकि यह मेरा स्थायी काम करने का उपकरण नहीं है, लेकिन जिसे मैं स्वचालन और छोटी उपयोगिताओं के लिए उपयोग करना पसंद करता हूं।

नई छवि के लिए क्रॉपिंग एल्गोरिथ्म इस प्रकार है:

1. अंतिम छवि के अनुपात की गणना करें:
   k=Wr/Hr ,
   जहां Wr और Hr भविष्य की तस्वीर की चौड़ाई और ऊंचाई है
2. अधिकतम आयत निर्धारित करें जो मूल छवि में फिट होगी:
   if Wr >= Hr
then Wm = Wi, Hm = Wi/k
else Hm = Hi, Wm = Hm*k ,
   जहाँ Wi, Hi मूल के आयाम हैं, और Wm, Hm अधिकतम आयत के आयाम हैं।
   
3. केंद्र बिंदु के लिए नए निर्देशांक की गणना करें:
   fx2 = fx*Wm/Wi ,
   fy2 = fy*Hm/Hi ,
   fx, fx - मूल छवि में केंद्र बिंदु का निर्देशांक
   
4. हम केंद्र के पुराने और नए निर्देशांक के बीच के अंतर से आयत को बदलकर वास्तविक फसल करते हैं:
   crop(Wm, Hm, (fx-fx2), (fy-fy2))
   
5. वांछित आकार के परिणाम को कम करें:
   resize(Wr, Hr)
   

छवि प्रसंस्करण के लिए, मैंने नोड मॉड्यूल के लिए GraphicsMagick लिया क्योंकि यह विंडोज़ के तहत ग्राफिक्स पुस्तकालयों के साथ मूल रूप से काम करने का वादा करता था। और लगभग झूठ नहीं बोला। इसके साथ ImageMagick मैं शुरू नहीं कर सका (और पुराने इमेजमैजिक-नोड मॉड्यूल ने समस्याओं के बिना काम किया), लेकिन GraphicsMagick के रूप में विकल्प ने तुरंत और बिना शर्मिंदगी के काम किया। सैद्धांतिक रूप से, ImageMagick को दूसरे प्लेटफॉर्म पर भी काम करना चाहिए, gm मॉड्यूल में लाइब्रेरी के लिए कोई हार्ड लिंक नहीं है।

अंतिम उपयोगिता में, मैंने वेब के लिए थोड़ा अनुकूलन जोड़ा: सभी EXIF, ICM, आदि को अंतिम छवि से काट दिया जाता है, और जानकारी और परिणामस्वरूप छोटी छवि को एक तीखेपन फ़िल्टर के साथ चलाया जाता है। जब 3000x4000px से 200x300px तक कम करना वास्तव में आवश्यक है।

सुविधा के लिए, स्रोत डेटा को 2 फ़ाइलों के रूप में स्वीकार किया जाता है:

1. format.json - वह फ़ाइल जो उन स्वरूपों को सूचीबद्ध करती है जिन्हें आप फ़सल करना चाहते हैं
2. images.json - एक फ़ाइल जो छवियों को सूचीबद्ध करती है और फ़ोकस पॉइंट सेट करती है। यहां आप यह निर्दिष्ट कर सकते हैं कि छवियों को कहाँ और किस गुणवत्ता में सहेजना है।

आप GitHub github.com/fetis/fcrop पर रिपॉजिटरी में फ़ाइल स्वरूपों, स्थापना और अतिरिक्त सुविधाओं के बारे में अधिक पढ़ सकते हैं। वहां आप उदाहरण के लिए एक डेमो पा सकते हैं।

और अंत में, उपयोगिता का एक उदाहरण
मूल छवि का लिंक 5.4 एमबी


200h135


500h180


900h172