কম্পিউটার জেনারেটেড টেক্সচার্ড ওয়াল পেইন্ট

48

আমার ঘরের দেওয়ালের পেইন্টটিতে এলোমেলো, প্রায় ফ্র্যাক্টাল-মত, ত্রি-মাত্রিক টেক্সচার রয়েছে:

চিত্র এ

এই চ্যালেঞ্জে আপনি এমন একটি প্রোগ্রাম লিখবেন যা এলোমেলো চিত্র তৈরি করে যা দেখে মনে হয় তারা আমার দেয়ালের অংশ হতে পারে।

নীচে আমি আমার দেয়ালগুলিতে বিভিন্ন দাগের 10 টি চিত্র সংগ্রহ করেছি। সকলেরই প্রায় একই আলো ছিল এবং সমস্তকে দেয়াল থেকে এক ফুট দূরে ক্যামেরায় নিয়ে যাওয়া হয়েছিল। সীমানাগুলি সমানভাবে 2048 দ্বারা 2048 পিক্সেল তৈরি করার জন্য তাদের ক্রপ করা হয়েছিল, তারপরে এগুলি 512 দ্বারা 512-এ ছোট করা হয়েছিল above উপরের চিত্রটি চিত্র এ is

এগুলি কেবল থাম্বনেইলস, পূর্ণ আকারে দেখতে ছবিতে ক্লিক করুন!

এ: বি: সি: ডি: ই:চিত্র এ চিত্র বি চিত্র সি চিত্র ডি চিত্র ই

ফ: জি: এইচ: আমি: জে:চিত্র এফ চিত্র জি চিত্র এইচ চিত্র আমি চিত্র জে

আপনার কাজটি এমন একটি প্রোগ্রাম লিখতে হবে যা 1 থেকে 2 16 পর্যন্ত একটি এলোমেলো বীজ হিসাবে ইতিবাচক পূর্ণসংখ্যায় নিয়ে যায় এবং প্রতিটি মানের জন্য একটি স্বতন্ত্র চিত্র উত্পন্ন হয় যা দেখে মনে হয় এটি আমার দেয়ালের "একাদশ চিত্র" হতে পারে। যদি কেউ আমার 10 টি চিত্র এবং আপনার কয়েকটির দিকে তাকিয়ে থাকে তবে কম্পিউটারটি তৈরি করা হয়েছে তা বলতে না পারলে আপনি খুব ভাল করেছেন!

দয়া করে আপনার উত্পন্ন কয়েকটি চিত্র দেখান যাতে দর্শক কোডটি চালনা না করেই সেগুলি দেখতে পারে।

আমি বুঝতে পারি যে আমার চিত্রগুলিতে আলো তীব্রতা বা রঙের সাথে পুরোপুরি একরকম নয়। আমি এর জন্য দুঃখিত তবে উন্নত আলোক সরঞ্জাম ছাড়া আমি এটি করতে পারি সেরা the আপনার চিত্রগুলিতে ভেরিয়েবল আলোকসজ্জার প্রয়োজন নেই (যদিও তারা থাকতে পারে)। জমিন আরও ফোকাস করার জন্য গুরুত্বপূর্ণ জিনিস।

বিস্তারিত

  • আপনি চিত্র প্রক্রিয়াকরণ সরঞ্জাম এবং লাইব্রেরি ব্যবহার করতে পারেন।
  • আপনার ইচ্ছুক যে কোনও সাধারণ উপায়ে ইনপুট নিন (কমান্ড লাইন, স্টিডিন, সুস্পষ্ট পরিবর্তনশীল, ইত্যাদি)।
  • আউটপুট চিত্রটি কোনও সাধারণ লসলেস ইমেজ ফাইল ফর্ম্যাটে থাকতে পারে, বা এটি কেবল একটি উইন্ডো / বোঞ্জারে প্রদর্শিত হতে পারে।
  • আপনি প্রোগ্রামগতভাবে আমার 10 টি চিত্র বিশ্লেষণ করতে পারেন তবে ধরে নিবেন না যে আপনার কোডটি চালাচ্ছেন প্রত্যেকেরই তাদের অ্যাক্সেস রয়েছে।
  • আপনাকে অবশ্যই প্রোগ্রামিকভাবে চিত্রগুলি তৈরি করতে হবে। আপনি আমার কোনও চিত্র বা অন্য কিছু স্টক চিত্রের সামান্য বৈকল্পিক হার্ড-কোড নাও করতে পারেন। (জনগণ যাইহোক আপনাকে এর জন্য ভোট দিয়ে দেবে))
  • আপনি অন্তর্নির্মিত সিউডোরডম নম্বর জেনারেটর ব্যবহার করতে পারেন এবং ধরে নিতে পারেন যে পিরিয়ডটি 2 16 বা তার বেশি।

