# How to draw a diagonal sine wave line renderer

I'm trying to use a LineRenderer component to draw a sine wave from point A to B and I'm using mouse position. However what I did so far is not working as expected, it just draws a sine wave along the x-axis and it's not diagonal.

private void Update()
{
if (Input.GetMouseButtonDown(0))
{
Vector3 newPos = Camera.main.ScreenToWorldPoint(Input.mousePosition);
newPos.z = 0;
CreatePointMarker(newPos);
GenerateNewLine();
}
}

private void CreatePointMarker(Vector3 pointPosition)
{
Instantiate(linePointPrefab, pointPosition, Quaternion.identity);
}

private void GenerateNewLine()
{
GameObject[] allPoints = GameObject.FindGameObjectsWithTag("PointMarker");
Vector3[] allPointPositions = new Vector3[allPoints.Length];
var pointList = new List<Vector3>();
for (int i = 0; i < 50; i ++)
{
var dir = allPoints[0].transform.position - allPoints[1].transform.position;
float x = dir.x * i;
float y = Mathf.Sin(x * Time.time);
var sine = new Vector3(x, y, 0f);
var tangentLine = allPoints[0].transform.position + sine;
}
SpawnLineGenerator(pointList.ToArray());
}
private void SpawnLineGenerator(Vector3[] linePoints)
{
GameObject newLineGen = Instantiate(lineGeneratorPrefab);
LineRenderer lRend = newLineGen.GetComponent<LineRenderer>();

lRend.positionCount = linePoints.Length;
lRend.SetPositions(linePoints);
}

• I need a little clarification..Do you also want to draw the wave diagonally?? Commented Jun 13, 2019 at 19:54
• @ShuvroSarkar yes, if the second click mouse position is in a diagonal position then the wave must follow it. Commented Jun 13, 2019 at 23:03
• Possible duplicate of How to move a object to a target point like sine wave in 2D world Commented Jun 20, 2019 at 2:53
• Here's an example I made a while back for a similar question: jsfiddle.net/cobalthex/1h59mr4w Commented Jun 20, 2019 at 2:55

I simplified your code but the math is the same, hope it helps you:

using System.Collections.Generic;
using UnityEngine;
public class SineWaveGenerator : MonoBehaviour
{
public Transform A;
public Transform B;
public int Resolution = 50;
public Material material;
public float WaveScale = 1f;

Camera cam;
private void Start() {
cam = Camera.main;
}

private void Update()
{
if (Input.GetMouseButtonDown(0))
{
Vector3 newPos = cam.ScreenToWorldPoint(Input.mousePosition + cam.transform.forward * 10);
newPos.z = 0;
B.position = newPos;
}
GenerateLine(); //Moved it out to see the effect of WaveScale and Resolution
}
private void GenerateLine()
{
// Create or select a line renderer on the current game object
LineRenderer thisLineRenderer = GetComponent<LineRenderer>();
if(!thisLineRenderer)

// set visuals of the line renderer
thisLineRenderer.material = material;
thisLineRenderer.startWidth = thisLineRenderer.endWidth = 0.1f;
thisLineRenderer.startColor = thisLineRenderer.endColor = Color.white;

// set resolution of the line renderer
thisLineRenderer.positionCount = Resolution;

for(int i=0; i<Resolution; i++){
float Sin, Cos, rotatedX, rotatedY;
Vector3 dir = i*(B.position - A.position)/ Resolution;

float X = dir.magnitude;
float Y = Mathf.Sin(X * WaveScale);

float angle = Vector3.Angle(dir, Vector3.right) * Mathf.Deg2Rad;
Sin = Mathf.Sin(angle);
Cos = Mathf.Cos(angle);

if(dir.y > Vector3.right.y){
rotatedX = X * Cos - Y * Sin;
rotatedY = X * Sin + Y * Cos;
}else{
rotatedX = X * Cos + Y * Sin;
rotatedY = - X * Sin + Y * Cos;
}

thisLineRenderer.SetPosition(i, new Vector3(rotatedX, rotatedY, 0f));
}
}
}


Attach the code to a game object in an empty scene and add 2 more game objects called A and B and put them in the inspector, select default sprite material as your material and you can play with resolution and wave scale in the inspector to see the result.

I rotated the sin function with the Rotation Matrix:

https://en.wikipedia.org/wiki/Rotation_matrix