# GreasedLine advanced examples > Advanced scenarios/ideas using GreasedLine Source: https://doc.babylonjs.com/features/featuresDeepDive/mesh/creation/param/greased_line/greased_line_advanced ## GreasedLine advanced examples This page contains some ideas for using GreasedLine. ### Audio analyzer Shows how you can use `widths` and `offsets` to create a simple audio analyzer. There are two horizontal lines. The larger analyzer's widths and the smaller analyzer's offsets are changed according to the music's frequency data. It also shows how you can manually create a `RawTexture` for the `colors` option. The colors are animated simply by modifying the UV offset of the color texture. Please unmute the audio after the PG starts. - [Playground: Line audio analyzer](https://playground.babylonjs.com/#3N0IS0#2) - A line audio analyzer with GreasedLine. ### Circular audio analyzer A cool circular audio analyzer using one line. It uses `GreasedLineTools.GetCircleLinePoints` to get the points. Setting it to dash mode creates the sections. Adding calm colors and animating the color texture's UV in the opposite direction of the circle's rotation results in static colors on the circle. Modify the `widths` of the line according to the audio frequencies, and you get the audio analyzer. Finally, add some particles to make it cooler. Please unmute the audio after the PG starts. - [Playground: Circular audio analyzer](https://playground.babylonjs.com/#H1LRZ3#387) - A circle shaped audio analyzer with GreasedLine. ### Light speed Shows how to create a light speed effect using `widths`, `visibility`, and scaling the lines along the `z` axis. There are several lines drawn in `lazy` mode and joined into one mesh when the `updateLazy()` method is called. Visibility is set to a very low value so the lines appear as dots at the beginning (stars). Widths are also kept low at startup. Simply by increasing the visibility, widths, and scaling of the lines, the effect comes alive. Adjusting the glow value also helps make the effect more attractive. If you want a longer effect you can create more instances of the line mesh and start animating them just at the right time. You could also use only two instances and reuse them. Animate one, prepare the other, animate the second and prepare the first one. Repeat and you will get an infinite light speed effect. - [Playground: Light speed effect](https://playground.babylonjs.com/#7MN4LZ#16) - Light speed effect. ### Flower power Slowly revealing beautiful text drawn by flowers. Uses the `GreasedLineTools.GetPointsFromText` function to get the point coordinates of the drawn text. The text is then hidden, and only its line coordinates are used. `GreasedLineTools.GetPositionOnLineByVisibility` steps through the drawn text by incrementing the visibility value and adds animated `Sprite`s of flowers to slowly reveal the whole text. If your text is not complete and flowers are missing you have to increase the capacity of the `SpriteManager` or lower the density of the flowers by lowering the value at line 47. You can also alter the target size of the flowers in the `addFlower` function. - [Playground: Flower power](https://playground.babylonjs.com/#0637HC#3) - Drawing text with a nice flower effect. ### Lighting bolts These lightning bolts will make even Thor envious. It calculates the positions and widths of the bolts using a simple recursive algorithm and draws the lines. Add a bit of glow, and you get cool lightning. - [Playground: Lighting bolts](https://playground.babylonjs.com/#P5GH2C#13) - Create cool looking lighting bolts using GreasedLine. ### Sparks GreasedLine can be used to create sparks. First generate the path the sparks will follow. Create `GreasedLine`s, each with a random color from a predefined color palette and with different widths based on these paths. - [Playground: Simulating sparks - step 1](https://playground.babylonjs.com/#KIW47V#1) - A cool UFO surrounded by sparks created by GreasedLine - step 1. Now set to dash mode and set a `dashRatio` close to 1 so only a small part of the line will be visible in dash mode. Set the number of sparks along the line to an appropriate value. ```javascript useDash: true, dashRatio: 0.98, dashCount: 10 ``` - [Playground: Simulating sparks - step 2](https://playground.babylonjs.com/#KIW47V#2) - A cool UFO surrounded by sparks created by GreasedLine - step 2. Now start to animate the `dashOffset` property of the `line.greasedLineMaterial`. Add a glow effect as well. ```javascript scene.onBeforeRenderObservable.add(() => { const animRatio = scene.getAnimationRatio() for (let i = 0; i < sparkCount; i++) { sparks[i].line.greasedLineMaterial.dashOffset += sparks[i].speed * animRatio } }) ``` - [Playground: Simulating sparks - step 3](https://playground.babylonjs.com/#KIW47V#3) - A cool UFO surrounded by sparks created by GreasedLine - step 3. All we need to do now is add the UFO and some particles. - [Playground: Simulating sparks](https://playground.babylonjs.com/#KIW47V) - A cool UFO surrounded by sparks created by GreasedLine. ### Revealing text Shows how you can create revealing text using the `visibility` property. If the text appears already visible, just run the PG again by clicking the Play button. - [Playground: Revealing text](https://playground.babylonjs.com/#H1LRZ3#234) - The text is slowly drawn on the screen. ### Supernova A supernova like star using `GreasedLine`. It draws the main star, applies volumetric light scattering to it and adds two more outer regions to the star using a glow effect. All greased line meshes are then parented to a `TransformNode` which is rotated around the Z axis. - [Playground: Supernova](https://playground.babylonjs.com/#QZTX7A#7) - A supernova like star. ### Trees Just some vegetation drawn using GreasedLines. You will probably want to tweak the parameters to get a low-poly version of the tree, grass, or bush. Otherwise, this technique is not recommended for production because it generates a lot of geometry. The visual appearance is not always quite satisfying, but you can achieve good results by generating grass or bushes (remove the trunk of the tree). Instancing is highly recommended. Press PLAY to generate a new one. - [Playground: Trees](https://playground.babylonjs.com/#DEHK6P#3) - Parametric trees using GreasedLine. ### Recycle logo Simply by drawing a circle and setting the `widths` of the line in the right places to the right values we can create a recycle logo very easily. - [Playground: Recycle logo](https://playground.babylonjs.com/#H1LRZ3#240) - Recycle logo created using widths. ### Navigation path line or displaying wind/ocean currents Shows how you can draw navigation path lines or display currents in the air or water. This PG shows only one line, but you can of course draw as many as needed. The line uses an alpha texture that is animated by modifying the `uOffset` of the texture. - [Playground: Navigation path or Displaying currents](https://playground.babylonjs.com/#F2M8GA#5) - Shows how you can draw navigation path lines or display currents.