স্কোরিং

এটি একটি জনপ্রিয়তা প্রতিযোগিতা তাই সর্বাধিক ভোট প্রাপ্ত উত্তর জিততে পারে।

popularity-contest  graphical-output  image-processing  fractal 
— ক্যালভিনের শখ
সূত্র
PerlinNoise + + ছাঁটাই + + শেড
— অক্টোপাস
21
আমি প্রাচীরের চিত্রগুলি তৈরি করতে পারি না, সুতরাং পরিবর্তে একটি কমিক থাকতে হবে !
— Sp3000
8
@ এসপি 3000 এটি কীভাবে ঘটেছিল তা কমবেশি। যদিও আমি যদি সন্ধান করতাম তবে আমি সম্ভবত আমার সিলিংটি বেছে নেব , যা কাজ করতে পারে ...
— ক্যালভিনের শখ

উত্তর:

65

জিএলএসএল (+ জাভাস্ক্রিপ্ট + ওয়েবজিএল)

এখানে চিত্র বর্ণনা লিখুন

লাইভ ডেমো | গিটহাব সংগ্রহস্থল

কিভাবে ব্যবহার করে

একটি নতুন এলোমেলো চিত্রের জন্য পৃষ্ঠাটি পুনরায় লোড করুন। আপনি যদি কোনও নির্দিষ্ট বীজে খাওয়াতে চান তবে আপনার ব্রাউজারের কনসোলটি খুলুন এবং কল করুন drawScreen(seed)। কনসোলটি লোডে ব্যবহৃত বীজ প্রদর্শন করা উচিত।

আমি সত্যিই এটি অনেকগুলি প্ল্যাটফর্মে পরীক্ষা করে দেখিনি, সুতরাং এটি যদি আপনার পক্ষে কাজ করে না তবে আমাকে জানান। অবশ্যই, আপনার ব্রাউজারে ওয়েবজিএল সমর্থন করা দরকার। ত্রুটিগুলি বামদিকে কলামে বা ব্রাউজারের কনসোলে প্রদর্শিত হয় (ত্রুটির ধরণের উপর নির্ভর করে)।

নতুন: "চলমান আলোর উত্স" চেকবক্সটি টিক দিয়ে আপনি এখন দেয়ালগুলিকে কিছুটা প্রাণবন্ত করতে পারেন।

এই মায়া কি?

আমার এই গিজহাব অ্যাকাউন্টের চারপাশে ভাসমান এই ওয়েবজিএল বয়লারপ্লেট কোডটি পেয়েছি , যা আমি এখন এবং তারপরে ওয়েবজিএলে কিছু 2 ডি গ্রাফিক্স বিষয়গুলি দ্রুত প্রোটোটাইপ করতে ব্যবহার করি। কিছু ছায়াময়ী যাদু দিয়ে, আমরা এটিকে কিছুটা 3 ডি চেহারাও বানাতে পারি, তাই আমি ভেবেছিলাম যে এটি কিছু সুন্দর প্রভাবগুলি পাওয়ার দ্রুততম উপায়। বেশিরভাগ সেটআপটি সেই বয়লারপ্লেট কোড থেকে, এবং আমি বিবেচনা করছি যে এই জমা দেওয়ার জন্য একটি গ্রন্থাগার এবং এটি এই পোস্টে অন্তর্ভুক্ত করবে না। আপনি যদি আগ্রহী হন তবে গিটহাবের মেইন.জেগুলি দেখুন (এবং সেই ফোল্ডারের অন্যান্য ফাইলগুলি)।

