ctx.arcTओ (ico_w + 0 + txt_w + 2 + txt2_w + 6, start_txt - txt2_h -3, ico_w + 0 + txt_w + 2 +txt2_w + 6, start_txt - txt2_h, 3); सीटीएक्स.लाइन टीओ (ico_w +0 + txt_w + 2 + txt2_w + 6, start_txt); ctx.arcTओ (ico_w + 0 + txt_w + 2 + txt2_w + 6, start_txt + 3, ico_w + 0 + txt_w + 2 + txt2_w +3, start_txt + 3, 3); सीटीएक्स.लाइन टीओ (ico_w +0 + txt_w + 5, start_txt + 3); ctx.arcTओ (ico_w + 0 + txt_w + 2, start_txt + 3, ico_w + 0 + txt_w + 2, start_txt, 3); ctx.lineWआईडी = 3; सीटीएक्स.स्ट्रोक (); ctx.fillStyle = clr; ctx.fillRect (ico_w + 0 + txt_w + 2, start_txt - txt2_h -3, txt2_w + 6, txt2_h + 6); } ctx.font = a_bold + '48px '+ fnt2; ctx.fillStyle = clr2; सीटीएक्स.फिल टीइxt (txt2, ico_w + 0 + txt_w + 5, start_txt);}) } फ़ंक्शन रेंडर इमेज 2 () { दस्तावेज़.फ़ॉन्ट्स.तैयारतब (_ => { कैनवास.स्टाइल.लेटरस्पेसिंग = 0 + 'पीएक्स'; ctx.font = '900 '+ico_sz+'px "फ़ॉन्टएबढ़िया 5 मुफ़्त"'; var ico_w = ctx.measureTएक्सटेंशन (आईसीओ) .चौड़ाई; var ico_h = parseInt(ctx.font.match(/\d+/), 10); ctx2.font = '900 48px "फ़ॉन्टएबढ़िया 5 मुफ़्त"'; var ico_w2 = ctx2.measureTएक्सटेंशन (आईसीओ) .चौड़ाई; ctx.font = m_bold + '48px '+ fnt; var txt_w = ctx.measureTएक्सट (टीएक्सटी) .चौड़ाई; var txt_h = parseInt(ctx.font.match(/\d+/), 10); ctx.font = a_bold + '12px' + fnt2; var txt2_w = ctx.measureTएक्सट (टीएक्सटी 2)। चौड़ाई; var txt2_h = parseInt(ctx.font.match(/\d+/), 10); var max_w = Math.max (ico_w, टीएक्सt_w, txt2_w); var केंद्र = (अधिकतम_w + 15) / 2; कैनवास.चौड़ाई = max_w + 15; कैनवास.हाइट = ico_h + txt_h + txt2_h + 35; कैनवास2.चौड़ाई = ico_w2 +5; कैनवास2.ऊंचाई = 58; ctx.textAlign = "केंद्र"; अगर (काf_1 == 3){
ctx.font = '900 '+ico_sz+'px "फ़ॉन्टएबढ़िया 5 मुफ़्त"'; ctx.fillStyle = काf_clr; सीटीएक्स.फिल टीइxt (आईसीओ, केंद्र + काf_1, ico_h + 12.5 + ऑफ_1); ctx.font = m_bold + '48px '+ fnt; ctx.fillStyle = काf_clr; सीटीएक्स.फिल टीइxt (txt, केंद्र + काf_1, ico_h + 5 + txt_h + 12.5 + बंद_1); } ctx.font = '900 '+ico_sz+'px "फ़ॉन्टएबढ़िया 5 मुफ़्त"'; ctx.fillStyle = ico_clr; सीटीएक्स.फिल टीइएक्सटी (आईसीओ, केंद्र, आईसीओ_एच + 12.5); ctx2.font = '900 48px "फ़ॉन्टएबढ़िया 5 मुफ़्त"'; ctx2.fillStyle = ico_clr; ctx2.fillTइएक्सटी (आईसीओ, 0, 48); कैनवास.स्टाइल.लेटरस्पेसिंग = 0 + 'पीएक्स'; ctx.font = m_bold + '48px '+ fnt; ctx.fillStyle = clr; सीटीएक्स.फिल टीइएक्सटी (टीएक्सटी, केंद्र, ico_h + 5 + txt_h + 12.5); अगर (txt2! = "" && आकार) { सीटीएक्स स्ट्रोक स्टाइल = सीएलआर; ctx.moveTओ (सीएंटर - (txt_w/2), ico_h + 10 + txt_h + 12.5); सीटीएक्स.लाइन टीओ (सीएंटर + (txt_w/2), ico_h + 10 + txt_h + 12.5); ctx.lineWआईडी = 2; सीटीएक्स.स्ट्रोक (); } अगर (काf_1 == 3){ कैनवास.स्टाइल.लेटरस्पेसिंग = document.getElementByIडी ('एल_एसपी')। मूल्य + 'पीएक्स'; ctx.font = a_bold + '12px' + fnt2; ctx.fillStyle = काf_clr; सीटीएक्स.फिल टीइxt(txt2, केंद्र + काf_1, ico_h+ 5 + txt_h + 5 + txt2_h + 12.5 + ऑफ_1); } कैनवास.स्टाइल.लेटरस्पेसिंग = document.getElementByIडी ('l_sp').मूल्य + 'पीएक्स'; ctx.font = a_bold + '12px' + fnt2; ctx.fillStyle = clr2; सीटीएक्स.फिल टीइएक्सटी (txt2, केंद्र,ico_h + 5 + txt_h + 5 + txt2_h + 12.5); एल_एसपी = 0;}) } var बटन = document.getElementById ('पसंदीदा-डाउनलोड');बटन.ऐडइवेंट लिस्टनर ('सीचाटना', फ़ंक्शन (ई) { वर डेटाURL= कैनवास2.toDataURL ('छवि/पीएनजी'); बटन.href = dataURL;});var बटन2 = document.getElementById('लोगो-डाउनलोड');Button2.addEventListener ('क्लिक करें', फ़ंक्शन (ई) { var dataURL2 = कैनवास.toDataURL ('छवि/पीएनजी'); बटन2.href = dataURL2;
}); /* हेक्सटीओ मानार्थ : हेक्स मान को HSL में कनवर्ट करता है, शिफ़्ट करता है* 180 डिग्री से रंग और फिर वह कनवर्ट करता हैx, मानार्थ रंग दे रहा है * एक हेक्स मान के रूप में* @ अपरम [स्ट्रिंग] हेक्स: हेक्स मान * @return [स्ट्रिंग] : हेक्स मान के रूप में मानार्थ रंग*/फ़ंक्शन हेक्सटीओ पूरा करेंइमेंटरी (हेक्स) { // हेक्स को आरजी में बदलेंबी // डेनिस को क्रेडिट http: // stackoverflow.com/a/36253499/4939630 वर आरजीबी= 'आरजीबी ('+ (हेक्स = हेक्स। रिप्लेस ('#', ''))। मैच (नया RegExp ('(। {' + हेक्स.लेंथ / 3+ '})','जी'))। नक्शा (फ़ंक्शन (एल) {वापसी पार्सइन्ट (हेक्स.लेंगवें% 2 ? एल+एल : एल, 16); }).जॉइन (',') + ')'; // आरजीबी मूल्यों की सरणी प्राप्त करें आरजीबी = आरजीb.replace(/[^\d,]/g, '').split(','); वार आर = आरजीबी [0], जी = आरजीबी[1], बी = आरजीबी [2]; // आरजीबी को एचएसएल में बदलें //द्वारा उत्तर से अनुकूलित0x000f http: // stackoverflow.com/a/34946092/4939630 आर /= 255.0; जी /= 255.0; बी / = 255.0; var मैक्स = मैथ.मैक्स (आर, जी, बी); var min = Math.min (आर, जी, बी); संस्करण एच, एस, एल = (अधिकतम + न्यूनतम) / 2.0; अगर (अधिकतम == न्यूनतम) { एच = एस = 0; // अक्रोमैटिक } अन्य { वार डी = अधिकतम - मिनट; एस = (एल> 0.5? डी / (2.0 - अधिकतम - न्यूनतम): डी / (अधिकतम + न्यूनतम)); अगर (अधिकतम == आर एंड& जी> = बी) { एच = 1.0472 * (जी - बी) / डी; } और अगर (अधिकतम == r && g 360) { एच - = 360; } एच / = 360; // hs और l मानों को rg और b मानों में बदलें //द्वारा उत्तर से अनुकूलितमोहसेन http: // stackoverflow.com/a/9493060/4939630 अगर (एस === 0) { आर = जी = बी = एल; // अक्रोमेटिक } अन्य { वर ह्यू2rgबी = समारोह ह्यू2rgबी (पी, क्यू, टी) { अगर (टी <0) टी + = 1; अगर (टी> 1) टी - = 1; अगर (टी <1/6) रिटर्न पी + (क्यू - पी) * 6 * टी; अगर (टी <1/2) वापसी क्यू; अगर (टी <2/3) रिटर्न पी + (क्यू - पी) * (2/3 - टी) * 6; वापसी पी; }; वार क्यू = एल <0.5? एल * (1 + एस): एल + एस - एल * एस; वार पी = 2 * एल - क्यू; आर = ह्यू 2rgबी (पी, क्यू, एच + 1/3); जी = ह्यू 2 आरजीबी (पी, क्यू, एच); बी = ह्यू 2 आरजीबी (पी, क्यू, एच - 1/3); } आर = मैथ.राउंड (आर * 255); जी = मैथ.राउंड (जी * 255); बी = मैथ.राउंड (बी * 255); // आरबी और जी मूल्यों को हेक्स में बदलें आरजीबी = बी | (जी << 8) | (आर << 16); वापसी "#" + (0x1000000 | rgबी).एसट्रिंग (16)। सबस्ट्रिंग (1);}
_