ELearn World - Learn the Tutorials online

In the previous tutorial , you learned how to create an image editor using CamanJS which can apply basic filters like contrast, brightness, and noise to an image. CamanJS also has some other built-in filters like Nostalgia, Pinhole, Sunrise, etc., which we applied directly to the image. In this tutorial, we will cover some more advanced features of the library like Layers, Blend Modes, and Events. Layers in CamanJS In the first tutorial, we only worked with a single layer which contained our image. All the filters that we applied only manipulated that main layer. CamanJS allows you to create multiple layers to enable you to edit your images in a more sophisticated manner. You can create nested layers, but they will always be applied on their parent layer like a stack. Whenever you create a new layer and apply it on the parent layer, the default blend mode used will be normal . You can create a new layer on the canvas using the newLayer() method. When you create a new layer, you ca...

A while back, I wrote some tutorials which described how to apply different kinds of filters and blend modes to an image using just CSS. This could be very helpful in situations where you want to show the grayscale, blurred, or high-contrast version of the same image. Instead of creating four different images, you could just apply these effects to the original image using a few lines of CSS.  Using CSS filters and blend modes works nicely in most cases. However, CSS doesn't modify the pixels of the image itself. In other words, the filters and blend modes or any other effects are not permanent.  If someone downloads an image with CSS filters applied to it, they will get the original image and not the modified version. This can be a major setback if you were planning on creating an image editor for your users. If you want the image modifications to be permanent and allow the user to download the modified image, you can use HTML5 canvas . The canvas element allows you to d...

In the first tutorial of our CamanJS image editor series, we only used built-in filters to edit our images . This limited us to some basic effects like brightness, contrast, and 18 other more complicated filters with names like Vintage, Sunrise, etc. They were all easy to apply, but we were not in full control of the individual pixels of the image we wanted to edit. In the second tutorial, we learned about layers and blend modes , which gave us more control over the images we were editing. For instance, you could add a new layer on the canvas, fill it with a color or image, and then place it over the parent layer with a blend mode applied to it. However, we were still not creating our own filters, and the blend modes we could apply were limited to the ones already provided by CamanJS. The aim of this tutorial will be to teach you how to create your own blend modes and filters. We will also address some bugs present in the library and how you can patch them when using CamanJS in y...

In the previous tutorial I examined how the guitar competes with other instruments in a typical band set-up because of overlapping frequencies.  I also offered solutions, such as: Choose a guitar wisely, as wood, pickups, and so on have a bearing on being heard When working with another guitarist, go for the opposite of their set-up, such as guitar, amplifier and so on Point the speakers at your head Put distance between yourself and other instruments, such as drums and keyboards In this tutorial I’ll explain the choosing and setting up an amplifier. Before starting with the input, consider the output. The Most Overlooked Part of the Sound Whilst choosing the right guitar, amp and effects is important, the guitar speaker is often ignored. After all, speakers are speakers, right. Wrong. My epiphany occurred at a guitar show when a Celestion demonstrator switched between three speaker cabinets whilst playing. Despite all being from the same manufacturer, the difference...

We started this series by learning how to animate HTML elements using mojs. In the second tutorial, we moved on to animation of built-in SVG shapes using the Shape module. The third tutorial  covered more ways of animating SVG shapes using the ShapeSwirl and stagger modules. Now, we will learn how to animate different SVG shapes in a burst formation using the Burst module. This tutorial will depend on concepts we covered in the previous three tutorials. If you have not already read them, I would suggest that you go through them first. Creating Basic Burst Animations The first thing that we need to do before we can create any burst animations is instantiate a Burst object. After that, we can just specify the values of different properties to control how the animation plays out. The names of a lot of properties in the Burst module are the same as the properties in the  Shape module. However, these properties perform very different tasks in this case. The left and r...

Overview This is part two out of two in a series on cleaning up data using Go. In part one, we covered the basic text facilities of Go and working with CSV files. In this tutorial, we'll dive into actual data cleaning.  We'll start by understanding the problem of messy data and coming up with a strategy, and then we'll look into verifying individual fields, fixing the data where possible, and deciding what to do about missing values. Data Cleaning Strategy A strategy for cleaning up data should dictate what to do when encountering invalid, messy, partial, or missing data. It should also determine what level of reporting is needed about the cleanup process.  The data we're focusing on here is tabular data, where each row is independent. There are no nested hierarchies or connections between different rows of data. A lot of real-world datasets have this nice property.  Remove The simplest approach for dealing with invalid data is to remove it. If any field is missi...