সমস্ত জাভাস্ক্রিপ্ট যা করে তা হ'ল একটি ওয়েবজিএল প্রসঙ্গ সেটআপ করা, শেডারের জন্য একটি ইউনিফর্মে বীজ সংরক্ষণ করা এবং তারপরে পুরো প্রসঙ্গে একটি একক কোয়াড সরবরাহ করা। ভার্টেক্স শ্যাডার একটি সাধারণ পাসস্ট্রু শ্যাডার, সুতরাং সমস্ত ম্যাজিকটি খণ্ড শ্যাডারে ঘটে। এজন্যই আমি এটিকে জিএলএসএল জমা বলেছি।

কোডটির বৃহত্তম অংশটি হ'ল সিম্প্লেক্স শব্দটি উত্পন্ন করা, যা আমি গিটহাবের মধ্যে পেয়েছি । সুতরাং আমি বাদ দিচ্ছি পাশাপাশি নীচের কোড তালিকাতে। গুরুত্বপূর্ণ অংশটি হ'ল এটি কোনও ফাংশনটিকে সংজ্ঞায়িত করে snoise(vec2 coords)যা কোনও টেক্সচার বা অ্যারের লুকআপ ব্যবহার না করে সিমপ্লেক্স শোরগোল ফেরত দেয়। এটি মোটেও বীজযুক্ত নয়, তাই বিভিন্ন আওয়াজ পাওয়ার কৌশলটি হ'ল অনুসন্ধানটি কোথায় করা উচিত তা নির্ধারণের জন্য বীজটি ব্যবহার করা।

সুতরাং এখানে যায়:

#ifdef GL_ES
precision mediump float;
#endif
#extension GL_OES_standard_derivatives : enable

uniform float uSeed;
uniform vec2 uLightPos;

varying vec4 vColor;
varying vec4 vPos;

/* ... functions to define snoise(vec2 v) ... */

float tanh(float x)
{
    return (exp(x)-exp(-x))/(exp(x)+exp(-x));
}

void main() {
    float seed = uSeed * 1.61803398875;
    // Light position based on seed passed in from JavaScript.
    vec3 light = vec3(uLightPos, 2.5);
    float x = vPos.x;
    float y = vPos.y;

    // Add a handful of octaves of simplex noise
    float noise = 0.0;
    for ( int i=4; i>0; i-- )
    {
        float oct = pow(2.0,float(i));
        noise += snoise(vec2(mod(seed,13.0)+x*oct,mod(seed*seed,11.0)+y*oct))/oct*4.0;
    }
    // Level off the noise with tanh
    noise = tanh(noise*noise)*2.0;
    // Add two smaller octaves to the top for extra graininess
    noise += sqrt(abs(noise))*snoise(vec2(mod(seed,13.0)+x*32.0,mod(seed*seed,11.0)+y*32.0))/32.0*3.0;
    noise += sqrt(abs(noise))*snoise(vec2(mod(seed,13.0)+x*64.0,mod(seed*seed,11.0)+y*64.0))/64.0*3.0;

    // And now, the lighting
    float dhdx = dFdx(noise);
    float dhdy = dFdy(noise);
    vec3 N = normalize(vec3(-dhdx, -dhdy, 1.0)); // surface normal
    vec3 L = normalize(light - vec3(vPos.x, vPos.y, 0.0)); // direction towards light source
    vec3 V = vec3(0.0, 0.0, 1.0); // direction towards viewpoint (straight up)
    float Rs = dot(2.0*N*dot(N,L) - L, V); // reflection coefficient of specular light, this is actually the dot product of V and and the direction of reflected light
    float k = 1.0; // specular exponent

    vec4 specularColor = vec4(0.4*pow(Rs,k));
    vec4 diffuseColor = vec4(0.508/4.0, 0.457/4.0, 0.417/4.0, 1.0)*dot(N,L);
    vec4 ambientColor = vec4(0.414/3.0, 0.379/3.0, 0.344/3.0, 1.0);

    gl_FragColor = specularColor + diffuseColor + ambientColor;
    gl_FragColor.a = 1.0;
}

