यह पेज हिन्दी में दिखाया जा रहा है, क्योंकि आपका ब्राउज़र यही भाषा माँगता है।
इस पेज का कोड चालू नहीं हुआ।
index.html को सीधे किसी फ़ोल्डर से खोलने पर ब्राउज़र JavaScript मॉड्यूल रोक देता है, इसलिए चार्ट पर कौन आएगा चुनने पर कुछ नहीं होगा। इसके बजाय फ़ोल्डर को http पर सर्व कीजिए:
ऊपर फ़ाइल चुनते ही यह खुल जाएगा।तैयार — इंटरनेट काट दीजिए, यह फिर भी चलता रहेगा।इस ब्राउज़र में उपलब्ध नहीं (बाकी सब फिर भी चलता है)।ऑफ़लाइन कैश के लिए https:// या localhost चाहिए।यहाँ कैश नहीं हो सकता, पर अपलोड फिर भी कुछ नहीं होता।आपकी फ़ाइलें कहीं नहीं गईं। {total} फ़ाइलें लोड हुईं, और वे सब इसी साइट की अपनी हैं। {platform}किसी चीज़ ने {hosts} से संपर्क किया, और यह टूल ऐसा कभी नहीं करता। यह देखने लायक बात है। {platform}विज्ञापन, माप और दान वाले बटन के लिए साइट की अपनी स्क्रिप्ट {hosts} होस्ट से आईं। उनमें से किसी को न कोई फ़ाइल मिली, न उसका एक बाइट।विज्ञापन, माप और दान वाले बटन के लिए साइट की अपनी स्क्रिप्ट {hosts} होस्ट से आईं। उनमें से किसी को न कोई फ़ाइल मिली, न उसका एक बाइट।कुछ गड़बड़ हो गई: {detail}। दोबारा शुरू करने के लिए पेज फिर से लोड कीजिए।{count} फ़ाइल पढ़ी जा रही है…{count} फ़ाइलें पढ़ी जा रही हैं…कोई उदाहरण आज़माइएउदाहरण बनाया जा रहा है…यह ब्राउज़र उदाहरण नहीं बना सका। इसके बजाय कोई फ़ाइल चुनिए।
ऊँचाई तुलना — अगल-बगल का एक चार्ट, जिसे डाउनलोड कर सकते हैं
ऊँचाइयाँ टाइप कीजिए, तस्वीर ले जाइए। इसे बनाने के लिए कुछ भी बाहर नहीं भेजा जाता।
● यह टूल नाम, ऊँचाइयाँ और उनसे बना चार्ट कभी अपलोड नहीं करता। यहाँ कोई सर्वर है ही नहीं।
ऊँचाई का चार्ट गणित और एक चित्र है: भेजने के लिए कोई फ़ाइल नहीं और पूछने के लिए कोई सेवा नहीं — और यह पेज जो इकलौती फ़ाइल लेता है, पैमाने पर रखने के लिए आपकी अपनी तस्वीर, वह भी यहीं पढ़ी जाती है और कहीं नहीं जाती। पुरुष, महिला, लड़का और लड़की सार्वजनिक डोमेन की कलाकृतियाँ हैं जो इस पेज के साथ ही आती हैं, और लड़का तथा लड़की छोटे किए गए वयस्क नहीं बल्कि असली बच्चों के चित्र हैं — और यही वह चीज़ है जो किसी परिवार के चार्ट को ऐसे गलत दिखने से बचाती है जिसे कोई नाम नहीं दे पाता। इसका हर कदम इसी पेज की कुछ सौ लाइन JavaScript में होता है, जिसे आप पढ़ सकते हैं। किसी भी तरह की नेटवर्क सुविधा है ही नहीं, और यहाँ यह मायने रखता है क्योंकि जो आप टाइप करते हैं वह लोगों की एक सूची है और हर एक की ऊँचाई है।
✗ कोई अपलोड नहीं
✗ कोई खाता नहीं
✗ कोई वॉटरमार्क नहीं
✓ ऑफ़लाइन चलता है
✓ ओपन सोर्स
लाइव जाँच:जाँच जारी…
ऑफ़लाइन:जाँच जारी…
हमारी बात मानने की ज़रूरत नहीं: DevTools खोलिए, नेटवर्क टैब देखिए और एक नाम तथा एक ऊँचाई टाइप कीजिए। किसी एक भी रिक्वेस्ट में इन दोनों में से एक अक्षर नहीं जाता। या इंटरनेट काट दीजिए और फिर भी चार्ट बना लीजिए।
प्राइवेसी का यह दावा कैसे जाँचा जा सकता है
लोगों की सूची सौंप देना कोई छोटी बात नहीं है। ज़्यादातर ऊँचाई चार्ट खाता माँगते हैं, और जो नहीं माँगते उनके पास भी एक सर्वर होता है जो आपका टाइप किया हर नाम और हर आँकड़ा देखता है। आप यहाँ जो टाइप कर रहे हैं वह यह है कि आपके परिवार में कौन है और हर कोई कितना लंबा है — और अक्सर नाम के बगल वाली आकृति से किसी बच्चे की उम्र भी झलक जाती है। इसमें से कुछ भी कहीं नहीं भेजा जाता, क्योंकि यहाँ उसके जाने की कोई जगह ही नहीं है।
यहाँ कुछ भी कहीं से कुछ नहीं लाता। पूरे src/ में कहीं कोई fetch, कोई XMLHttpRequest और कोई sendBeacon नहीं है। Content-Security-Policy में वे सारे पते लिखे हैं जिनसे यह पेज संपर्क कर सकता है, और उनमें से एक भी हमारा नहीं है।
दो बार आने के बीच भी कुछ याद नहीं रखा जाता। चार्ट पेज में रहता है और कहीं नहीं। टैब बंद कीजिए और सूची गायब: उसे थामे रखने वाला कोई खाता नहीं, उसे ढोने वाली कोई कुकी नहीं, और इस ब्राउज़र की स्टोरेज में कुछ भी नहीं लिखा जाता — यही वजह भी है कि जिस चार्ट को आप रखना चाहते हैं वह वही है जिसे आप डाउनलोड करते हैं।
लिंक चार्ट को साथ नहीं ले जाता। इस तरह के कई टूल पूरी सूची को पते वाली पट्टी में डाल देते हैं ताकि उसे साझा किया जा सके, और इससे हर नाम और हर ऊँचाई ऐसी चीज़ बन जाती है जिसे वह सब दर्ज कर लेता है जिससे होकर लिंक गुज़रता है — कोई चैट सर्वर, कोई मेल स्कैनर, किसी का ब्राउज़र इतिहास। इस पेज का पता आपके टाइप करते समय कभी नहीं बदलता।
PNG उसी SVG से बनता है जो स्क्रीन पर है। डाउनलोड कोई दूसरी रेंडरिंग नहीं है जो प्रीव्यू से अलग हो सकती हो। वही मार्कअप ब्राउज़र को दिया जाता है और एक कैनवस पर पोत दिया जाता है, और यही वजह है कि यह नेटवर्क का तार निकालकर भी हो जाता है: इसमें न कोई फ़ॉन्ट लाना है और न कोई तस्वीर लोड करनी है।
आपकी जोड़ी हुई तस्वीर यहीं पढ़ी जाती है, और कभी भेजी नहीं जाती। फ़ाइल यह पेज कभी नहीं छोड़ती — उसे ब्राउज़र के अपने FileReader से पढ़ा जाता है और एक निर्जीव दस्तावेज़ में बदला जाता है जो कुछ भी नहीं चलाता। जो बनाया जाता है वह वह फ़ाइल नहीं है: src/import-svg.js आकृतियों और ज्यामिति की एक स्वीकृत सूची से एक नया चित्र बनाता है, इसलिए कोई स्क्रिप्ट, स्टाइलशीट, फ़ॉन्ट, जुड़ी हुई तस्वीर या किसी और दस्तावेज़ का हवाला साथ जाने के बजाय पीछे छूट जाता है। यह दो बार मायने रखता है, क्योंकि जो चार्ट आप डाउनलोड करते हैं वह एक फ़ाइल है जिसे आप दूसरों को भेजते हैं: जो कुछ बच जाता, वह कुछ दिन बाद उनके ब्राउज़र का किसी अनजान सर्वर को पुकारना होता — उसी चीज़ में से जो इस पेज ने लिखी थी। फ़ोटो या PNG कोई प्रोग्राम नहीं है और उसमें दोबारा बनाने को कुछ नहीं होता: ब्राउज़र का अपना डिकोडर उसे पढ़ता है, और चार्ट पर जाने से पहले उसे यहीं एक कैनवस पर दोबारा बनाया जाता है। यही दोबारा बनाना फ़ाइल का मेटाडेटा पीछे छोड़ देता है — कैमरा, जगह, प्रोफ़ाइल, जो कुछ भी उसमें था — क्योंकि इनमें से कुछ भी कैनवस से बचकर नहीं निकलता। चार्ट में जो पहुँचता है वह इस पेज की एनकोड की हुई तस्वीर है, जो पते के बजाय डेटा के रूप में लिखी जाती है, इसलिए चार्ट अब भी किसी चीज़ की ओर इशारा नहीं करता।
कलाकृति यहीं है, कहीं से लाई नहीं जाती। चारों आकृतियाँ सार्वजनिक डोमेन की कलाकृतियाँ हैं, और वे पेज के बाकी हिस्से के साथ इसी ओरिजिन से आती हैं — न कोई आइकन फ़ॉन्ट, न कोई CDN, न आपके टाइप करते समय किसी और के सर्वर से खींची गई कोई स्प्राइट शीट। नेटवर्क कटा होने पर भी चार्ट बनता रहता है, उसकी वजह भी यही है।
गूगल क्या लोड करता है, और उसे क्या नहीं दिया जाता। विज्ञापन और माप वाली स्क्रिप्ट गूगल से आती हैं, और दान वाला बटन Buy Me a Coffee से। इनमें से किसी को भी कोई नाम या कोई ऊँचाई नहीं दी जाती। जो भी लाइन आपकी सूची को तस्वीर में बदलती है, वह इसी ओरिजिन से आती है और रिपॉज़िटरी में दर्ज है।
यह ऑफ़लाइन चलता है। नेटवर्क काट दीजिए और टूल जस का तस रहता है, क्योंकि इसमें कभी नेटवर्क वाला कदम था ही नहीं। इससे आसान सबूत कोई नहीं।
खुद जाँच लीजिए। ऊपर लिखी किसी भी बात को भरोसे पर मानने की ज़रूरत नहीं। यह पेज रिपॉज़िटरी के टेम्पलेट और कॉन्फ़िग से बनता है, एक ऐसी बिल्ड स्क्रिप्ट के ज़रिए जिसे आप पढ़ भी सकते हैं और खुद चला भी सकते हैं। उसका नतीजा dist ब्रांच पर कमिट रहता है, यानी जो सर्व हो रहा है और सोर्स से बिल्ड करने पर जो बनता है, दोनों का फ़र्क आप खुद देख सकते हैं:
सबसे पहले पढ़ने लायक फ़ाइलें ये हैं — Content-Security-Policy के लिए config/site.toml, चार आकृतियों और उनकी कलाकृति कहाँ से आई इसके लिए src/traced.js और vendor/, जिस सूची से मेन्यू बनता है उसके लिए src/figures.js, टाइप की गई ऊँचाई कैसे संख्या बनती है और पैमाने पर निशान कैसे लगते हैं इसके लिए src/units.js, सजावट के लिए src/chart.js, दोनों डाउनलोड के लिए src/save.js — जो स्क्रीन पर दिख रहा SVG है, और वही SVG एक कैनवस पर पोता हुआ — और जोड़ी गई SVG जिस स्वीकृत सूची से दोबारा बनाई जाती है उसके लिए src/import-svg.js, यहाँ की वह इकलौती फ़ाइल जहाँ गलत होना मायने रखता।
अगर आपके दफ़्तर का सुरक्षा सॉफ़्टवेयर अपलोड की चेतावनी दे। वह उस पल पर नज़र रखता है जब ब्राउज़र में फ़ाइल चुनी जाती है, और यह नहीं जान सकता कि पन्ना उसे भेजने वाला है या नहीं — इसलिए चुनने पर ही चेतावनी देता है। यहाँ से कुछ नहीं भेजा जाता: ब्राउज़र के डेवलपर टूल खोलिए, Network पर जाइए, और एक फ़ाइल चुनिए। उसे ले जाने वाला कोई अनुरोध नहीं है, और पन्ने की अपनी स्थानीय झलक के अलावा कोई अनुरोध ही नहीं। यही जाँच आपकी IT टीम आधे मिनट में कर सकती है।
1 बताइए आप किनकी तुलना कर रहे हैं
एक नाम, एक ऊँचाई, और कैसी आकृति बनानी है। हर पंक्ति ऐसी ऊँचाई से शुरू होती है जिस पर आप सीधे लिख सकते हैं। ऊँचाई आप जैसे लिखते हैं वैसे ही लिख सकते हैं — 173, 1.73 m, 5'8", 68 in — और हर बॉक्स के नीचे की पंक्ति दिखाती है कि क्या समझा गया, या लाल रंग में बता देती है अगर बॉक्स खाली है या ऊँचाई पढ़ी नहीं जा सकती। चुपचाप कुछ भी अंदाज़ा नहीं लगाया जाता।
यहाँ ऊपर से नीचे का मतलब चार्ट पर बाएँ से दाएँ है। किसी पंक्ति को हटाने के लिए उसके बाएँ किनारे वाली पकड़ से खींचिए, या तीरों का इस्तेमाल कीजिए, जो कीबोर्ड से यही काम करते हैं। दोनों ही सूरत में, अगर चार्ट ऊँचाई से क्रम लगा रहा था तो वह आपके अपने क्रम पर लौट आता है।
कोई SVG किसी भी चित्र को पैमाने पर रख देती है — एक लोगो, एक नक्शा, मशीन का कोई हिस्सा। वह इसी पेज में पढ़ी जाती है और कहीं नहीं जाती। उसमें से सिर्फ़ आकृतियाँ रखी जाती हैं: वह एक ही भरे हुए रंग में आती है, जो आप हर पंक्ति के लिए चुनते हैं, और जो कुछ भी नेटवर्क तक पहुँच सकता था — कोई जुड़ी हुई तस्वीर, कोई स्टाइलशीट, कोई फ़ॉन्ट, कोई स्क्रिप्ट — वह उस चार्ट में जाने के बजाय पीछे छूट जाता है जिसे आप शायद किसी को भेजें। भरी हुई आकृतियों के बजाय पतली रेखाओं से बना चित्र एक ठोस धब्बे की तरह निकलेगा, और यही वह इकलौता मौका है जब यह गलत टूल है।
कोई फ़ोटो या PNG जैसी है वैसी ही जाती है और अपने रंग रखती है, इसलिए पंक्ति का रंग सिर्फ़ उसका नाम लिखता है। वह भी यहीं पढ़ी जाती है और रखे जाने से पहले दोबारा बनाई जाती है — इससे चार्ट कितना भारी होगा यह सीमित रहता है और फ़ाइल का मेटाडेटा पीछे छूट जाता है। जो पारदर्शी है वह पारदर्शी ही रहता है, इसलिए कटी हुई तस्वीर पैमाने पर साफ़ खड़ी होती है, और फ़ोटो अपनी पृष्ठभूमि भी साथ लाती है, जिसे पहले काट देना बेहतर है।
इनमें से ज़्यादातर सादे डिब्बे की तरह नहीं, बने हुए चित्र की तरह आते हैं — हैंडल वाला दरवाज़ा, ऊपर फ़्रीज़र वाला फ़्रिज, ऐसा सोफ़ा जो देखने में सोफ़ा लगे। चित्र को पंक्ति के दोनों नंबरों में बिठाया जाता है, यानी आकार नंबर ही तय करते हैं: उनके ऊपर अपने नंबर लिख दीजिए और तस्वीर पीछे-पीछे चली आएगी। तीन के पास कोई चित्र नहीं है, क्योंकि सही अनुपात वाला कोई मुफ़्त चित्र नहीं मिला: बास्केटबॉल का घेरा, जहाज़ी कंटेनर और रसोई का प्लेटफ़ॉर्म उसी आयत की तरह आते हैं जो पहले हर चीज़ हुआ करती थी।
इनमें से कुछ वाकई तय हैं: 20 ft का जहाज़ी कंटेनर परिभाषा से ही 259 cm ऊँचा होता है, बास्केटबॉल का घेरा 305 पर होता है, और अमेरिकी भीतरी दरवाज़ा 203 गुणा 81 का होता है। बाकी मानक नहीं, बस आम माप हैं — दरवाज़े, खिड़कियाँ और प्लेटफ़ॉर्म देश-देश और घर-घर बदलते हैं। हर एक एक साधारण पंक्ति की तरह आता है, तो अपनी वाली नापिए और उसके ऊपर असली आँकड़े टाइप कीजिए।
आकृतिनामऊँचाईचौड़ाईरंग
2 ले जाइए
किसी दस्तावेज़ या चैट में चिपकाने के लिए PNG है। रखने के लिए SVG है: वह चार्ट को पिक्सेल की जगह निर्देशों के रूप में रखता है, इसलिए किसी भी आकार में साफ़ छपता है और बाद में वेक्टर खोलने वाली किसी भी चीज़ से उसका रंग बदला जा सकता है।
पैमाना बनाइए चार्ट के आर-पार जाती लकीरें और दोनों तरफ़ के आँकड़े। इनके बिना भी तस्वीर दो लोगों की तुलना ठीक करती है, पर यह बताना बंद कर देती है कि उनमें से कोई कितना लंबा है।
हर आकृति के ऊपर नाम और ऊँचाई लिखिए बंद होने पर चार्ट पैमाने पर बनी परछाइयाँ भर रह जाता है — और अगर नाम वैसे भी वहीं जाने हैं जहाँ आप इसे चिपका रहे हैं, तो यही चाहिए।
कोई पृष्ठभूमि ही नहीं पारदर्शी, ताकि इसे ऐसी स्लाइड पर रखा जा सके जिसका रंग पहले से है। पैमाना और लिखावट ऊपर चुने रंग के हिसाब से गहरे या हल्के बनते हैं, इसलिए पृष्ठभूमि बंद होने पर भी उसे लगभग वही रखिए जिस पर तस्वीर जाएगी।
यह बनाने की जगह की ऊँचाई है, इसलिए तैयार तस्वीर थोड़ी ज़्यादा ऊँची होती है: नाम उसके ऊपर बैठते हैं। चौड़ाई इससे तय होती है कि कितनी आकृतियाँ हैं और हर एक का लेबल कितना चौड़ा है। तस्वीर के नीचे की पंक्ति बताती है कि क्या बना।
पुरुषमहिलालड़कालड़कीचीज़अपनी तस्वीरपंक्ति {n} की आकृतिपंक्ति {n} का नामपंक्ति {n} की ऊँचाईपंक्ति {n} की चौड़ाईपंक्ति {n} का रंगपंक्ति {n} को ऊपर ले जाइएपंक्ति {n} को नीचे ले जाइएपंक्ति {n} हटाइएक्रम बदलने के लिए खींचिएनाम173 cm5'8"चौड़ाई{height} के रूप में पढ़ा गयाबनने से पहले इस पंक्ति को एक ऊँचाई चाहिए।यह ऐसी ऊँचाई नहीं जो यहाँ समझी जाती हो। 173, 1.73 m, 5'8" या 68 in आज़माइए।बनाने के लिए बहुत छोटा — 5 cm सबसे कम है।चार्ट जहाँ तक जाता है उससे ऊँचा — 12 मीटर सीमा है।जुड़ गया — उस फ़ाइल की {shapes} आकृतियों से बना। इसे पढ़ने के लिए कुछ भी अपलोड नहीं हुआ।उस फ़ाइल में बनाने लायक कुछ नहीं है। सिर्फ़ आकृतियाँ रखी जाती हैं — और जिस फ़ाइल में केवल टेक्स्ट, इफ़ेक्ट या जुड़ी हुई तस्वीरें हों, उसमें वे नहीं होतीं।वह फ़ाइल ऐसी SVG नहीं जो यहाँ पढ़ी जा सके।वह फ़ाइल एक आकृति के लिहाज़ से बहुत बड़ी है। सीमा दो मेगाबाइट है।जुड़ गई। तस्वीर इसी पेज में पढ़ी गई और कुछ भी अपलोड नहीं हुआ।वह फ़ाइल ऐसी तस्वीर नहीं जो यहाँ पढ़ी जा सके।वह तस्वीर बहुत बड़ी है। सीमा बारह मेगाबाइट है।किसी को जोड़िए, और चार्ट यहाँ दिख जाएगा।हर पंक्ति को एक ऊँचाई चाहिए। एक भर दीजिए, और चार्ट यहाँ दिख जाएगा।बारह आकृतियाँ ही इतनी हैं जितनी यह चार्ट पढ़ने लायक रहते हुए सँभाल सकता है।{count} आकृतियाँ, {width} गुणा {height} पिक्सेल। पैमाना ज़मीन से {top} तक जाता है, हर {step} पर एक लकीर।एक आकृति, {width} गुणा {height} पिक्सेल। पैमाना ज़मीन से {top} तक जाता है, हर {step} पर एक लकीर।सेव हो गया। इसे बनाने के लिए कहीं कुछ नहीं भेजा गया।{detail}। SVG फिर भी डाउनलोड होगा।कॉपी हो गया। जहाँ चाहिए वहाँ चिपका दीजिए।इस ब्राउज़र ने पेज को क्लिपबोर्ड में लिखने नहीं दिया। इसके बजाय डाउनलोड कर लीजिए।चार्ट पर अभी सेव करने लायक कुछ नहीं है।इस ब्राउज़र ने SVG बनाने से मना कर दियाइस ब्राउज़र ने PNG लिखने से मना कर दियाआपने जो नाम और ऊँचाइयाँ टाइप कीं वे कहीं नहीं गईं। {total} फ़ाइलें लोड हुईं। {platform}किसी चीज़ ने {hosts} से संपर्क किया, और यह टूल ऐसा कभी नहीं करता। {platform}विज्ञापन, माप और दान वाले बटन के लिए साइट की अपनी स्क्रिप्ट {hosts} होस्ट से आईं। उनमें से किसी को कोई नाम या ऊँचाई नहीं मिली।विज्ञापन, माप और दान वाले बटन के लिए साइट की अपनी स्क्रिप्ट {hosts} होस्ट से आईं। उनमें से किसी को कोई नाम या ऊँचाई नहीं मिली।
क्या इससे काम बन गया?
क्या गड़बड़ हुई?
शुक्रिया — इससे मदद मिलती है।
सिर्फ़ आपका जवाब भेजा जाता है, वह भी तभी जब आप बटन दबाते हैं। आपकी फ़ाइल, उसका नाम या उससे जुड़ी कोई बात कभी नहीं।
# ऊँचाई तुलना — अगल-बगल का एक चार्ट, जिसे डाउनलोड कर सकते हैं
ऊँचाइयाँ टाइप कीजिए, तस्वीर ले जाइए। इसे बनाने के लिए कुछ भी बाहर नहीं भेजा जाता।
> ऊँचाइयों की अगल-बगल तुलना कीजिए। एक पुरुष, एक महिला, एक लड़का, एक लड़की और चीज़ें जोड़िए — दरवाज़ा, खिड़की, व्हाइटबोर्ड, वेंडिंग मशीन — सेंटीमीटर में या फ़ुट और इंच में, और चार्ट को PNG या SVG के रूप में डाउनलोड कीजिए। यह आपके ब्राउज़र में बनता है।
यह पेज एक इंटरैक्टिव टूल है जो पूरी तरह आपके ब्राउज़र में चलता है, https://abox.tools/hi/compare-heights/ पर — आप इसे जो भी देते हैं, वह कहीं अपलोड नहीं होता। आगे वह सब कुछ है जो यह पेज इस टूल के बारे में शब्दों में कहता है; इसे इस्तेमाल करने के लिए यह पता खोलें।
## यह टूल नाम, ऊँचाइयाँ और उनसे बना चार्ट **कभी अपलोड नहीं करता**। यहाँ कोई सर्वर है ही नहीं।
ऊँचाई का चार्ट गणित और एक चित्र है: भेजने के लिए कोई फ़ाइल नहीं और पूछने के लिए कोई सेवा नहीं — और यह पेज जो इकलौती फ़ाइल लेता है, पैमाने पर रखने के लिए आपकी अपनी तस्वीर, वह भी यहीं पढ़ी जाती है और कहीं नहीं जाती। पुरुष, महिला, लड़का और लड़की सार्वजनिक डोमेन की कलाकृतियाँ हैं जो इस पेज के साथ ही आती हैं, और लड़का तथा लड़की छोटे किए गए वयस्क नहीं बल्कि असली बच्चों के चित्र हैं — और यही वह चीज़ है जो किसी परिवार के चार्ट को ऐसे गलत दिखने से बचाती है जिसे कोई नाम नहीं दे पाता। इसका हर कदम इसी पेज की कुछ सौ लाइन JavaScript में होता है, जिसे आप पढ़ सकते हैं। किसी भी तरह की नेटवर्क सुविधा है ही नहीं, और यहाँ यह मायने रखता है क्योंकि जो आप टाइप करते हैं वह लोगों की एक सूची है और हर एक की ऊँचाई है।
- ✗ कोई अपलोड नहीं
- ✗ कोई खाता नहीं
- ✗ कोई वॉटरमार्क नहीं
- ✓ ऑफ़लाइन चलता है
- ✓ ओपन सोर्स
## ऊँचाई तुलना चार्ट कैसे बनाएँ
1. **पहले सबको जोड़ लीजिए, दिखने की चिंता बाद में।** एक पंक्ति मतलब एक आकृति, एक नाम, एक ऊँचाई और एक रंग। नाम वैकल्पिक है — दो बेनाम परछाइयों का चार्ट, जिन पर बस ऊँचाइयाँ लिखी हों, अक्सर ठीक वही होता है जो किसी को चाहिए — और हर पंक्ति के तीर उसे बाएँ या दाएँ खिसका देते हैं, अगर क्रम मायने रखता हो।
2. **ऊँचाई जैसे आप लिखते हैं वैसे ही टाइप कीजिए।** `173`, `1.73 m`, `5'8"`, `68 in` और `5 ft 8` सब सही पढ़े जाते हैं। बॉक्स के नीचे की पंक्ति दिखाती है कि क्या समझा गया, दोनों प्रणालियों में, इसलिए गलत पढ़ा जाना छपने के बाद नहीं बल्कि बनने से पहले ही दिख जाता है। बिना इकाई का एक अंक मीट्रिक चार्ट पर सेंटीमीटर होता है और इंपीरियल पर इंच, और तीन से कम का बिना इकाई का अंक मीटर होता है — कोई भी 1.73 सेंटीमीटर लंबा नहीं होता।
3. **जो आकृति उस व्यक्ति से मेल खाती हो वही चुनिए।** कोई बच्चा करीब छह सिर ऊँचा होता है और वयस्क साढ़े सात, इसलिए सिकोड़े हुए वयस्क की तरह बनाया गया बच्चा ऐसे गलत दिखता है जिसे नाम देना मुश्किल है पर देखना आसान। लड़का और लड़की छोटे किए गए वयस्क नहीं बल्कि असली बच्चों के चित्र हैं, और किसी परिवार का चार्ट परिवार जैसा दिखे इसका ज़्यादातर हिस्सा यही तय करता है। हर पंक्ति में एक ऊँचाई पहले से होती है, तो किसी को जोड़ना किसी को बना देता है — बस उसके ऊपर लिख दीजिए।
4. **चार्ट पर कुछ जानी-पहचानी चीज़ रखिए।** अंक अमूर्त होता है, दरवाज़ा नहीं। ऐसी एक ही चीज़ जोड़ना जिसका आकार सब जानते हों — एक दरवाज़ा, एक खिड़की, कक्षा का व्हाइटबोर्ड, एक वेंडिंग मशीन — वही उस चार्ट को, जो दो ऊँचाइयाँ बताता भर है, ऐसा चार्ट बना देता है जो उन्हें दिखाता है। मेन्यू में बीस चीज़ें हैं, समूहों में, और हर एक एक सामान्य पंक्ति बनकर आती है जिस पर आप अपने आँकड़े टाइप कर सकते हैं। चीज़ों की ऊँचाई के साथ चौड़ाई भी होती है, इसलिए दरवाज़ा एक पट्टी नहीं बल्कि 203 गुणा 81 होता है।
5. **या उस पर अपना बनाया चित्र रखिए।** **अपनी तस्वीर** बटन आपकी मशीन से एक फ़ाइल लेता है और उसे उस ऊँचाई पर पैमाने पर रख देता है जो आप दें — जब चार्ट किसी व्यक्ति के बजाय किसी उत्पाद, वाहन या इमारत के बारे में हो तो यही चीज़ काम आती है। SVG बाकी हर आकृति की तरह उसी पंक्ति के रंग में बनती है; फ़ोटो या PNG जैसी है वैसी ही जाती है। दोनों अपने अनुपात बनाए रखती हैं, और दोनों कहीं भेजे जाने के बजाय यहीं पढ़ी जाती हैं।
6. **पैमाने को उन इकाइयों पर रखिए जिनमें आपका पाठक सोचता है।** सेंटीमीटर और फ़ुट के बीच बदलने से बॉक्स में जो लिखा है वह दोबारा लिखा जाता है, दोबारा समझा नहीं जाता, इसलिए चार्ट खुद नहीं हिलता — बस लिखने का तरीका बदलता है। अगर चार्ट दो तरह के पाठकों के लिए है, तो हर आकृति के ऊपर लिखी ऊँचाई चार्ट की इकाई में होती है और हर बॉक्स के नीचे की पंक्ति में दोनों होती हैं।
7. **चिपकाने के लिए PNG, छापने के लिए SVG।** PNG आपकी तय की गई पिक्सेल ऊँचाई पर एक तस्वीर है, और चैट विंडो, दस्तावेज़ या स्लाइड को यही चाहिए। SVG चार्ट को निर्देशों के रूप में रखता है, इसलिए वह किसी भी आकार में साफ़ छपता है और बाद में वेक्टर खोलने वाली किसी भी चीज़ से उसका रंग बदला जा सकता है।
## विस्तार से
[ऊँचाई तुलना चार्ट कैसे बनाएँ](https://abox.tools/hi/guides/make-a-height-comparison-chart/): ऊँचाइयों की सूची को अगल-बगल की तस्वीर में बदलिए: ऊँचाइयाँ कैसे लिखें, बच्चे के लिए कौन-सी आकृति चुनें, एक जानी-पहचानी चीज़ तीसरे व्यक्ति से ज़्यादा काम क्यों करती है, और चार्ट को PNG या SVG के रूप में कैसे बाहर लाएँ।
## बॉक्स में और भी टूल
- [इमेज कंप्रेसर](https://abox.tools/hi/compress-image/): साइज़ आप बताइए। बाकी हिसाब यह लगा लेगा।
- [इमेज रिसाइज़र](https://abox.tools/hi/resize-image/): साइज़ बताइए। डिब्बा खींचिए। फ़ॉर्मैट चुनिए।
- [HEIC से JPG](https://abox.tools/hi/heic-to-jpg/): iPhone जो फ़ोटो बनाता है, उस फ़ॉर्मैट में जिसे सब खोल लेते हैं।
- [ID फ़ोटो मेकर](https://abox.tools/hi/id-photo/): देश चुनिए। उसी देश का नियम यह हूबहू लागू कर देता है।
## सवाल
### क्या मेरा टाइप किया कुछ भी कहीं भेजा जाता है?
नहीं। चार्ट इसी पेज का JavaScript आपकी अपनी डिवाइस पर बनाता है, और इस टूल में किसी भी तरह की नेटवर्क सुविधा नहीं है — यह कभी कुछ मँगाता नहीं और कभी कुछ भेजता नहीं। पेज की `Content-Security-Policy` में वे सारे पते लिखे हैं जिनसे यह संपर्क कर सकता है, जिनमें से एक भी हमारा नहीं है। यह बात यहाँ साफ़-साफ़ कहने लायक है, क्योंकि इनपुट लोगों के नामों और उनकी ऊँचाइयों की सूची है, जो इस साइट पर आने वाली लगभग हर दूसरी चीज़ से ज़्यादा निजी है।
### क्या मैं चार्ट डाउनलोड कर सकता हूँ?
हाँ, PNG या SVG के रूप में, बिना वॉटरमार्क और बिना खाते के। PNG आपकी तय की गई पिक्सेल ऊँचाई पर बनता है और वही है जिसे दस्तावेज़, स्लाइड या चैट में चिपकाया जाता है। SVG चार्ट को पिक्सेल की जगह निर्देशों के रूप में रखता है: वह किसी भी आकार में साफ़ छपता है और बाद में किसी भी वेक्टर एडिटर में खोलकर उसका रंग बदला जा सकता है। दोनों उसी मार्कअप से बनते हैं जो स्क्रीन पर है, इसलिए इनमें से कोई भी प्रीव्यू से अलग नहीं हो सकता।
### ऊँचाई कैसे लिखूँ — सेंटीमीटर में या फ़ुट में?
जैसे चाहें, किसी भी पंक्ति में, जिस तरह आप आम तौर पर लिखते हैं। `173`, `173 cm`, `1.73 m`, `5'8"`, `5 ft 8 in` और `68 in` सब समझे जाते हैं, और बॉक्स के नीचे की पंक्ति दोनों प्रणालियों में दिखाती है कि क्या पढ़ा गया। बिना इकाई का अंक तब सेंटीमीटर होता है जब चार्ट मीट्रिक है और तब इंच जब वह इंपीरियल है; तीन से कम का बिना इकाई का अंक मीटर मान लिया जाता है, क्योंकि 1.73 सेंटीमीटर ऐसी ऊँचाई नहीं जो कोई टाइप करे।
### बच्चे छोटे वयस्कों जैसे क्यों नहीं दिखते?
क्योंकि बच्चा वह है ही नहीं। शरीर के अनुपात उम्र के साथ बदलते हैं: दो साल का बच्चा मोटे तौर पर साढ़े चार सिर ऊँचा होता है, आठ साल का छह, और वयस्क साढ़े सात — यानी सिर छोटे बच्चे का लगभग एक चौथाई और वयस्क का आठवाँ हिस्सा होता है। यहाँ लड़का और लड़की एक ही छोटी की गई परछाईं नहीं, असली बच्चों के चित्र हैं, और इसीलिए परिवार का चार्ट अलग-अलग आकार के चार वयस्कों जैसा नहीं बल्कि परिवार जैसा दिखता है।
### ये आकृतियाँ कहाँ से आई हैं?
चारों दूसरे लोगों की कलाकृतियाँ हैं, सब सार्वजनिक डोमेन में: पुरुष pitr का, महिला Madeleine Price Ball की, लड़की OpenClipart-Vectors की, और लड़का NIH BioArt लाइब्रेरी के लिए Ryan Kissinger का। हर फ़ाइल इस पेज के साथ `vendor/` में उसी रूप में आती है जैसे वह प्रकाशित हुई थी, इसलिए आप उन्हें मूल से मिला सकते हैं। सार्वजनिक डोमेन कुछ नहीं माँगता, और असल बात यही है: कलाकृति उस तस्वीर के भीतर पहुँचती है जिसे आप डाउनलोड करते हैं, और श्रेय माँगने वाला लाइसेंस वह शर्त आपके चार्ट से चिपका देता।
### क्या मैं अपनी तस्वीर चार्ट पर रख सकता हूँ?
हाँ — **अपनी तस्वीर** बटन कोई चित्र या फ़ोटो लेकर उसे उस ऊँचाई पर पैमाने पर रख देता है जो आप लिखें: एक लोगो, एक नक्शा, मशीन का कोई हिस्सा, एक गाड़ी, या उसी चीज़ की फ़ोटो। अनुपात उसके अपने होते हैं, इसलिए भरने के लिए कोई चौड़ाई नहीं होती। \
\
**SVG** एक ही भरे हुए रंग में बनती है, उसी में जिस पर वह पंक्ति सेट है, क्योंकि चार्ट का बाकी हिस्सा भी यही है — तो भरी हुई आकृतियों के बजाय पतली रेखाओं से बना चित्र एक धब्बे की तरह निकलता है, और उसके लिए यह गलत टूल है। सिर्फ़ *आकृतियाँ* रखी जाती हैं: फ़ाइल को पाथ, आयत और वृत्त से शुरू से दोबारा बनाया जाता है, और जो कुछ भी नेटवर्क तक पहुँच सकता था — कोई जुड़ी हुई तस्वीर, स्टाइलशीट, फ़ॉन्ट, स्क्रिप्ट — वह पीछे छूट जाता है। \
\
**फ़ोटो या PNG** जैसी है वैसी ही जाती है और अपने रंग बनाए रखती है, इसलिए पंक्ति का रंग सिर्फ़ उसका नाम लिखता है। चार्ट पर जाने से पहले उसे यहीं दोबारा बनाया जाता है, जिससे यह तय रहता है कि वह चार्ट में कितना जोड़ेगी, और फ़ाइल का मेटाडेटा पीछे छूट जाता है। पारदर्शिता बनी रहती है, इसलिए कटी हुई तस्वीर पैमाने पर साफ़ खड़ी होती है — और फ़ोटो अपनी पृष्ठभूमि भी साथ लाती है, जिसे पहले काट देना ठीक रहता है। \
\
दोनों में से कोई फ़ाइल कहीं नहीं जाती। यह दो बार मायने रखता है, क्योंकि जो चार्ट आप डाउनलोड करते हैं वह एक फ़ाइल है जिसे आप शायद किसी को भेजें।
### नन्हा बच्चा या शिशु क्यों नहीं है?
क्योंकि किसी ने एक बनाकर उसे सार्वजनिक डोमेन में नहीं डाला। विकिमीडिया कॉमन्स पर काम लायक बस एक ही मुफ़्त बच्चा है — वही लड़की — और NIH BioArt लाइब्रेरी में लड़का; स्कूल की उम्र से नीचे खोज खाली लौटती है, और लोगों का हर तार्किक मुफ़्त सेट शौचालय वाला चित्र-चिह्न होता है, हर उम्र में एक ही आकार का, और यही वह गलती है जिससे बचने के लिए यह पूरा टूल बना है। कुछ समय तक इस पेज के अपने कोड से बना एक नन्हा बच्चा था, और चार्ट पर वही अकेली आकृति थी जिसे किसी ने नहीं बनाया था: चार बनाई हुई आकृतियों के बगल में यह दिख जाता था। लड़के या लड़की से छोटे किसी के लिए, उनमें से एक को असली ऊँचाई पर सेट कर दीजिए — तुलना को थामे रखता है पैमाना, और वह सही रहेगा।
### एक चार्ट पर कितने लोग रख सकते हैं?
बारह। यह तकनीकी सीमा नहीं है — चित्र तो खुशी-खुशी तीस भी बना देता — पर एक दर्जन के बाद स्तंभ उनके ऊपर लिखे नामों से भी पतले हो जाते हैं और तस्वीर पढ़ी जानी बंद हो जाती है। अगर और चाहिए, तो नाम बंद कर देने से चौड़ाई वापस मिल जाती है, या दो चार्ट एक से बेहतर बात कहेंगे।
### क्या मैं चार्ट पर कोई चीज़ रख सकता हूँ?
हाँ — और इनमें से ज़्यादातर बनी-बनाई तस्वीर के साथ आती हैं। मेन्यू में शुरू करने के लिए बीस हैं, चार समूहों में: दरवाज़े और खिड़कियाँ, स्कूल और दफ़्तर (व्हाइटबोर्ड, मेज़, फ़ाइल अलमारी, प्रोजेक्टर स्क्रीन), शहर की चीज़ें (वेंडिंग मशीन, पहियों वाला कूड़ेदान, बास्केटबॉल का घेरा, 20 ft का जहाज़ी कंटेनर) और घर की चीज़ें। इनमें से सत्रह के साथ एक चित्र आता है — हैंडल वाला दरवाज़ा, ऊपर फ़्रीज़र वाला फ़्रिज, ऐसा सोफ़ा जो देखते ही सोफ़ा लगे — और चित्र पंक्ति की ऊँचाई और चौड़ाई में फ़िट किया जाता है, इसलिए आकार अब भी अंक तय करते हैं और उनके ऊपर लिखे आपके अपने अंक अब भी मानते हैं। बाकी तीन सादे आयत हैं, क्योंकि उनका कोई ऐसा मुफ़्त चित्र नहीं मिला जो सही भी हो और सही अनुपात में भी, और पैमाने के बारे में बने चार्ट पर गलत चित्र से ईमानदार डिब्बा बेहतर है। \
\
इनमें से कुछ माप सचमुच मानक हैं और कुछ बस आम माप, और पेज यह खुलकर कहता है। एक जानी-पहचानी चीज़ किसी चार्ट के लिए उतना कर देती है जितना कितने भी और लोग नहीं करते: वही तुलना को पैमाने के एहसास में बदल देती है।
### क्या कुत्ते या बिल्ली की कोई आकृति है?
नहीं, और यह चूक नहीं बल्कि जान-बूझकर छोड़ी गई जगह है। दोनों बनाए गए थे — बगल से, खड़े हुए, सिर कंधे के बराबर, ताकि चित्र का ऊपरी सिरा वही ऊँचाई हो जो बगल में लिखी है, क्योंकि हर नस्ल मानक जानवर को वहीं नापता है। वे इतने अच्छे नहीं बने कि भेजे जाते: सामने से दिख रहे चार लोगों के बगल में बगल से दिखता चौपाया, चित्र अच्छा होने पर भी गलती जैसा लगता है। तब तक जानवर के कंधे की ऊँचाई पर एक आयत ईमानदार जवाब है।
### क्या मैं चार्ट को लिंक से साझा कर सकता हूँ?
यहाँ से नहीं, और यह जान-बूझकर है। जो टूल यह सुविधा देते हैं, वे पूरी सूची को पते में डालकर देते हैं, जिसका मतलब है कि हर नाम और हर ऊँचाई उस हर चीज़ में पहुँच जाती है जिससे होकर लिंक जाता है — किसी चैट सर्वर के लॉग, कोई मेल स्कैनर, किसी का ब्राउज़र इतिहास, लिंक प्रीव्यू लाने वाली कोई सेवा। तस्वीर डाउनलोड कीजिए और वही भेजिए: वह वही बात कहती है और अपने साथ कोई सूची नहीं ले जाती।
### क्या यह मुफ़्त है, और क्या चार्ट व्यावसायिक रूप से इस्तेमाल कर सकता हूँ?
यह मुफ़्त है, कोई खाता नहीं और कोई वॉटरमार्क नहीं, और आप नतीजे को किसी रिपोर्ट, प्रस्तुति, विज्ञापन या उत्पाद में डाल सकते हैं। साइट पर विज्ञापन हैं, उन्हीं से इसका खर्च चलता है। यहाँ बनाए गए चार्ट का कुछ भी हमारा नहीं है, और कुछ भी रखा नहीं जाता।
### पैमाना दस-दस का क्यों है, एक-एक का क्यों नहीं?
क्योंकि दूरी किसी तय संख्या से नहीं, बल्कि इससे चुनी जाती है कि तस्वीर कितनी लकीरें सँभाल सकती है। दो वयस्कों वाले चार्ट में हर दस सेंटीमीटर पर एक लकीर आती है; उस पर बास्केटबॉल का घेरा रख दीजिए और लकीरें पच्चीस पर चली जाती हैं, क्योंकि एक तस्वीर पर नब्बे लकीरें पैमाना नहीं, एक धूसर धब्बा होती हैं। फ़ुट और इंच में सीढ़ी एक, तीन, छह और बारह इंच की है, ताकि लकीरें पूरे इंच पर गिरें, उनके आसपास नहीं।
### क्या मैं चार्ट को किसी गहरे रंग की स्लाइड पर रख सकता हूँ?
हाँ। पृष्ठभूमि को उसी रंग पर सेट कीजिए जिस पर वह बैठेगा, और पैमाना तथा लिखावट उसके हिसाब से गहरे और हल्के के बीच बदल जाते हैं — अंदाज़े से नहीं, उस रंग की चमक से निकाला हुआ। फिर अगर तस्वीर खुद पारदर्शी चाहिए तो “कोई पृष्ठभूमि ही नहीं” पर निशान लगाइए: स्याही अब भी आपके चुने रंग से तय होती है, इसलिए गहरे नीले स्लाइड के लिए बना पारदर्शी चार्ट उस पर पढ़ने लायक ही निकलता है।
### क्या यह ऑफ़लाइन चलता है?
हाँ। पेज एक बार लोड कीजिए, फिर इंटरनेट काट दीजिए और यह चलता रहता है। यही सबसे आसान तरीका भी है यह साबित करने का कि कुछ अपलोड नहीं हो रहा: जो टूल आपकी सूची को चार्ट बनवाने के लिए बाहर भेजता, वह तार निकालते ही रुक जाता।
## प्राइवेसी का यह दावा कैसे जाँचा जा सकता है
- **लोगों की सूची सौंप देना कोई छोटी बात नहीं है।** ज़्यादातर ऊँचाई चार्ट खाता माँगते हैं, और जो नहीं माँगते उनके पास भी एक सर्वर होता है जो आपका टाइप किया हर नाम और हर आँकड़ा देखता है। आप यहाँ जो टाइप कर रहे हैं वह यह है कि आपके परिवार में कौन है और हर कोई कितना लंबा है — और अक्सर नाम के बगल वाली आकृति से किसी बच्चे की उम्र भी झलक जाती है। इसमें से कुछ भी कहीं नहीं भेजा जाता, क्योंकि यहाँ उसके जाने की कोई जगह ही नहीं है।
- **यहाँ कुछ भी कहीं से कुछ नहीं लाता।** पूरे `src/` में कहीं कोई `fetch`, कोई `XMLHttpRequest` और कोई `sendBeacon` नहीं है। Content-Security-Policy में वे सारे पते लिखे हैं जिनसे यह पेज संपर्क कर सकता है, और उनमें से एक भी हमारा नहीं है।
- **दो बार आने के बीच भी कुछ याद नहीं रखा जाता।** चार्ट पेज में रहता है और कहीं नहीं। टैब बंद कीजिए और सूची गायब: उसे थामे रखने वाला कोई खाता नहीं, उसे ढोने वाली कोई कुकी नहीं, और इस ब्राउज़र की स्टोरेज में कुछ भी नहीं लिखा जाता — यही वजह भी है कि जिस चार्ट को आप रखना चाहते हैं वह वही है जिसे आप डाउनलोड करते हैं।
- **लिंक चार्ट को साथ नहीं ले जाता।** इस तरह के कई टूल पूरी सूची को पते वाली पट्टी में डाल देते हैं ताकि उसे साझा किया जा सके, और इससे हर नाम और हर ऊँचाई ऐसी चीज़ बन जाती है जिसे वह सब दर्ज कर लेता है जिससे होकर लिंक गुज़रता है — कोई चैट सर्वर, कोई मेल स्कैनर, किसी का ब्राउज़र इतिहास। इस पेज का पता आपके टाइप करते समय कभी नहीं बदलता।
- **PNG उसी SVG से बनता है जो स्क्रीन पर है।** डाउनलोड कोई दूसरी रेंडरिंग नहीं है जो प्रीव्यू से अलग हो सकती हो। वही मार्कअप ब्राउज़र को दिया जाता है और एक कैनवस पर पोत दिया जाता है, और यही वजह है कि यह नेटवर्क का तार निकालकर भी हो जाता है: इसमें न कोई फ़ॉन्ट लाना है और न कोई तस्वीर लोड करनी है।
- **आपकी जोड़ी हुई तस्वीर यहीं पढ़ी जाती है, और कभी भेजी नहीं जाती।** फ़ाइल यह पेज कभी नहीं छोड़ती — उसे ब्राउज़र के अपने `FileReader` से पढ़ा जाता है और एक निर्जीव दस्तावेज़ में बदला जाता है जो कुछ भी नहीं चलाता। जो बनाया जाता है वह वह फ़ाइल नहीं है: `src/import-svg.js` आकृतियों और ज्यामिति की एक स्वीकृत सूची से एक नया चित्र बनाता है, इसलिए कोई स्क्रिप्ट, स्टाइलशीट, फ़ॉन्ट, जुड़ी हुई तस्वीर या किसी और दस्तावेज़ का हवाला साथ जाने के बजाय पीछे छूट जाता है। यह दो बार मायने रखता है, क्योंकि जो चार्ट आप डाउनलोड करते हैं वह एक फ़ाइल है जिसे आप दूसरों को भेजते हैं: जो कुछ बच जाता, वह कुछ दिन बाद उनके ब्राउज़र का किसी अनजान सर्वर को पुकारना होता — उसी चीज़ में से जो इस पेज ने लिखी थी। फ़ोटो या PNG कोई प्रोग्राम नहीं है और उसमें दोबारा बनाने को कुछ नहीं होता: ब्राउज़र का अपना डिकोडर उसे पढ़ता है, और चार्ट पर जाने से पहले उसे यहीं एक कैनवस पर दोबारा बनाया जाता है। यही दोबारा बनाना फ़ाइल का मेटाडेटा पीछे छोड़ देता है — कैमरा, जगह, प्रोफ़ाइल, जो कुछ भी उसमें था — क्योंकि इनमें से कुछ भी कैनवस से बचकर नहीं निकलता। चार्ट में जो पहुँचता है वह इस पेज की एनकोड की हुई तस्वीर है, जो पते के बजाय डेटा के रूप में लिखी जाती है, इसलिए चार्ट अब भी किसी चीज़ की ओर इशारा नहीं करता।
- **कलाकृति यहीं है, कहीं से लाई नहीं जाती।** चारों आकृतियाँ सार्वजनिक डोमेन की कलाकृतियाँ हैं, और वे पेज के बाकी हिस्से के साथ इसी ओरिजिन से आती हैं — न कोई आइकन फ़ॉन्ट, न कोई CDN, न आपके टाइप करते समय किसी और के सर्वर से खींची गई कोई स्प्राइट शीट। नेटवर्क कटा होने पर भी चार्ट बनता रहता है, उसकी वजह भी यही है।
- **गूगल क्या लोड करता है, और उसे क्या नहीं दिया जाता।** विज्ञापन और माप वाली स्क्रिप्ट गूगल से आती हैं, और दान वाला बटन Buy Me a Coffee से। इनमें से किसी को भी कोई नाम या कोई ऊँचाई नहीं दी जाती। जो भी लाइन आपकी सूची को तस्वीर में बदलती है, वह इसी ओरिजिन से आती है और रिपॉज़िटरी में दर्ज है।
- **यह ऑफ़लाइन चलता है।** नेटवर्क काट दीजिए और टूल जस का तस रहता है, क्योंकि इसमें कभी नेटवर्क वाला कदम था ही नहीं। इससे आसान सबूत कोई नहीं।
**खुद जाँच लीजिए।** ऊपर लिखी किसी भी बात को भरोसे पर मानने की ज़रूरत नहीं। यह पेज रिपॉज़िटरी के टेम्पलेट और कॉन्फ़िग से बनता है, एक ऐसी बिल्ड स्क्रिप्ट के ज़रिए जिसे आप पढ़ भी सकते हैं और खुद चला भी सकते हैं। उसका नतीजा `dist` ब्रांच पर कमिट रहता है, यानी जो सर्व हो रहा है और सोर्स से बिल्ड करने पर जो बनता है, दोनों का फ़र्क आप खुद देख सकते हैं: https://github.com/A-Box-of-Tools/website
सबसे पहले पढ़ने लायक फ़ाइलें ये हैं — Content-Security-Policy के लिए `config/site.toml`, चार आकृतियों और उनकी कलाकृति कहाँ से आई इसके लिए `src/traced.js` और `vendor/`, जिस सूची से मेन्यू बनता है उसके लिए `src/figures.js`, टाइप की गई ऊँचाई कैसे संख्या बनती है और पैमाने पर निशान कैसे लगते हैं इसके लिए `src/units.js`, सजावट के लिए `src/chart.js`, दोनों डाउनलोड के लिए `src/save.js` — जो स्क्रीन पर दिख रहा SVG है, और वही SVG एक कैनवस पर पोता हुआ — और जोड़ी गई SVG जिस स्वीकृत सूची से दोबारा बनाई जाती है उसके लिए `src/import-svg.js`, यहाँ की वह इकलौती फ़ाइल जहाँ गलत होना मायने रखता।
ऊँचाई तुलना चार्ट कैसे बनाएँ
पहले सबको जोड़ लीजिए, दिखने की चिंता बाद में। एक पंक्ति मतलब एक आकृति, एक नाम, एक ऊँचाई और एक रंग। नाम वैकल्पिक है — दो बेनाम परछाइयों का चार्ट, जिन पर बस ऊँचाइयाँ लिखी हों, अक्सर ठीक वही होता है जो किसी को चाहिए — और हर पंक्ति के तीर उसे बाएँ या दाएँ खिसका देते हैं, अगर क्रम मायने रखता हो।
ऊँचाई जैसे आप लिखते हैं वैसे ही टाइप कीजिए।173, 1.73 m, 5'8", 68 in और 5 ft 8 सब सही पढ़े जाते हैं। बॉक्स के नीचे की पंक्ति दिखाती है कि क्या समझा गया, दोनों प्रणालियों में, इसलिए गलत पढ़ा जाना छपने के बाद नहीं बल्कि बनने से पहले ही दिख जाता है। बिना इकाई का एक अंक मीट्रिक चार्ट पर सेंटीमीटर होता है और इंपीरियल पर इंच, और तीन से कम का बिना इकाई का अंक मीटर होता है — कोई भी 1.73 सेंटीमीटर लंबा नहीं होता।
जो आकृति उस व्यक्ति से मेल खाती हो वही चुनिए। कोई बच्चा करीब छह सिर ऊँचा होता है और वयस्क साढ़े सात, इसलिए सिकोड़े हुए वयस्क की तरह बनाया गया बच्चा ऐसे गलत दिखता है जिसे नाम देना मुश्किल है पर देखना आसान। लड़का और लड़की छोटे किए गए वयस्क नहीं बल्कि असली बच्चों के चित्र हैं, और किसी परिवार का चार्ट परिवार जैसा दिखे इसका ज़्यादातर हिस्सा यही तय करता है। हर पंक्ति में एक ऊँचाई पहले से होती है, तो किसी को जोड़ना किसी को बना देता है — बस उसके ऊपर लिख दीजिए।
चार्ट पर कुछ जानी-पहचानी चीज़ रखिए। अंक अमूर्त होता है, दरवाज़ा नहीं। ऐसी एक ही चीज़ जोड़ना जिसका आकार सब जानते हों — एक दरवाज़ा, एक खिड़की, कक्षा का व्हाइटबोर्ड, एक वेंडिंग मशीन — वही उस चार्ट को, जो दो ऊँचाइयाँ बताता भर है, ऐसा चार्ट बना देता है जो उन्हें दिखाता है। मेन्यू में बीस चीज़ें हैं, समूहों में, और हर एक एक सामान्य पंक्ति बनकर आती है जिस पर आप अपने आँकड़े टाइप कर सकते हैं। चीज़ों की ऊँचाई के साथ चौड़ाई भी होती है, इसलिए दरवाज़ा एक पट्टी नहीं बल्कि 203 गुणा 81 होता है।
या उस पर अपना बनाया चित्र रखिए।अपनी तस्वीर बटन आपकी मशीन से एक फ़ाइल लेता है और उसे उस ऊँचाई पर पैमाने पर रख देता है जो आप दें — जब चार्ट किसी व्यक्ति के बजाय किसी उत्पाद, वाहन या इमारत के बारे में हो तो यही चीज़ काम आती है। SVG बाकी हर आकृति की तरह उसी पंक्ति के रंग में बनती है; फ़ोटो या PNG जैसी है वैसी ही जाती है। दोनों अपने अनुपात बनाए रखती हैं, और दोनों कहीं भेजे जाने के बजाय यहीं पढ़ी जाती हैं।
पैमाने को उन इकाइयों पर रखिए जिनमें आपका पाठक सोचता है। सेंटीमीटर और फ़ुट के बीच बदलने से बॉक्स में जो लिखा है वह दोबारा लिखा जाता है, दोबारा समझा नहीं जाता, इसलिए चार्ट खुद नहीं हिलता — बस लिखने का तरीका बदलता है। अगर चार्ट दो तरह के पाठकों के लिए है, तो हर आकृति के ऊपर लिखी ऊँचाई चार्ट की इकाई में होती है और हर बॉक्स के नीचे की पंक्ति में दोनों होती हैं।
चिपकाने के लिए PNG, छापने के लिए SVG। PNG आपकी तय की गई पिक्सेल ऊँचाई पर एक तस्वीर है, और चैट विंडो, दस्तावेज़ या स्लाइड को यही चाहिए। SVG चार्ट को निर्देशों के रूप में रखता है, इसलिए वह किसी भी आकार में साफ़ छपता है और बाद में वेक्टर खोलने वाली किसी भी चीज़ से उसका रंग बदला जा सकता है।
विस्तार से
ऊँचाई तुलना चार्ट कैसे बनाएँऊँचाइयों की सूची को अगल-बगल की तस्वीर में बदलिए: ऊँचाइयाँ कैसे लिखें, बच्चे के लिए कौन-सी आकृति चुनें, एक जानी-पहचानी चीज़ तीसरे व्यक्ति से ज़्यादा काम क्यों करती है, और चार्ट को PNG या SVG के रूप में कैसे बाहर लाएँ।
नहीं। चार्ट इसी पेज का JavaScript आपकी अपनी डिवाइस पर बनाता है, और इस टूल में किसी भी तरह की नेटवर्क सुविधा नहीं है — यह कभी कुछ मँगाता नहीं और कभी कुछ भेजता नहीं। पेज की Content-Security-Policy में वे सारे पते लिखे हैं जिनसे यह संपर्क कर सकता है, जिनमें से एक भी हमारा नहीं है। यह बात यहाँ साफ़-साफ़ कहने लायक है, क्योंकि इनपुट लोगों के नामों और उनकी ऊँचाइयों की सूची है, जो इस साइट पर आने वाली लगभग हर दूसरी चीज़ से ज़्यादा निजी है।
क्या मैं चार्ट डाउनलोड कर सकता हूँ?
हाँ, PNG या SVG के रूप में, बिना वॉटरमार्क और बिना खाते के। PNG आपकी तय की गई पिक्सेल ऊँचाई पर बनता है और वही है जिसे दस्तावेज़, स्लाइड या चैट में चिपकाया जाता है। SVG चार्ट को पिक्सेल की जगह निर्देशों के रूप में रखता है: वह किसी भी आकार में साफ़ छपता है और बाद में किसी भी वेक्टर एडिटर में खोलकर उसका रंग बदला जा सकता है। दोनों उसी मार्कअप से बनते हैं जो स्क्रीन पर है, इसलिए इनमें से कोई भी प्रीव्यू से अलग नहीं हो सकता।
ऊँचाई कैसे लिखूँ — सेंटीमीटर में या फ़ुट में?
जैसे चाहें, किसी भी पंक्ति में, जिस तरह आप आम तौर पर लिखते हैं। 173, 173 cm, 1.73 m, 5'8", 5 ft 8 in और 68 in सब समझे जाते हैं, और बॉक्स के नीचे की पंक्ति दोनों प्रणालियों में दिखाती है कि क्या पढ़ा गया। बिना इकाई का अंक तब सेंटीमीटर होता है जब चार्ट मीट्रिक है और तब इंच जब वह इंपीरियल है; तीन से कम का बिना इकाई का अंक मीटर मान लिया जाता है, क्योंकि 1.73 सेंटीमीटर ऐसी ऊँचाई नहीं जो कोई टाइप करे।
बच्चे छोटे वयस्कों जैसे क्यों नहीं दिखते?
क्योंकि बच्चा वह है ही नहीं। शरीर के अनुपात उम्र के साथ बदलते हैं: दो साल का बच्चा मोटे तौर पर साढ़े चार सिर ऊँचा होता है, आठ साल का छह, और वयस्क साढ़े सात — यानी सिर छोटे बच्चे का लगभग एक चौथाई और वयस्क का आठवाँ हिस्सा होता है। यहाँ लड़का और लड़की एक ही छोटी की गई परछाईं नहीं, असली बच्चों के चित्र हैं, और इसीलिए परिवार का चार्ट अलग-अलग आकार के चार वयस्कों जैसा नहीं बल्कि परिवार जैसा दिखता है।
ये आकृतियाँ कहाँ से आई हैं?
चारों दूसरे लोगों की कलाकृतियाँ हैं, सब सार्वजनिक डोमेन में: पुरुष pitr का, महिला Madeleine Price Ball की, लड़की OpenClipart-Vectors की, और लड़का NIH BioArt लाइब्रेरी के लिए Ryan Kissinger का। हर फ़ाइल इस पेज के साथ vendor/ में उसी रूप में आती है जैसे वह प्रकाशित हुई थी, इसलिए आप उन्हें मूल से मिला सकते हैं। सार्वजनिक डोमेन कुछ नहीं माँगता, और असल बात यही है: कलाकृति उस तस्वीर के भीतर पहुँचती है जिसे आप डाउनलोड करते हैं, और श्रेय माँगने वाला लाइसेंस वह शर्त आपके चार्ट से चिपका देता।
क्या मैं अपनी तस्वीर चार्ट पर रख सकता हूँ?
हाँ — अपनी तस्वीर बटन कोई चित्र या फ़ोटो लेकर उसे उस ऊँचाई पर पैमाने पर रख देता है जो आप लिखें: एक लोगो, एक नक्शा, मशीन का कोई हिस्सा, एक गाड़ी, या उसी चीज़ की फ़ोटो। अनुपात उसके अपने होते हैं, इसलिए भरने के लिए कोई चौड़ाई नहीं होती।
SVG एक ही भरे हुए रंग में बनती है, उसी में जिस पर वह पंक्ति सेट है, क्योंकि चार्ट का बाकी हिस्सा भी यही है — तो भरी हुई आकृतियों के बजाय पतली रेखाओं से बना चित्र एक धब्बे की तरह निकलता है, और उसके लिए यह गलत टूल है। सिर्फ़ आकृतियाँ रखी जाती हैं: फ़ाइल को पाथ, आयत और वृत्त से शुरू से दोबारा बनाया जाता है, और जो कुछ भी नेटवर्क तक पहुँच सकता था — कोई जुड़ी हुई तस्वीर, स्टाइलशीट, फ़ॉन्ट, स्क्रिप्ट — वह पीछे छूट जाता है।
फ़ोटो या PNG जैसी है वैसी ही जाती है और अपने रंग बनाए रखती है, इसलिए पंक्ति का रंग सिर्फ़ उसका नाम लिखता है। चार्ट पर जाने से पहले उसे यहीं दोबारा बनाया जाता है, जिससे यह तय रहता है कि वह चार्ट में कितना जोड़ेगी, और फ़ाइल का मेटाडेटा पीछे छूट जाता है। पारदर्शिता बनी रहती है, इसलिए कटी हुई तस्वीर पैमाने पर साफ़ खड़ी होती है — और फ़ोटो अपनी पृष्ठभूमि भी साथ लाती है, जिसे पहले काट देना ठीक रहता है।
दोनों में से कोई फ़ाइल कहीं नहीं जाती। यह दो बार मायने रखता है, क्योंकि जो चार्ट आप डाउनलोड करते हैं वह एक फ़ाइल है जिसे आप शायद किसी को भेजें।
नन्हा बच्चा या शिशु क्यों नहीं है?
क्योंकि किसी ने एक बनाकर उसे सार्वजनिक डोमेन में नहीं डाला। विकिमीडिया कॉमन्स पर काम लायक बस एक ही मुफ़्त बच्चा है — वही लड़की — और NIH BioArt लाइब्रेरी में लड़का; स्कूल की उम्र से नीचे खोज खाली लौटती है, और लोगों का हर तार्किक मुफ़्त सेट शौचालय वाला चित्र-चिह्न होता है, हर उम्र में एक ही आकार का, और यही वह गलती है जिससे बचने के लिए यह पूरा टूल बना है। कुछ समय तक इस पेज के अपने कोड से बना एक नन्हा बच्चा था, और चार्ट पर वही अकेली आकृति थी जिसे किसी ने नहीं बनाया था: चार बनाई हुई आकृतियों के बगल में यह दिख जाता था। लड़के या लड़की से छोटे किसी के लिए, उनमें से एक को असली ऊँचाई पर सेट कर दीजिए — तुलना को थामे रखता है पैमाना, और वह सही रहेगा।
एक चार्ट पर कितने लोग रख सकते हैं?
बारह। यह तकनीकी सीमा नहीं है — चित्र तो खुशी-खुशी तीस भी बना देता — पर एक दर्जन के बाद स्तंभ उनके ऊपर लिखे नामों से भी पतले हो जाते हैं और तस्वीर पढ़ी जानी बंद हो जाती है। अगर और चाहिए, तो नाम बंद कर देने से चौड़ाई वापस मिल जाती है, या दो चार्ट एक से बेहतर बात कहेंगे।
क्या मैं चार्ट पर कोई चीज़ रख सकता हूँ?
हाँ — और इनमें से ज़्यादातर बनी-बनाई तस्वीर के साथ आती हैं। मेन्यू में शुरू करने के लिए बीस हैं, चार समूहों में: दरवाज़े और खिड़कियाँ, स्कूल और दफ़्तर (व्हाइटबोर्ड, मेज़, फ़ाइल अलमारी, प्रोजेक्टर स्क्रीन), शहर की चीज़ें (वेंडिंग मशीन, पहियों वाला कूड़ेदान, बास्केटबॉल का घेरा, 20 ft का जहाज़ी कंटेनर) और घर की चीज़ें। इनमें से सत्रह के साथ एक चित्र आता है — हैंडल वाला दरवाज़ा, ऊपर फ़्रीज़र वाला फ़्रिज, ऐसा सोफ़ा जो देखते ही सोफ़ा लगे — और चित्र पंक्ति की ऊँचाई और चौड़ाई में फ़िट किया जाता है, इसलिए आकार अब भी अंक तय करते हैं और उनके ऊपर लिखे आपके अपने अंक अब भी मानते हैं। बाकी तीन सादे आयत हैं, क्योंकि उनका कोई ऐसा मुफ़्त चित्र नहीं मिला जो सही भी हो और सही अनुपात में भी, और पैमाने के बारे में बने चार्ट पर गलत चित्र से ईमानदार डिब्बा बेहतर है।
इनमें से कुछ माप सचमुच मानक हैं और कुछ बस आम माप, और पेज यह खुलकर कहता है। एक जानी-पहचानी चीज़ किसी चार्ट के लिए उतना कर देती है जितना कितने भी और लोग नहीं करते: वही तुलना को पैमाने के एहसास में बदल देती है।
क्या कुत्ते या बिल्ली की कोई आकृति है?
नहीं, और यह चूक नहीं बल्कि जान-बूझकर छोड़ी गई जगह है। दोनों बनाए गए थे — बगल से, खड़े हुए, सिर कंधे के बराबर, ताकि चित्र का ऊपरी सिरा वही ऊँचाई हो जो बगल में लिखी है, क्योंकि हर नस्ल मानक जानवर को वहीं नापता है। वे इतने अच्छे नहीं बने कि भेजे जाते: सामने से दिख रहे चार लोगों के बगल में बगल से दिखता चौपाया, चित्र अच्छा होने पर भी गलती जैसा लगता है। तब तक जानवर के कंधे की ऊँचाई पर एक आयत ईमानदार जवाब है।
क्या मैं चार्ट को लिंक से साझा कर सकता हूँ?
यहाँ से नहीं, और यह जान-बूझकर है। जो टूल यह सुविधा देते हैं, वे पूरी सूची को पते में डालकर देते हैं, जिसका मतलब है कि हर नाम और हर ऊँचाई उस हर चीज़ में पहुँच जाती है जिससे होकर लिंक जाता है — किसी चैट सर्वर के लॉग, कोई मेल स्कैनर, किसी का ब्राउज़र इतिहास, लिंक प्रीव्यू लाने वाली कोई सेवा। तस्वीर डाउनलोड कीजिए और वही भेजिए: वह वही बात कहती है और अपने साथ कोई सूची नहीं ले जाती।
क्या यह मुफ़्त है, और क्या चार्ट व्यावसायिक रूप से इस्तेमाल कर सकता हूँ?
यह मुफ़्त है, कोई खाता नहीं और कोई वॉटरमार्क नहीं, और आप नतीजे को किसी रिपोर्ट, प्रस्तुति, विज्ञापन या उत्पाद में डाल सकते हैं। साइट पर विज्ञापन हैं, उन्हीं से इसका खर्च चलता है। यहाँ बनाए गए चार्ट का कुछ भी हमारा नहीं है, और कुछ भी रखा नहीं जाता।
पैमाना दस-दस का क्यों है, एक-एक का क्यों नहीं?
क्योंकि दूरी किसी तय संख्या से नहीं, बल्कि इससे चुनी जाती है कि तस्वीर कितनी लकीरें सँभाल सकती है। दो वयस्कों वाले चार्ट में हर दस सेंटीमीटर पर एक लकीर आती है; उस पर बास्केटबॉल का घेरा रख दीजिए और लकीरें पच्चीस पर चली जाती हैं, क्योंकि एक तस्वीर पर नब्बे लकीरें पैमाना नहीं, एक धूसर धब्बा होती हैं। फ़ुट और इंच में सीढ़ी एक, तीन, छह और बारह इंच की है, ताकि लकीरें पूरे इंच पर गिरें, उनके आसपास नहीं।
क्या मैं चार्ट को किसी गहरे रंग की स्लाइड पर रख सकता हूँ?
हाँ। पृष्ठभूमि को उसी रंग पर सेट कीजिए जिस पर वह बैठेगा, और पैमाना तथा लिखावट उसके हिसाब से गहरे और हल्के के बीच बदल जाते हैं — अंदाज़े से नहीं, उस रंग की चमक से निकाला हुआ। फिर अगर तस्वीर खुद पारदर्शी चाहिए तो “कोई पृष्ठभूमि ही नहीं” पर निशान लगाइए: स्याही अब भी आपके चुने रंग से तय होती है, इसलिए गहरे नीले स्लाइड के लिए बना पारदर्शी चार्ट उस पर पढ़ने लायक ही निकलता है।
क्या यह ऑफ़लाइन चलता है?
हाँ। पेज एक बार लोड कीजिए, फिर इंटरनेट काट दीजिए और यह चलता रहता है। यही सबसे आसान तरीका भी है यह साबित करने का कि कुछ अपलोड नहीं हो रहा: जो टूल आपकी सूची को चार्ट बनवाने के लिए बाहर भेजता, वह तार निकालते ही रुक जाता।