Jump to content

Hare

Game Owner
  • Content Count

    316
  • Joined

  • Last visited

  • Days Won

    40

Daily XP Streak Bonus

XP

Start posting to receive your Daily Streak Bonus for your Adoptable. Every day you post, the more XP you earn.


Hare last won the day on December 21 2019

Hare had the most liked content!

Community Reputation

122 Excellent

3 Followers

About Hare

  • Rank
    Guru Member

Recent Profile Visitors

2670 profile views
  1. I wish I had a use for these! They're very pretty.
  2. Hare

    Warrenz.net

    Updates Since September 27th Warrenz went through a major update recently. We added a new layer of versatility to the layering system with a marking editor. You can add, remove, and change the color or variation of markings on your bunnies. They also get passed down geneticslly. There has also been a few new poses added. Other updates include: - New markings and marking stones to add them with: - New snowflakes for randomizing markings: - New cores for editing pre-existing markings: - Moving rabbits into burrows made easier. - The Specs Pass item, which lets you preview unlimited explore rabbits for a month. - New herbs: - Ability to increase den space in bulk.
  3. So this is something I (and I'm sure many others) have experienced at one point or another. You have a big, awesome idea for a game or feature that you daydream about and think 'This will be the best.' Maybe it's an idea that other games don't attempt because it's so ambitious, but you really want to do it anyway. What was your ambitious idea? Did you follow through with it or scrap it? Do you regret following through with the idea, or do you regret scrapping it?
  4. Does anyone play Smash Bros? I've been a Yoshi main since N64. Zelda on the side. ahaha Who's your main?
  5. Thank you so much for getting this community back together, Digital! I look forward to the growth opportunity if you can find someone with enough time to grow the community. If not, I'm glad to hear youy'll keep TGL up anyway. Even if it remains small compared to its predecessor, it still keeps the community together. I don't expect it to ever be as big as VPL, nor do I think it needs to be. It's still a much needed resource and hub for players and serves its purpose very well. ? But hey, if a new owner could make it grow, that's great too!
  6. I had trouble with that part because of the caching issues, but managed to figure it out! I'm glad this helps, you're welcome! There is a specific palette for Warrenz because we use modulation a lot. Other sites may not need that if they do hex edits instead. I would pick a color that looks best on the animal for the 'standard' color and then modify it for non-standard animals. We chose that specific shade of brown for the file, but then we have a brightness and saturation modulator on the realistic colors.
  7. You're welcome and I'm glad you've found it helpful!
  8. Added sections for transparency, gradients, fractals, and storing images. All done with the Imagick tutorials!
  9. Added tutorials for mendelian genetics, color swapping, cutting out markings, and marking variation. Will add more soon.
  10. STORING IMAGES - When to Render Rendering images with Imagick is easy, but it takes a while to process each time you view the pet that's being rendered. If you want players to see images instantly without having to render them each time, you can store them in a file directory. First, you'll need something to name the file. We can use the pet's unique ID for this. Put the ID variable in your display code (wherever the image will be displayed) so you can pass it to your Imagick file (img.php). <?php echo "<img src='img.php?petid=$petid'>"; ?> Now pass the GET variable to Imagick so you'll have the pet ID in your Imagick code. You'll also add a new section to your Imagick code near the end. We'll use an if statement to check if a pet with this ID has an image file already (if not, it will write a new one). <?php $path = "./img/"; $petid = $_GET["petid"]; $img = new Imagick( $path . "/base.png" ); $imgdetails = new Imagick( $path . "details.png" ); $img->compositeImage($imgdetails, Imagick::COMPOSITE_DEFAULT, 0, 0); $imgeye = new Imagick( $path . "eye.png" ); $img->compositeImage($imgeye, Imagick::COMPOSITE_DEFAULT, 0, 0); $imgpupil = new Imagick( $path . "pupil.png" ); $img->compositeImage($imgpupil, Imagick::COMPOSITE_DEFAULT, 0, 0); $imgshading = new Imagick( $path . "shading.png" ); $img->compositeImage($imgshading, Imagick::COMPOSITE_MULTIPLY, 0, 0); $imglines = new Imagick( $path . "lines.png" ); $img->compositeImage($imglines, Imagick::COMPOSITE_DEFAULT, 0, 0); $imgwatermark = new Imagick( $path . "watermark.png" ); $img->compositeImage($imgwatermark, Imagick::COMPOSITE_DEFAULT, 0, 0); if (!file_exists('img/pets/' . $petid . '.png')) { $storepath = $path . 'pets/' . $petid . '.png'; $img->writeImage($storepath); } header('Content-type: image/png'); echo $img; ?> Presto! There should now be a new file called 5.png in the img/pets directory. Now let's update your display code so it displays either the Imagick code OR the stored image based on whether the stored image is available. if (file_exists('img/pets/' . $petid . '.png')) { echo "<img src='/img/pets/$petid.png'>"; } else { echo "<img src='img.php?petid=$petid'>"; } If the file exists, bring up the image file for the pet. If the file does not exist, use Imagick to render one. When a pet's image is going to be changed, you can simply wipe their current image file. <?php unlink('img/pets/' . $petid . '.png'); ?> Then the next time the player looks at the pet, the image display code will handle things (since it's set up to check if the file exists). Image Manipulation Explots If you store the files like this, you'll need to make sure players can't cheat the system to write files for their pets. This is beyond my Imagick tutorial, but just a heads up. CACHING - Images Not Appearing 'Updated' Another important note is that if file names for a pet don't change even though the file was rewritten, some browsers will cache the old image, resulting in a player not seeing the changes they made to their pet. You can get around this by putting a timestamp in the image filename. The timestamp will have to be checked and updated appropriately.
  11. TRANSPARENCY - Another Way to Add Variation If you want to add even more color opportunities to your creatures, one thing you can do is change the level of transparency on a marking layer. Let's change the transparency of the agouti layer that is composited over the black base layer. <?php $path = "./img/"; $img = new Imagick( $path . "/base.png" ); $imgagouti = new Imagick( $path . "agouti.png" ); $imgagouti->evaluateImage(Imagick::EVALUATE_MULTIPLY, 0.5, Imagick::CHANNEL_ALPHA); $img->compositeImage($imgagouti, Imagick::COMPOSITE_DEFAULT, 0, 0); $imgdetails = new Imagick( $path . "details.png" ); $img->compositeImage($imgdetails, Imagick::COMPOSITE_DEFAULT, 0, 0); $imgeye = new Imagick( $path . "eye.png" ); $img->compositeImage($imgeye, Imagick::COMPOSITE_DEFAULT, 0, 0); $imgpupil = new Imagick( $path . "pupil.png" ); $img->compositeImage($imgpupil, Imagick::COMPOSITE_DEFAULT, 0, 0); $imgshading = new Imagick( $path . "shading.png" ); $img->compositeImage($imgshading, Imagick::COMPOSITE_MULTIPLY, 0, 0); $imglines = new Imagick( $path . "lines.png" ); $img->compositeImage($imglines, Imagick::COMPOSITE_DEFAULT, 0, 0); $imgwatermark = new Imagick( $path . "watermark.png" ); $img->compositeImage($imgwatermark, Imagick::COMPOSITE_DEFAULT, 0, 0); header('Content-type: image/png'); echo $img; ?> Now we have the agouti layer set to 50% its normal opacity, allowing for the black base to show through 50% more and resulting in a darker colored rabbit. You can still see the agouti layer, but it's half as strong. You can adjust this to whatever you want by editing the 0.5 to another number. GRADIENTS - Adding More Color You can also add gradients with Imagick using the newPseudoImage function. <?php $path = "./img/"; $img = new Imagick( $path . "/base.png" ); $gradient = new Imagick(); $gradient->newPseudoImage(400, 400, 'gradient:rgba(255,0,0)-none'); $img->compositeImage($gradient, Imagick::COMPOSITE_ATOP, 0, 0); $imgdetails = new Imagick( $path . "details.png" ); $img->compositeImage($imgdetails, Imagick::COMPOSITE_DEFAULT, 0, 0); $imgeye = new Imagick( $path . "eye.png" ); $img->compositeImage($imgeye, Imagick::COMPOSITE_DEFAULT, 0, 0); $imgpupil = new Imagick( $path . "pupil.png" ); $img->compositeImage($imgpupil, Imagick::COMPOSITE_DEFAULT, 0, 0); $imgshading = new Imagick( $path . "shading.png" ); $img->compositeImage($imgshading, Imagick::COMPOSITE_MULTIPLY, 0, 0); $imglines = new Imagick( $path . "lines.png" ); $img->compositeImage($imglines, Imagick::COMPOSITE_DEFAULT, 0, 0); $imgwatermark = new Imagick( $path . "watermark.png" ); $img->compositeImage($imgwatermark, Imagick::COMPOSITE_DEFAULT, 0, 0); header('Content-type: image/png'); echo $img; ?> Now we have a black rabbit with a red vertical gradient. Change the RBG value to whatever color you want for the gradient part. We can also add the agouti layer (as you can see, it works with markings) and have the gradient go over or under the marking depending on the order we composite the layers. Above image has no agouti marking. Above image has the agouti marking underneathe the gradient. Above image has the agouti marking above the gradient. You can also do other types of gradients such as radial with radial-gradient:rgba(255,0,0)-none. FRACTALS - Adding Even More Color You can do a lot of other nifty stuff with newPseudoImage such as fractals. <?php $path = "./img/"; $img = new Imagick( $path . "/base.png" ); $imgfractal = new Imagick(); $imgfractal->newPseudoImage(400,400, "plasma:fractal "); $img->compositeImage($imgfractal, Imagick::COMPOSITE_ATOP, 0, 0); $imgdetails = new Imagick( $path . "details.png" ); $img->compositeImage($imgdetails, Imagick::COMPOSITE_DEFAULT, 0, 0); $imgeye = new Imagick( $path . "eye.png" ); $img->compositeImage($imgeye, Imagick::COMPOSITE_DEFAULT, 0, 0); $imgpupil = new Imagick( $path . "pupil.png" ); $img->compositeImage($imgpupil, Imagick::COMPOSITE_DEFAULT, 0, 0); $imgshading = new Imagick( $path . "shading.png" ); $img->compositeImage($imgshading, Imagick::COMPOSITE_MULTIPLY, 0, 0); $imglines = new Imagick( $path . "lines.png" ); $img->compositeImage($imglines, Imagick::COMPOSITE_DEFAULT, 0, 0); $imgwatermark = new Imagick( $path . "watermark.png" ); $img->compositeImage($imgwatermark, Imagick::COMPOSITE_DEFAULT, 0, 0); header('Content-type: image/png'); echo $img; ?> Now we have fancy randomly generated colors.
  12. SPOTS - Cutouts & Variations What if you want to make a spotted animal, like this English Spot rabbit? You could draw spots on, but what if you want the spots to be the color of the animal's genotype (minus spotted factor)? AND you want variation for the spots? Step One - Prepare Layers For these layers, we'll draw where we want the spots to go. We'll have two different variations, spots0.png and spots1.png. Step Two - Add One Now let's add the spots0.png layer. If you read the tutorial above, you'll see that we created a solid white rabbit (albino) by adding a copy of the base layer that goes over the other markings. We're going to reuse this white layer for the English rabbits by cutting spots out of it. <?php $path = "./img/"; $img = new Imagick( $path . "/base.png" ); $imgalbino = new Imagick( $path . "base.png" ); $clut = new Imagick(); $clut->newImage(1, 1, new ImagickPixel('#FFF')); $imgalbino->clutImage($clut); $clut->destroy(); $imgspots = new Imagick( $path . "/spots0.png" ); $imgalbino->compositeImage($imgspots, Imagick::COMPOSITE_DSTOUT, 0, 0); $img->compositeImage($imgalbino, Imagick::COMPOSITE_DEFAULT, 0, 0); $imgdetails = new Imagick( $path . "details.png" ); $img->compositeImage($imgdetails, Imagick::COMPOSITE_DEFAULT, 0, 0); $imgeye = new Imagick( $path . "eye.png" ); $img->compositeImage($imgeye, Imagick::COMPOSITE_DEFAULT, 0, 0); $imgpupil = new Imagick( $path . "pupil.png" ); $img->compositeImage($imgpupil, Imagick::COMPOSITE_DEFAULT, 0, 0); $imgshading = new Imagick( $path . "shading.png" ); $img->compositeImage($imgshading, Imagick::COMPOSITE_MULTIPLY, 0, 0); $imglines = new Imagick( $path . "lines.png" ); $img->compositeImage($imglines, Imagick::COMPOSITE_DEFAULT, 0, 0); $imgwatermark = new Imagick( $path . "watermark.png" ); $img->compositeImage($imgwatermark, Imagick::COMPOSITE_DEFAULT, 0, 0); header('Content-type: image/png'); echo $img; ?> The spots layer composites over the albino layer with COMPOSITE_DSTOUT instead of COMPOSITE_DEFAULT, causing the spots to be cut out of the albino layer. We then composite the resulting 'updated' albino layer (with the spots cut out) onto the $img. Thus, we now have an English Spot: If we add the marking layers in, we can get any color to show where the spots are. Not just black spots. Step Three - Add Variation Variable Add a variable to the scripts like we did with genetics in the above tutoorial. <?php echo "<img src='img.php?spotnum=$spotnum'>"; ?> $spotnum will either be 0 or 1, which is in the filename for the spots. Now add the GET variable to your Imagick script like we did above. <?php $path = "./img/"; $spotnum = $_GET["spotnum"]; $img = new Imagick( $path . "/base.png" ); $imgalbino = new Imagick( $path . "base.png" ); $clut = new Imagick(); $clut->newImage(1, 1, new ImagickPixel('#FFF')); $imgalbino->clutImage($clut); $clut->destroy(); $imgspots = new Imagick( $path . "/spots" . $spotnum . ".png" ); $imgalbino->compositeImage($imgspots, Imagick::COMPOSITE_DSTOUT, 0, 0); $img->compositeImage($imgalbino, Imagick::COMPOSITE_DEFAULT, 0, 0); $imgdetails = new Imagick( $path . "details.png" ); $img->compositeImage($imgdetails, Imagick::COMPOSITE_DEFAULT, 0, 0); $imgeye = new Imagick( $path . "eye.png" ); $img->compositeImage($imgeye, Imagick::COMPOSITE_DEFAULT, 0, 0); $imgpupil = new Imagick( $path . "pupil.png" ); $img->compositeImage($imgpupil, Imagick::COMPOSITE_DEFAULT, 0, 0); $imgshading = new Imagick( $path . "shading.png" ); $img->compositeImage($imgshading, Imagick::COMPOSITE_MULTIPLY, 0, 0); $imglines = new Imagick( $path . "lines.png" ); $img->compositeImage($imglines, Imagick::COMPOSITE_DEFAULT, 0, 0); $imgwatermark = new Imagick( $path . "watermark.png" ); $img->compositeImage($imgwatermark, Imagick::COMPOSITE_DEFAULT, 0, 0); header('Content-type: image/png'); echo $img; ?> And now we get both variations depending on what number the animal has in their data.
  13. COLORING & MARKINGS - Mendelian Genetics There's a lot of ways you can handle markings and layers. We include semi-realistic Mendelian genetics on Warrenz, so I'll go over how to handle three different gene expressions in this part. I'm using rabbits as an example, but you can apply the same coding concepts to different species even though they have different genetics. TURNING LAYERS OFF AND ON We'll start with the basics, using the A Locus to turn layers off and on in a way that mimics real life. There's more to the genotype than just the A locus, but you don't need the entire genotype for a working code. You can add other genes later. Here' a real life agouti rabbit. ANd here's a tan pattern (same genotype aside from the A locus). And again, same genotype on this one except he's a self (A locus). So self has no markings, tan has just the cream underbelly, and agouti has cream underbelly and an additional brown layer. Let's do it! Step One In order to tell the program which genes your animal has, you need to pass the variables into your Imagick script. This can be done with $_GET. Edit your profile.php (or whenever you're displaying the image) to include the locus variable. <?php echo "<img src='img.php?alocus=$alocus'>"; ?> The $alocus variable will need to be assigned of course. I'm not going to go over scripts for genetics in this tutorial, just the Imagick parts, so I'm assuming you already have a method telling the locus what to be. In this case, it will ether be agouti, tan, or self. Step Two So back to the Imagick script, add the variable for the locus and then add some if statements to make that locus determine which layers get turned on. <?php $path = "./img/"; $alocus = $_GET["alocus"]; $img = new Imagick( $path . "/base.png" ); if ($alocus == 'agouti') { $imgagouti = new Imagick( $path . "agouti.png" ); $img->compositeImage($imgagouti, Imagick::COMPOSITE_DEFAULT, 0, 0); } if ($alocus == 'agouti' or $alocus == 'tan') { $imgotter = new Imagick( $path . "otter.png" ); $img->compositeImage($imgotter, Imagick::COMPOSITE_DEFAULT, 0, 0); } $imgdetails = new Imagick( $path . "details.png" ); $img->compositeImage($imgdetails, Imagick::COMPOSITE_DEFAULT, 0, 0); $imgeye = new Imagick( $path . "eye.png" ); $img->compositeImage($imgeye, Imagick::COMPOSITE_DEFAULT, 0, 0); $imgpupil = new Imagick( $path . "pupil.png" ); $img->compositeImage($imgpupil, Imagick::COMPOSITE_DEFAULT, 0, 0); $imgshading = new Imagick( $path . "shading.png" ); $img->compositeImage($imgshading, Imagick::COMPOSITE_MULTIPLY, 0, 0); $imglines = new Imagick( $path . "lines.png" ); $img->compositeImage($imglines, Imagick::COMPOSITE_DEFAULT, 0, 0); $imgwatermark = new Imagick( $path . "watermark.png" ); $img->compositeImage($imgwatermark, Imagick::COMPOSITE_DEFAULT, 0, 0); header('Content-type: image/png'); echo $img; ?> Bam! Now we have a dynamic rabbit that can be either agouti, tan, or self depending on the A locus. If $alocus is self (or not specificied at all), neither marking layers will show, resulting in a self colored rabbit. If $alocus is tan, we'll get the otter layer added. And if $alocus is agout, we'll get a rabbit with both otter and agouti layers active, resulting in a true agouti color. ALBINISM - Color Change & Adding Another Locus What if we wanted to make an albino? In real life, albinism is like a white sheet masking the rabbit's true color underneathe, so I like to do the same thing with Imagick (it's easier than trying to turn every layer white). Albinism is controlled in the C locus for rabbits, so here's how to add another locus. Add it to the image display file like we did before. Separate it from the previous one with an & symbol. You can continue to add as many more variables as you want layer using & symbols like this. <?php echo "<img src='img.php?alocus=$alocus&clocus=$clocus'>"; ?> Now, add the new variable to the Imagick file. We're also going to add a new layer right under the eye layer, and above the highest possible marking. This is a copy of the base layer, but we're turning it white so it goes over all the furry parts. The white layer will be activated if the C locus is set to albino. We are also going to add a color change to the eye and pupil layers if C locus is albino, creating red eyes. <?php $path = "./img/"; $alocus = $_GET["alocus"]; $clocus = $_GET["clocus"]; $img = new Imagick( $path . "/base.png" ); if ($alocus == 'agouti') { $imgagouti = new Imagick( $path . "agouti.png" ); $img->compositeImage($imgagouti, Imagick::COMPOSITE_DEFAULT, 0, 0); } if ($alocus == 'agouti' or $alocus == 'tan') { $imgotter = new Imagick( $path . "otter.png" ); $img->compositeImage($imgotter, Imagick::COMPOSITE_DEFAULT, 0, 0); } if ($clocus == 'albino') { $imgalbino = new Imagick( $path . "base.png" ); $clut = new Imagick(); $clut->newImage(1, 1, new ImagickPixel('#FFF')); $imgalbino->clutImage($clut); $clut->destroy(); $img->compositeImage($imgalbino, Imagick::COMPOSITE_DEFAULT, 0, 0); } $imgdetails = new Imagick( $path . "details.png" ); $img->compositeImage($imgdetails, Imagick::COMPOSITE_DEFAULT, 0, 0); $imgeye = new Imagick( $path . "eye.png" ); if ($clocus == 'albino') { $imgeye->modulateImage(150, 100, 80); } $img->compositeImage($imgeye, Imagick::COMPOSITE_DEFAULT, 0, 0); $imgpupil = new Imagick( $path . "pupil.png" ); if ($clocus == 'albino') { $clut = new Imagick(); $clut->newImage(1, 1, new ImagickPixel('#811f32')); $imgpupil->clutImage($clut); $clut->destroy(); } $img->compositeImage($imgpupil, Imagick::COMPOSITE_DEFAULT, 0, 0); $imgshading = new Imagick( $path . "shading.png" ); $img->compositeImage($imgshading, Imagick::COMPOSITE_MULTIPLY, 0, 0); $imglines = new Imagick( $path . "lines.png" ); $img->compositeImage($imglines, Imagick::COMPOSITE_DEFAULT, 0, 0); $imgwatermark = new Imagick( $path . "watermark.png" ); $img->compositeImage($imgwatermark, Imagick::COMPOSITE_DEFAULT, 0, 0); header('Content-type: image/png'); echo $img; ?> And now we have an albino rabbit. Recoloring Options This shows two different options for recoloring your image layers. 1. Change hex with clut like we did to turn the base layer white and the pupil pink. This forces the hex value over the entirety of the layer, as opposed to modulation which simply adjusts the color, so the whole layer will be one color (works fine if you don't want to retain multiple colors or shades in a single layer). 2. Modulation, as used on the eye layer to retain the shading we have inside the eye layer itself. We don't want these all turning into one color. Since we use modulation for the eyes though, we do need to make sure every bunny on the site has the same hex values used in the artwork files for the eyes (otherwise the modulator would cause inconsistent colors). You don't have to worry about inconsistent colors when forcing hexes using clut, so that's a tradeoff I've found. Here's a picture showing off the eye layer without the modulation (the way it is in the source file), and with modulation to turn it pink with albinism. There you have those. Those are some of the basics for adding markings and adjusting colors. You can see how variables are passed into Imagick from an outside script, and how to manipulate layers using those variables. This can be expanded into the rest of your script for a more fleshed out system (and you don't need to use it strictly for genotypes, you can also just make a variable for tiger stripes for example and have that in there instead). Note: I know the shading on the white rabbit is a little harsh here. It's just the file I'm using, sorry about that. I forgot to lower the opacity in the shading art file a bit for this tutorial.
  14. Hello everyone. Per request, this thread will contain tutorials on how to use ImageMagick (an image layering system) with PHP for your petsite or SIM. You can use this tutorial for pets, creatures, human avatars, etc. (it should all work with the same kind of system). I assume you know a bit of basic PHP, but you don't have to know a lot. INTRODUCTION I'm Hare, aka Lunar. I'm a coder, artist, and owner of www.warrenz.net. I'll be using Warrenz for demonstration because I use ImageMagick for the rabbits on there. I've also worked with GD library and CSS layering, but won't be going over those here. COPYRIGHT The images used in this tutorial and copyrighted and belong to me. Do not use them outside the Terms of Service of www.warrenz.net or without my expressed, written permission. Now let's get on with the basics! WHY USE IMAGEMAGICK There are good alternatives to Imagick. The benefits of ImageMagick is that it's powerful (which is why I like it), but GD Library is a fast alternative (from my experience, the processing time is less). There's also CSS layering, which may be good if you don't need anything fancy. I'm not going to go over methods of layering in this tutorial, just know that there are other options out there that may work better for your needs. INSTALLATION I'm not going to go over the installation process. This tutorial assumes that you already have Imagick (the PHP extension of ImageMagick) installed on your server. If you're not sure whether Imagick is installed, you can check your PHP info page where it should be listed. I'm also going to assume you're using version 3.4.3 or later. BASIC TUTORIAL - Getting Started With Imagick Layering I'm going to start out with the most barebones code you can use for those who have never used Imagick and want to know how to get started. We'll combine a base layer with some lineart. STEP 1 - CREATE YOUR FILES You'll need two files. One file is going to contain your Imagick code, name it img.php or whatever you want to name it. The other is going to be a page on the site that displays the image (can any page you want to display them on, such as pet profile or wherever). We'll call it profile.php. On profile.php where the image is displayed, this is all you need to get started: <?php echo "<img src='img.php'>"; ?> This will display the image created in the img.php as a <img src=''> code. Now let's get some code into the img.php file: <?php $path = "./img/"; $img = new Imagick( $path . "/base.png" ); $imglines = new Imagick( $path . "lines.png" ); $img->compositeImage($imglines, Imagick::COMPOSITE_DEFAULT, 0, 0); header('Content-type: image/png'); echo $img; ?> The first line of code declares your file path. We're going to put all our images for the layering system in the img file on the site. The next line of code is the first layer that starts the image off. The base layer. The next line is for the next layer that will go on top of the base layer. Lineart. I also include the shine of the eyes in the lineart layer, but you don't have to do it that way. The compositeImage function is used here. It puts the $imglines layer on TOP of the $img (which is the base layer), combining the two into a single image ($img). Then we simply declare the image headers and echo the resulting $img. Congratulations! You completed the first tutorial and now have a basic layered image. BASIC TUTORIAL #2 - All My Layers + Multiply Shading So you know how to display an Imagick image, but you're not sure how to add more layers. You're going to need markings, shading, etc. Let's do it! We're going to combine ALL these layers and make some nice shading! This may look like it's going to be a lot of work, but actually, we're just going to copy paste the lineart layer over and over again. Your new ImageMagick code (img.pgp) with all the new layers: <?php $path = "./img/"; $img = new Imagick( $path . "/base.png" ); $imgagouti = new Imagick( $path . "agouti.png" ); $img->compositeImage($imgagouti, Imagick::COMPOSITE_DEFAULT, 0, 0); $imgotter = new Imagick( $path . "otter.png" ); $img->compositeImage($imgotter, Imagick::COMPOSITE_DEFAULT, 0, 0); $imgdetails = new Imagick( $path . "details.png" ); $img->compositeImage($imgdetails, Imagick::COMPOSITE_DEFAULT, 0, 0); $imgeye = new Imagick( $path . "eye.png" ); $img->compositeImage($imgeye, Imagick::COMPOSITE_DEFAULT, 0, 0); $imgpupil = new Imagick( $path . "pupil.png" ); $img->compositeImage($imgpupil, Imagick::COMPOSITE_DEFAULT, 0, 0); $imgshading = new Imagick( $path . "shading.png" ); $img->compositeImage($imgshading, Imagick::COMPOSITE_DEFAULT, 0, 0); $imglines = new Imagick( $path . "lines.png" ); $img->compositeImage($imglines, Imagick::COMPOSITE_DEFAULT, 0, 0); $imgwatermark = new Imagick( $path . "watermark.png" ); $img->compositeImage($imgwatermark, Imagick::COMPOSITE_DEFAULT, 0, 0); header('Content-type: image/png'); echo $img; ?> Look how we're adding one layer on top, one after another. Each one gets composited over the last, adding to the resulting $img. That's pretty much it. But wait: Why is this rabbit's shading blue? I use blue shading on Warrenz. However, we're going to switch the shading layer over to MULTIPLY. Where it says COMPOSITE_DEFAULT on the shading layer, change it to COMPOSITE_MULTIPLY. There, now we have a beautifully shaded rabbit! Multiply allows for very nice, vibrant colors. You don't have to use it, but I recommend it for more dynamic shading. That's it for now! I hope some of this is helpful.
×
×
  • Create New...

Important Information

By using this site, you agree to our Guidelines, Terms of Use, and Privacy Policy.