এটাই. আগামীকাল আমি আরও কিছু ব্যাখ্যা যোগ করতে পারি, তবে মূল ধারণাটি হ'ল:

  • এলোমেলো আলোর অবস্থান চয়ন করুন।
  • ফ্র্যাক্টাল প্যাটার্নটি তৈরি করতে কয়েক আকাশের শব্দের যোগ করুন।
  • নীচে রুক্ষ রাখতে শব্দটি স্কোয়ার করুন।
  • tanhউপরের স্তরের উপর থেকে শব্দটি খাওয়ান ।
  • উপরের স্তরে আরও কিছুটা টেক্সচারের জন্য আরও দুটি অষ্টভ যোগ করুন।
  • ফলাফলযুক্ত পৃষ্ঠের নরমালগুলি গণনা করুন
  • স্পেকুলার এবং ডিফিউজ লাইটের সাহায্যে সেই পৃষ্ঠের উপরে একটি সাধারণ ফোং শেডিং চালান। প্রথম উদাহরণের চিত্রটি থেকে আমি বেছে নেওয়া কিছু এলোমেলো রঙের ভিত্তিতে রঙগুলি বেছে নেওয়া হয়েছে।
— মার্টিন ইন্ডার
সূত্র
17
এটি প্রাচীরের থেকে বেশি বাস্তবসম্মত: o
— কোয়ান্টিন
1
আরও কিছু "শিরা" / "সাপ" / "কৃমি" এই ছবিটি "প্রাচীর" এর জন্য আরও উপযুক্ত করে তুলবে। তবুও সুন্দর।
— নোভা
33

গণিত স্প্যাকলিং

নীচের অ্যাপ্লিকেশনটি একটি এলোমেলো চিত্রে স্পেকলিংয়ের প্রয়োগ করে। "নতুন প্যাচ" এ ক্লিক করা কাজ করার জন্য একটি নতুন এলোমেলো চিত্র তৈরি করে এবং তারপরে বর্তমান সেটিংস অনুযায়ী প্রভাব প্রয়োগ করে। এর প্রভাবগুলি হ'ল তেল চিত্রাঙ্কন, গাউসিয়ান ফিল্টার, পোস্টারাইজেশন এবং এমবসিং। প্রতিটি প্রভাব স্বাধীনভাবে টুইট করা যেতে পারে। এলোমেলো সংখ্যা জেনারেটরের জন্য বীজ 1 থেকে 2 ^ 16 এর মধ্যে কোনও পূর্ণসংখ্যার হতে পারে।

আপডেট : গাউসিয়ান ফিল্টার, যা প্রান্তগুলিকে নরম করে তোলে, এটি এখন সর্বশেষ চিত্রের প্রভাব প্রয়োগ করে। এই পরিবর্তনের মাধ্যমে, পোস্টেরাইজেশনের প্রভাব আর প্রয়োজন ছিল না এবং এভাবে মুছে ফেলা হয়েছিল।

Manipulate[
 GaussianFilter[ImageEffect[ImageEffect[r, {"OilPainting", o}], {"Embossing", e, 1.8}], g],
 Button["new patch", (SeedRandom[seed] r = RandomImage[1, {400, 400}])], 
 {{o, 15, "oil painting"}, 1, 20, 1, ContinuousAction -> False, Appearance -> "Labeled"}, 
 {{e, 1.64, "embossing"}, 0, 5, ContinuousAction -> False, Appearance -> "Labeled"},
 {{g, 5, "Gaussian filter"}, 1, 12, 1, ContinuousAction -> False, Appearance -> "Labeled"},
 {{seed, 1}, 1, 2^16, 1, ContinuousAction -> False, Appearance -> "Labeled"}, 
 Initialization :> (SeedRandom[seed]; r = RandomImage[1, {400, 400}])]

শেষ ফলাফল

ব্যাখ্যা

ব্যাখ্যাটি কিছুটা আলাদা সংস্করণের উপর ভিত্তি করে তৈরি করা হয়েছে, যেখানে পোস্টারাইজেশন নিযুক্ত করা GaussianFilterহয়েছিল এবং এর প্রথম দিকে প্রয়োগ হয়েছিল। তবে এটি প্রতিটি চিত্রের প্রভাব কোনও চিত্রকে কীভাবে পরিবর্তন করে তা স্পষ্ট করে দেয়। শেষ ফলাফলটি ধারালো প্রান্তযুক্ত একটি পেইন্ট টেক্সচার। উপরের চিত্রটি যেমন দেখায় কেবল গাউসীয় ফিল্টারটি কেবল শেষে প্রয়োগ করা হয় তখন ফলাফলটি মসৃণ হবে।

আসুন কয়েকটি চিত্রের প্রভাবগুলি একবারে দেখুন।

একটি শুরুর চিত্র তৈরি করুন।

 r = RandomImage[1, {200, 200}]

এলোমেলো চিত্র

লেনা আমাদের দেখাবে যে প্রতিটি চিত্রের প্রভাব কী একটি জীবনের মতো চিত্রকে রূপান্তরিত করে।

Lena = ExampleData[{"TestImage", "Lena"}]

লেনা

একটি তেল চিত্রাঙ্কন প্রভাব লেনার জন্য প্রয়োগ করা হয়েছে।

ImageEffect[Lena, {"OilPainting", 8}]

লেনা তেল

একটি তেল চিত্রাঙ্কন প্রভাব আমাদের এলোমেলো চিত্রে প্রয়োগ করা হয়েছে। প্রভাবটি তীব্রতর করা হয়েছিল (8 এর পরিবর্তে 16)।

 r1 = ImageEffect[r, {"OilPainting", 16}]

তেল

একটি গাউসিয়ান ফিল্টার প্রভাব লেনার উপর প্রয়োগ হয়েছে (লেনার তেল চিত্রের প্রভাব সংস্করণে নয়)। ব্যাসার্ধটি 10 ​​পিক্সেল। (চূড়ান্ত সংস্করণে, এই প্রবেশের শীর্ষে, গাউসিয়ান ফিল্টার চূড়ান্ত প্রভাব হিসাবে প্রয়োগ করা হয়))

 GaussianFilter[Lena, 10]

লেনা গাউসিয়ান

কিছুটা হালকা গাউসিয়ান ফিল্টার প্রভাব আর 1 এ প্রয়োগ হয়েছে। ব্যাসার্ধটি 5 পিক্সেল।

 r2 = GaussianFilter[r1, 5]

গাউস

লেনার উপর একটি তীব্র পোস্টেরাইজেশন প্রভাব প্রয়োগ করা হয়েছে। (অ্যাপ্লিকেশনটির চূড়ান্ত সংস্করণে, আমি পোস্টারাইজেশন সরিয়েছি But তবে আমরা এটি বিশ্লেষণে রেখে যাব, যেহেতু বিশ্লেষণের উদাহরণগুলি পোস্টারাইজেশন সহ পূর্ববর্তী সংস্করণের ভিত্তিতে ছিল))

 ImageEffect[Lena, {"Posterization", 2}]

লেনা পোস্টারাইজ

আর পোস্টারে পোস্টারাইজেশন প্রভাব প্রয়োগ করা হয়েছে।

r3 = ImageEffect[r2, {"Posterization", 4}]

পোস্টারাইজ

এম্বেসিং লেনা

 ImageEffect[Lena, {"Embossing", 1.2, 1.8}]

লেনা এমবসিং

এম 3 এমবসিং ইমেজ প্রসেসিং সম্পূর্ণ করে। এটি ওপি'র সিলিংয়ের মতো কিছু দেখার উদ্দেশ্যে।

 ceilingSample = ImageEffect[r3, {"Embossing", 1.2, 1.8}]

খোদাই করা

কৌতূহলীদের জন্য, এখানে একই চিত্রের প্রয়োগগুলি সহ লেনা দেওয়া হয়েছে।

lena4

— DavidC
সূত্র
... লেনার ছবিটি পেতে একটি অন্তর্নির্মিত আছে? হাঃ হাঃ হাঃ.
— ব্যবহারকারী 253751
7
হ্যাঁ. ইমেজ প্রসেসিং টেস্টের জন্য ম্যাথমেটিকায় প্রায় 30 বিল্ট-ইন ছবি ব্যবহৃত হয়।
— ডেভিডসি
সামান্য পরিবর্তনের মাধ্যমে, কেউ RandomIntegerএকটি বীজ খাওয়াতে পারে , যার ফলে একটি নির্দিষ্ট আউটপুট গ্যারান্টিযুক্ত হয়। অথবা আপনি কি আর কিছু বোঝাতে চাইছেন, যেমন কোনও শুরুর মতো, নন-এলোমেলো চিত্র যার উপর প্রভাব প্রয়োগ হয়?
— ডেভিডসি
1
এটি এখন 1 থেকে 2 ^ 16 এর মধ্যে একটি বীজ গ্রহণ করে।
— ডেভিডসি
1
+1 কারণ Lena will show us how each image effect transforms a life-like pictureআমাকে LOL করেছে। আশ্চর্যের বিষয় হ'ল, চূড়ান্ত লেনার চিত্রটিতে অ্যাজটেক বা ইনকা বাম মুখোমুখি, একটি মাথার পোষাক পরা এবং একটি বাঁক ঝাঁকানো মনে হয় যেন এটি বন্দুক।
— স্তর নদী সেন্ট
13

অপেশাদার-রে

গল্ফিং সম্ভাবনা অনেক, সঙ্গে চালানো povray /RENDER wall.pov -h512 -w512 -K234543 এখানে চিত্র বর্ণনা লিখুন

প্রথমে এটি একটি এলোমেলো টেক্সচার তৈরি করে, তবে সেখানে থামার পরিবর্তে এটি টেক্সচারটি 3 ডি-হাইটফিল্ডে রূপান্তরিত করে ক্যামেরা থেকে রেডিয়াল ছায়া গো আরও বাস্তবসম্মত করার জন্য। এবং ভাল পরিমাপের জন্য এটি উপরে সামান্য ধাক্কাগুলির আরও একটি টেক্সচার যুক্ত করে।
এলোমেলো বীজের হার্ডকডিং ব্যতীত একমাত্র উপায় হ'ল clockঅ্যানিমেশনগুলির জন্য ব্যবহৃত ভেরিয়েবলটি ব্যবহার করা , এটি -K{number}পতাকা সহ উত্তীর্ণ হয়

#default{ finish{ ambient 0.1 diffuse 0.9 }} 

camera {location y look_at 0 right x}
light_source {5*y color 1}

#declare R1 = seed (clock); // <= change this

#declare HF_Function  =
 function{
   pigment{
     crackle turbulence 0.6
     color_map{
       [0.00, color 0.01]
       [0.10, color 0.05]
       [0.30, color 0.20]
       [0.50, color 0.31]
       [0.70, color 0.28]
       [1.00, color 0.26]
     }// end color_map
    scale <0.25,0.005,0.25>*0.7 
    translate <500*rand(R1),0,500*rand(R1)>
   } // end pigment
 } // end function

height_field{
  function  512, 512
  { HF_Function(x,0,y).gray * .04 }
  smooth 
  texture { pigment{ color rgb<0.6,0.55,0.5>}
            normal { bumps 0.1 scale 0.005}
            finish { phong .1 phong_size 400}
          } // end of texture  
  translate< -0.5,0.0,-0.5>
}
— DenDenDo
সূত্র
এটি মোটেও গল্ফ করার দরকার নেই। দুর্দান্ত ফলাফল! :)
— মার্টিন এেন্ডার
আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.