Drawing Line using matrix OpenGL









up vote
1
down vote

favorite












I'm working on this shaders that I modified
but I wish to simply draw a line instead of this blur / bloom effect
I understood that is the Float d that is used as a modifier but how to get this simple line instead



I based my research on this shader



Will appreciate any help



Zoltan



#ifdef GL_ES
precision mediump float;
#endif

mat4 mat = mat4 (
vec4 ( Scale * SizeTpDwn , 0.0 , 0.0 , 0.0 ),
vec4 ( 0.0 , Scale * SizeLftRght , 0.0 , 0.0 ),
vec4 ( 0.0 , 0.0 , Scale , 0.0 ),
vec4 ( 0.0 , 0.0 , 0.0 , Scale ) );

vec2 pos;
vec4 linecol = vec4 (0.5 , 0.5 , 0.7 , 0.5);

vec4 col = vec4 ( 0.0, 0.0, 0.0, 1.0 );

void Line4 ( vec4 a, vec4 b );
void Line2 ( vec2 a, vec2 b );

void main( void )

pos = gl_FragCoord.xy / RENDERSIZE.xy;
pos -= .5;

//Line
Line4 ( vec4 ( LengthTX, MoveTX, .2 ,-.2), vec4 (LengthTX2, MoveTX2, .2, -.2 ) );
//Line4 ( vec4 ( MoveRX, LengthRY, .2 ,-.2 ),vec4 ( MoveRX2,LengthRY2, .2, -.2 ) );
//Line4 ( vec4 (MoveLX, LengthLY, .2 ,-.2 ),vec4 (MoveLX2,LengthLY2, .2, -.2 ) );
//Line4 ( vec4 ( LengthDX,MoveDX, .2 ,-.2), vec4 (LengthDX2,MoveDX2, .2, -.2 ) );

gl_FragColor = vec4( col.xyz, 1.0 );


void Line4 ( vec4 a, vec4 b )

a = mat * a;
//a.xyz /= 1.5 + a.w * 2.;
b = mat * b;
//b.xyz /= 1.5 + b.w * 2.;
Line2 ( a.xy , b.xy );


void Line2 ( vec2 a, vec2 b )

float dtc = (distance ( pos , a ) + distance ( pos , b ) - distance ( a , b )); //+ 1e-5);

//linecol = vec4 (0.5 , 0.5 , 0.7 , 0.5);
col += max ( 1. - pow ( dtc * 14. , 0.10 ) , -.10 );










share|improve this question























  • and how should we know what to do with uncomented undescribed foreighn code without any description what is input .... and what exactly you want as output. I assume you are renderig some QUAD covering area of your line so in fragment you need to compute perpendicular distance to your line and if bigger than half of line thickness discard it otherwise output its color... How is your line defined? what is the meaning of the functions and variables? no one will reverse engineer analyze your code as it si way much more work than implementing this from scratch. So +Close for now
    – Spektre
    Nov 10 at 8:51











  • sorry I'm a beginner I don't know every habits of programmation community. This code is a Interactive Shader Format based on OpenGL. The line defined use the mat4 (matrix)
    – CtrlZ
    Nov 10 at 9:55










  • That is nice but what is the meaning of the matrix line is usually set as 2 endpoints in graphics or a start point and direction/delta vector. Matrices are usually used with multiplication by vector so what should be the vector format? I expect some parametrization parameter like t ... without the background knowledge of what and how you does things we can only guess. Also I do not see any data passing so your line is hardcoded?
    – Spektre
    Nov 10 at 9:58







  • 1




    I based my research on this shaders : glslsandbox.com/e#50194.0 I wanted to understood how it works so I deleted a lot of function to keep at this a simple rectangle and now a simple line What I understood is that "Line4" is drawing the point and "Line2" using a vec2 give the line the colors using the "d" function
    – CtrlZ
    Nov 10 at 10:17







  • 1




    Well finally some small reference at least. I retracted the Close Vote. You should add the info from your last comment into your question (Not all the people read all the comments). btw from quick look at the link it looks like 4D tesseract ... if the case that might shine some small light on the matrix usage (used to convert from 4D into 2D preview even if it should be 5x5) see how should i handle (morphing) 4D objects in opengl?
    – Spektre
    Nov 10 at 10:42















up vote
1
down vote

favorite












I'm working on this shaders that I modified
but I wish to simply draw a line instead of this blur / bloom effect
I understood that is the Float d that is used as a modifier but how to get this simple line instead



I based my research on this shader



Will appreciate any help



Zoltan



#ifdef GL_ES
precision mediump float;
#endif

mat4 mat = mat4 (
vec4 ( Scale * SizeTpDwn , 0.0 , 0.0 , 0.0 ),
vec4 ( 0.0 , Scale * SizeLftRght , 0.0 , 0.0 ),
vec4 ( 0.0 , 0.0 , Scale , 0.0 ),
vec4 ( 0.0 , 0.0 , 0.0 , Scale ) );

vec2 pos;
vec4 linecol = vec4 (0.5 , 0.5 , 0.7 , 0.5);

vec4 col = vec4 ( 0.0, 0.0, 0.0, 1.0 );

void Line4 ( vec4 a, vec4 b );
void Line2 ( vec2 a, vec2 b );

void main( void )

pos = gl_FragCoord.xy / RENDERSIZE.xy;
pos -= .5;

//Line
Line4 ( vec4 ( LengthTX, MoveTX, .2 ,-.2), vec4 (LengthTX2, MoveTX2, .2, -.2 ) );
//Line4 ( vec4 ( MoveRX, LengthRY, .2 ,-.2 ),vec4 ( MoveRX2,LengthRY2, .2, -.2 ) );
//Line4 ( vec4 (MoveLX, LengthLY, .2 ,-.2 ),vec4 (MoveLX2,LengthLY2, .2, -.2 ) );
//Line4 ( vec4 ( LengthDX,MoveDX, .2 ,-.2), vec4 (LengthDX2,MoveDX2, .2, -.2 ) );

gl_FragColor = vec4( col.xyz, 1.0 );


void Line4 ( vec4 a, vec4 b )

a = mat * a;
//a.xyz /= 1.5 + a.w * 2.;
b = mat * b;
//b.xyz /= 1.5 + b.w * 2.;
Line2 ( a.xy , b.xy );


void Line2 ( vec2 a, vec2 b )

float dtc = (distance ( pos , a ) + distance ( pos , b ) - distance ( a , b )); //+ 1e-5);

//linecol = vec4 (0.5 , 0.5 , 0.7 , 0.5);
col += max ( 1. - pow ( dtc * 14. , 0.10 ) , -.10 );










share|improve this question























  • and how should we know what to do with uncomented undescribed foreighn code without any description what is input .... and what exactly you want as output. I assume you are renderig some QUAD covering area of your line so in fragment you need to compute perpendicular distance to your line and if bigger than half of line thickness discard it otherwise output its color... How is your line defined? what is the meaning of the functions and variables? no one will reverse engineer analyze your code as it si way much more work than implementing this from scratch. So +Close for now
    – Spektre
    Nov 10 at 8:51











  • sorry I'm a beginner I don't know every habits of programmation community. This code is a Interactive Shader Format based on OpenGL. The line defined use the mat4 (matrix)
    – CtrlZ
    Nov 10 at 9:55










  • That is nice but what is the meaning of the matrix line is usually set as 2 endpoints in graphics or a start point and direction/delta vector. Matrices are usually used with multiplication by vector so what should be the vector format? I expect some parametrization parameter like t ... without the background knowledge of what and how you does things we can only guess. Also I do not see any data passing so your line is hardcoded?
    – Spektre
    Nov 10 at 9:58







  • 1




    I based my research on this shaders : glslsandbox.com/e#50194.0 I wanted to understood how it works so I deleted a lot of function to keep at this a simple rectangle and now a simple line What I understood is that "Line4" is drawing the point and "Line2" using a vec2 give the line the colors using the "d" function
    – CtrlZ
    Nov 10 at 10:17







  • 1




    Well finally some small reference at least. I retracted the Close Vote. You should add the info from your last comment into your question (Not all the people read all the comments). btw from quick look at the link it looks like 4D tesseract ... if the case that might shine some small light on the matrix usage (used to convert from 4D into 2D preview even if it should be 5x5) see how should i handle (morphing) 4D objects in opengl?
    – Spektre
    Nov 10 at 10:42













up vote
1
down vote

favorite









up vote
1
down vote

favorite











I'm working on this shaders that I modified
but I wish to simply draw a line instead of this blur / bloom effect
I understood that is the Float d that is used as a modifier but how to get this simple line instead



I based my research on this shader



Will appreciate any help



Zoltan



#ifdef GL_ES
precision mediump float;
#endif

mat4 mat = mat4 (
vec4 ( Scale * SizeTpDwn , 0.0 , 0.0 , 0.0 ),
vec4 ( 0.0 , Scale * SizeLftRght , 0.0 , 0.0 ),
vec4 ( 0.0 , 0.0 , Scale , 0.0 ),
vec4 ( 0.0 , 0.0 , 0.0 , Scale ) );

vec2 pos;
vec4 linecol = vec4 (0.5 , 0.5 , 0.7 , 0.5);

vec4 col = vec4 ( 0.0, 0.0, 0.0, 1.0 );

void Line4 ( vec4 a, vec4 b );
void Line2 ( vec2 a, vec2 b );

void main( void )

pos = gl_FragCoord.xy / RENDERSIZE.xy;
pos -= .5;

//Line
Line4 ( vec4 ( LengthTX, MoveTX, .2 ,-.2), vec4 (LengthTX2, MoveTX2, .2, -.2 ) );
//Line4 ( vec4 ( MoveRX, LengthRY, .2 ,-.2 ),vec4 ( MoveRX2,LengthRY2, .2, -.2 ) );
//Line4 ( vec4 (MoveLX, LengthLY, .2 ,-.2 ),vec4 (MoveLX2,LengthLY2, .2, -.2 ) );
//Line4 ( vec4 ( LengthDX,MoveDX, .2 ,-.2), vec4 (LengthDX2,MoveDX2, .2, -.2 ) );

gl_FragColor = vec4( col.xyz, 1.0 );


void Line4 ( vec4 a, vec4 b )

a = mat * a;
//a.xyz /= 1.5 + a.w * 2.;
b = mat * b;
//b.xyz /= 1.5 + b.w * 2.;
Line2 ( a.xy , b.xy );


void Line2 ( vec2 a, vec2 b )

float dtc = (distance ( pos , a ) + distance ( pos , b ) - distance ( a , b )); //+ 1e-5);

//linecol = vec4 (0.5 , 0.5 , 0.7 , 0.5);
col += max ( 1. - pow ( dtc * 14. , 0.10 ) , -.10 );










share|improve this question















I'm working on this shaders that I modified
but I wish to simply draw a line instead of this blur / bloom effect
I understood that is the Float d that is used as a modifier but how to get this simple line instead



I based my research on this shader



Will appreciate any help



Zoltan



#ifdef GL_ES
precision mediump float;
#endif

mat4 mat = mat4 (
vec4 ( Scale * SizeTpDwn , 0.0 , 0.0 , 0.0 ),
vec4 ( 0.0 , Scale * SizeLftRght , 0.0 , 0.0 ),
vec4 ( 0.0 , 0.0 , Scale , 0.0 ),
vec4 ( 0.0 , 0.0 , 0.0 , Scale ) );

vec2 pos;
vec4 linecol = vec4 (0.5 , 0.5 , 0.7 , 0.5);

vec4 col = vec4 ( 0.0, 0.0, 0.0, 1.0 );

void Line4 ( vec4 a, vec4 b );
void Line2 ( vec2 a, vec2 b );

void main( void )

pos = gl_FragCoord.xy / RENDERSIZE.xy;
pos -= .5;

//Line
Line4 ( vec4 ( LengthTX, MoveTX, .2 ,-.2), vec4 (LengthTX2, MoveTX2, .2, -.2 ) );
//Line4 ( vec4 ( MoveRX, LengthRY, .2 ,-.2 ),vec4 ( MoveRX2,LengthRY2, .2, -.2 ) );
//Line4 ( vec4 (MoveLX, LengthLY, .2 ,-.2 ),vec4 (MoveLX2,LengthLY2, .2, -.2 ) );
//Line4 ( vec4 ( LengthDX,MoveDX, .2 ,-.2), vec4 (LengthDX2,MoveDX2, .2, -.2 ) );

gl_FragColor = vec4( col.xyz, 1.0 );


void Line4 ( vec4 a, vec4 b )

a = mat * a;
//a.xyz /= 1.5 + a.w * 2.;
b = mat * b;
//b.xyz /= 1.5 + b.w * 2.;
Line2 ( a.xy , b.xy );


void Line2 ( vec2 a, vec2 b )

float dtc = (distance ( pos , a ) + distance ( pos , b ) - distance ( a , b )); //+ 1e-5);

//linecol = vec4 (0.5 , 0.5 , 0.7 , 0.5);
col += max ( 1. - pow ( dtc * 14. , 0.10 ) , -.10 );







opengl glsl shader






share|improve this question















share|improve this question













share|improve this question




share|improve this question








edited Nov 10 at 13:45









Spektre

28.9k645201




28.9k645201










asked Nov 9 at 23:39









CtrlZ

62




62











  • and how should we know what to do with uncomented undescribed foreighn code without any description what is input .... and what exactly you want as output. I assume you are renderig some QUAD covering area of your line so in fragment you need to compute perpendicular distance to your line and if bigger than half of line thickness discard it otherwise output its color... How is your line defined? what is the meaning of the functions and variables? no one will reverse engineer analyze your code as it si way much more work than implementing this from scratch. So +Close for now
    – Spektre
    Nov 10 at 8:51











  • sorry I'm a beginner I don't know every habits of programmation community. This code is a Interactive Shader Format based on OpenGL. The line defined use the mat4 (matrix)
    – CtrlZ
    Nov 10 at 9:55










  • That is nice but what is the meaning of the matrix line is usually set as 2 endpoints in graphics or a start point and direction/delta vector. Matrices are usually used with multiplication by vector so what should be the vector format? I expect some parametrization parameter like t ... without the background knowledge of what and how you does things we can only guess. Also I do not see any data passing so your line is hardcoded?
    – Spektre
    Nov 10 at 9:58







  • 1




    I based my research on this shaders : glslsandbox.com/e#50194.0 I wanted to understood how it works so I deleted a lot of function to keep at this a simple rectangle and now a simple line What I understood is that "Line4" is drawing the point and "Line2" using a vec2 give the line the colors using the "d" function
    – CtrlZ
    Nov 10 at 10:17







  • 1




    Well finally some small reference at least. I retracted the Close Vote. You should add the info from your last comment into your question (Not all the people read all the comments). btw from quick look at the link it looks like 4D tesseract ... if the case that might shine some small light on the matrix usage (used to convert from 4D into 2D preview even if it should be 5x5) see how should i handle (morphing) 4D objects in opengl?
    – Spektre
    Nov 10 at 10:42

















  • and how should we know what to do with uncomented undescribed foreighn code without any description what is input .... and what exactly you want as output. I assume you are renderig some QUAD covering area of your line so in fragment you need to compute perpendicular distance to your line and if bigger than half of line thickness discard it otherwise output its color... How is your line defined? what is the meaning of the functions and variables? no one will reverse engineer analyze your code as it si way much more work than implementing this from scratch. So +Close for now
    – Spektre
    Nov 10 at 8:51











  • sorry I'm a beginner I don't know every habits of programmation community. This code is a Interactive Shader Format based on OpenGL. The line defined use the mat4 (matrix)
    – CtrlZ
    Nov 10 at 9:55










  • That is nice but what is the meaning of the matrix line is usually set as 2 endpoints in graphics or a start point and direction/delta vector. Matrices are usually used with multiplication by vector so what should be the vector format? I expect some parametrization parameter like t ... without the background knowledge of what and how you does things we can only guess. Also I do not see any data passing so your line is hardcoded?
    – Spektre
    Nov 10 at 9:58







  • 1




    I based my research on this shaders : glslsandbox.com/e#50194.0 I wanted to understood how it works so I deleted a lot of function to keep at this a simple rectangle and now a simple line What I understood is that "Line4" is drawing the point and "Line2" using a vec2 give the line the colors using the "d" function
    – CtrlZ
    Nov 10 at 10:17







  • 1




    Well finally some small reference at least. I retracted the Close Vote. You should add the info from your last comment into your question (Not all the people read all the comments). btw from quick look at the link it looks like 4D tesseract ... if the case that might shine some small light on the matrix usage (used to convert from 4D into 2D preview even if it should be 5x5) see how should i handle (morphing) 4D objects in opengl?
    – Spektre
    Nov 10 at 10:42
















and how should we know what to do with uncomented undescribed foreighn code without any description what is input .... and what exactly you want as output. I assume you are renderig some QUAD covering area of your line so in fragment you need to compute perpendicular distance to your line and if bigger than half of line thickness discard it otherwise output its color... How is your line defined? what is the meaning of the functions and variables? no one will reverse engineer analyze your code as it si way much more work than implementing this from scratch. So +Close for now
– Spektre
Nov 10 at 8:51





and how should we know what to do with uncomented undescribed foreighn code without any description what is input .... and what exactly you want as output. I assume you are renderig some QUAD covering area of your line so in fragment you need to compute perpendicular distance to your line and if bigger than half of line thickness discard it otherwise output its color... How is your line defined? what is the meaning of the functions and variables? no one will reverse engineer analyze your code as it si way much more work than implementing this from scratch. So +Close for now
– Spektre
Nov 10 at 8:51













sorry I'm a beginner I don't know every habits of programmation community. This code is a Interactive Shader Format based on OpenGL. The line defined use the mat4 (matrix)
– CtrlZ
Nov 10 at 9:55




sorry I'm a beginner I don't know every habits of programmation community. This code is a Interactive Shader Format based on OpenGL. The line defined use the mat4 (matrix)
– CtrlZ
Nov 10 at 9:55












That is nice but what is the meaning of the matrix line is usually set as 2 endpoints in graphics or a start point and direction/delta vector. Matrices are usually used with multiplication by vector so what should be the vector format? I expect some parametrization parameter like t ... without the background knowledge of what and how you does things we can only guess. Also I do not see any data passing so your line is hardcoded?
– Spektre
Nov 10 at 9:58





That is nice but what is the meaning of the matrix line is usually set as 2 endpoints in graphics or a start point and direction/delta vector. Matrices are usually used with multiplication by vector so what should be the vector format? I expect some parametrization parameter like t ... without the background knowledge of what and how you does things we can only guess. Also I do not see any data passing so your line is hardcoded?
– Spektre
Nov 10 at 9:58





1




1




I based my research on this shaders : glslsandbox.com/e#50194.0 I wanted to understood how it works so I deleted a lot of function to keep at this a simple rectangle and now a simple line What I understood is that "Line4" is drawing the point and "Line2" using a vec2 give the line the colors using the "d" function
– CtrlZ
Nov 10 at 10:17





I based my research on this shaders : glslsandbox.com/e#50194.0 I wanted to understood how it works so I deleted a lot of function to keep at this a simple rectangle and now a simple line What I understood is that "Line4" is drawing the point and "Line2" using a vec2 give the line the colors using the "d" function
– CtrlZ
Nov 10 at 10:17





1




1




Well finally some small reference at least. I retracted the Close Vote. You should add the info from your last comment into your question (Not all the people read all the comments). btw from quick look at the link it looks like 4D tesseract ... if the case that might shine some small light on the matrix usage (used to convert from 4D into 2D preview even if it should be 5x5) see how should i handle (morphing) 4D objects in opengl?
– Spektre
Nov 10 at 10:42





Well finally some small reference at least. I retracted the Close Vote. You should add the info from your last comment into your question (Not all the people read all the comments). btw from quick look at the link it looks like 4D tesseract ... if the case that might shine some small light on the matrix usage (used to convert from 4D into 2D preview even if it should be 5x5) see how should i handle (morphing) 4D objects in opengl?
– Spektre
Nov 10 at 10:42













1 Answer
1






active

oldest

votes

















up vote
2
down vote













What you have to do is to find the closest distance of the current fragment to the line. If this distance is smaller than the half line thickness, then the fragment is on the line.

To create a line with sharp edges, I recommend to use the step function, which returns 0.0, if a value is smaller than a reference value and 1.0 otherwise.

Th draw a line which is not endless, you have to check if the point on the endless line, which is closest to the current position, is in between the start and the end of the line:



void Line2 (vec2 L1, vec2 L2)

vec2 P = pos;
vec2 O = L1;
vec2 D = normalize(L2-L1);
float d = dot(P-O, D);
vec2 X = L1 + D * d;

float dtc;
if (d < 0.0)
dtc = distance(L1, P); // d < 0.0 -> X is "before" L1
else if (d > distance(L1, L2))
dtc = distance(L2, P); // d > distance(L1, L2) -> X is "after" L2
else
dtc = distance(pos, X);

col += 1.0 - step(0.01, dtc);



Preview



line




Explanation:



Lets assume, that the line is defined by a Point O and a Unit vector D with gives the direction of the line. Note the length of a unit vector is 1.



Further you have the point P and you want to find the closest point X on the line (O, D) to P.



First calculate a vector V from O to P:



V = P - O;


The distance d from O to the intersection point X can be calculated by the Dot product.
Note, since D is a unit vector, the dot prduct of V and D is equal the cosine of the angle between the line (O, D) and the vector V, multiplied by the amount (length) of V:



d = dot(V, D);


The intersection point X, can be calculated by shifting the point O along the line (D) by the distance d:



X = O + D * d; 


So the formula for the intersection point is:



O ... any point on the line
D ... unit vector which points in the direction of the line
P ... the "Point"

X = O + D * dot(P-O, D);






Note, if the line is defined by 2 points, L1 and L2 then the unit vector D can be calcualted as follows:



D = normalize(L2-L1);





share|improve this answer






















  • Oh thank you for your answer. I'm going to scratch my head on it to understand everything but sure It's going to help ! Keep you in touch
    – CtrlZ
    Nov 10 at 10:21










  • it works perfectly ! I was stuck since one week on it ! Thank you so much Now I have to understand it :)
    – CtrlZ
    Nov 10 at 10:31










  • Done Yes I understood that there was a threshold using distance but could not find the solution as I'm a newbie in programmation ^^
    – CtrlZ
    Nov 10 at 10:42






  • 1




    @ I tried to add some more explanations to the answer. I think the key to understand the solution is the sketch at the end of the answer an he understanding of the Dot product.
    – Rabbid76
    Nov 10 at 10:46










Your Answer






StackExchange.ifUsing("editor", function ()
StackExchange.using("externalEditor", function ()
StackExchange.using("snippets", function ()
StackExchange.snippets.init();
);
);
, "code-snippets");

StackExchange.ready(function()
var channelOptions =
tags: "".split(" "),
id: "1"
;
initTagRenderer("".split(" "), "".split(" "), channelOptions);

StackExchange.using("externalEditor", function()
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled)
StackExchange.using("snippets", function()
createEditor();
);

else
createEditor();

);

function createEditor()
StackExchange.prepareEditor(
heartbeatType: 'answer',
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader:
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
,
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
);



);













 

draft saved


draft discarded


















StackExchange.ready(
function ()
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53234632%2fdrawing-line-using-matrix-opengl%23new-answer', 'question_page');

);

Post as a guest















Required, but never shown

























1 Answer
1






active

oldest

votes








1 Answer
1






active

oldest

votes









active

oldest

votes






active

oldest

votes








up vote
2
down vote













What you have to do is to find the closest distance of the current fragment to the line. If this distance is smaller than the half line thickness, then the fragment is on the line.

To create a line with sharp edges, I recommend to use the step function, which returns 0.0, if a value is smaller than a reference value and 1.0 otherwise.

Th draw a line which is not endless, you have to check if the point on the endless line, which is closest to the current position, is in between the start and the end of the line:



void Line2 (vec2 L1, vec2 L2)

vec2 P = pos;
vec2 O = L1;
vec2 D = normalize(L2-L1);
float d = dot(P-O, D);
vec2 X = L1 + D * d;

float dtc;
if (d < 0.0)
dtc = distance(L1, P); // d < 0.0 -> X is "before" L1
else if (d > distance(L1, L2))
dtc = distance(L2, P); // d > distance(L1, L2) -> X is "after" L2
else
dtc = distance(pos, X);

col += 1.0 - step(0.01, dtc);



Preview



line




Explanation:



Lets assume, that the line is defined by a Point O and a Unit vector D with gives the direction of the line. Note the length of a unit vector is 1.



Further you have the point P and you want to find the closest point X on the line (O, D) to P.



First calculate a vector V from O to P:



V = P - O;


The distance d from O to the intersection point X can be calculated by the Dot product.
Note, since D is a unit vector, the dot prduct of V and D is equal the cosine of the angle between the line (O, D) and the vector V, multiplied by the amount (length) of V:



d = dot(V, D);


The intersection point X, can be calculated by shifting the point O along the line (D) by the distance d:



X = O + D * d; 


So the formula for the intersection point is:



O ... any point on the line
D ... unit vector which points in the direction of the line
P ... the "Point"

X = O + D * dot(P-O, D);






Note, if the line is defined by 2 points, L1 and L2 then the unit vector D can be calcualted as follows:



D = normalize(L2-L1);





share|improve this answer






















  • Oh thank you for your answer. I'm going to scratch my head on it to understand everything but sure It's going to help ! Keep you in touch
    – CtrlZ
    Nov 10 at 10:21










  • it works perfectly ! I was stuck since one week on it ! Thank you so much Now I have to understand it :)
    – CtrlZ
    Nov 10 at 10:31










  • Done Yes I understood that there was a threshold using distance but could not find the solution as I'm a newbie in programmation ^^
    – CtrlZ
    Nov 10 at 10:42






  • 1




    @ I tried to add some more explanations to the answer. I think the key to understand the solution is the sketch at the end of the answer an he understanding of the Dot product.
    – Rabbid76
    Nov 10 at 10:46














up vote
2
down vote













What you have to do is to find the closest distance of the current fragment to the line. If this distance is smaller than the half line thickness, then the fragment is on the line.

To create a line with sharp edges, I recommend to use the step function, which returns 0.0, if a value is smaller than a reference value and 1.0 otherwise.

Th draw a line which is not endless, you have to check if the point on the endless line, which is closest to the current position, is in between the start and the end of the line:



void Line2 (vec2 L1, vec2 L2)

vec2 P = pos;
vec2 O = L1;
vec2 D = normalize(L2-L1);
float d = dot(P-O, D);
vec2 X = L1 + D * d;

float dtc;
if (d < 0.0)
dtc = distance(L1, P); // d < 0.0 -> X is "before" L1
else if (d > distance(L1, L2))
dtc = distance(L2, P); // d > distance(L1, L2) -> X is "after" L2
else
dtc = distance(pos, X);

col += 1.0 - step(0.01, dtc);



Preview



line




Explanation:



Lets assume, that the line is defined by a Point O and a Unit vector D with gives the direction of the line. Note the length of a unit vector is 1.



Further you have the point P and you want to find the closest point X on the line (O, D) to P.



First calculate a vector V from O to P:



V = P - O;


The distance d from O to the intersection point X can be calculated by the Dot product.
Note, since D is a unit vector, the dot prduct of V and D is equal the cosine of the angle between the line (O, D) and the vector V, multiplied by the amount (length) of V:



d = dot(V, D);


The intersection point X, can be calculated by shifting the point O along the line (D) by the distance d:



X = O + D * d; 


So the formula for the intersection point is:



O ... any point on the line
D ... unit vector which points in the direction of the line
P ... the "Point"

X = O + D * dot(P-O, D);






Note, if the line is defined by 2 points, L1 and L2 then the unit vector D can be calcualted as follows:



D = normalize(L2-L1);





share|improve this answer






















  • Oh thank you for your answer. I'm going to scratch my head on it to understand everything but sure It's going to help ! Keep you in touch
    – CtrlZ
    Nov 10 at 10:21










  • it works perfectly ! I was stuck since one week on it ! Thank you so much Now I have to understand it :)
    – CtrlZ
    Nov 10 at 10:31










  • Done Yes I understood that there was a threshold using distance but could not find the solution as I'm a newbie in programmation ^^
    – CtrlZ
    Nov 10 at 10:42






  • 1




    @ I tried to add some more explanations to the answer. I think the key to understand the solution is the sketch at the end of the answer an he understanding of the Dot product.
    – Rabbid76
    Nov 10 at 10:46












up vote
2
down vote










up vote
2
down vote









What you have to do is to find the closest distance of the current fragment to the line. If this distance is smaller than the half line thickness, then the fragment is on the line.

To create a line with sharp edges, I recommend to use the step function, which returns 0.0, if a value is smaller than a reference value and 1.0 otherwise.

Th draw a line which is not endless, you have to check if the point on the endless line, which is closest to the current position, is in between the start and the end of the line:



void Line2 (vec2 L1, vec2 L2)

vec2 P = pos;
vec2 O = L1;
vec2 D = normalize(L2-L1);
float d = dot(P-O, D);
vec2 X = L1 + D * d;

float dtc;
if (d < 0.0)
dtc = distance(L1, P); // d < 0.0 -> X is "before" L1
else if (d > distance(L1, L2))
dtc = distance(L2, P); // d > distance(L1, L2) -> X is "after" L2
else
dtc = distance(pos, X);

col += 1.0 - step(0.01, dtc);



Preview



line




Explanation:



Lets assume, that the line is defined by a Point O and a Unit vector D with gives the direction of the line. Note the length of a unit vector is 1.



Further you have the point P and you want to find the closest point X on the line (O, D) to P.



First calculate a vector V from O to P:



V = P - O;


The distance d from O to the intersection point X can be calculated by the Dot product.
Note, since D is a unit vector, the dot prduct of V and D is equal the cosine of the angle between the line (O, D) and the vector V, multiplied by the amount (length) of V:



d = dot(V, D);


The intersection point X, can be calculated by shifting the point O along the line (D) by the distance d:



X = O + D * d; 


So the formula for the intersection point is:



O ... any point on the line
D ... unit vector which points in the direction of the line
P ... the "Point"

X = O + D * dot(P-O, D);






Note, if the line is defined by 2 points, L1 and L2 then the unit vector D can be calcualted as follows:



D = normalize(L2-L1);





share|improve this answer














What you have to do is to find the closest distance of the current fragment to the line. If this distance is smaller than the half line thickness, then the fragment is on the line.

To create a line with sharp edges, I recommend to use the step function, which returns 0.0, if a value is smaller than a reference value and 1.0 otherwise.

Th draw a line which is not endless, you have to check if the point on the endless line, which is closest to the current position, is in between the start and the end of the line:



void Line2 (vec2 L1, vec2 L2)

vec2 P = pos;
vec2 O = L1;
vec2 D = normalize(L2-L1);
float d = dot(P-O, D);
vec2 X = L1 + D * d;

float dtc;
if (d < 0.0)
dtc = distance(L1, P); // d < 0.0 -> X is "before" L1
else if (d > distance(L1, L2))
dtc = distance(L2, P); // d > distance(L1, L2) -> X is "after" L2
else
dtc = distance(pos, X);

col += 1.0 - step(0.01, dtc);



Preview



line




Explanation:



Lets assume, that the line is defined by a Point O and a Unit vector D with gives the direction of the line. Note the length of a unit vector is 1.



Further you have the point P and you want to find the closest point X on the line (O, D) to P.



First calculate a vector V from O to P:



V = P - O;


The distance d from O to the intersection point X can be calculated by the Dot product.
Note, since D is a unit vector, the dot prduct of V and D is equal the cosine of the angle between the line (O, D) and the vector V, multiplied by the amount (length) of V:



d = dot(V, D);


The intersection point X, can be calculated by shifting the point O along the line (D) by the distance d:



X = O + D * d; 


So the formula for the intersection point is:



O ... any point on the line
D ... unit vector which points in the direction of the line
P ... the "Point"

X = O + D * dot(P-O, D);






Note, if the line is defined by 2 points, L1 and L2 then the unit vector D can be calcualted as follows:



D = normalize(L2-L1);






share|improve this answer














share|improve this answer



share|improve this answer








edited Nov 10 at 10:42

























answered Nov 10 at 9:59









Rabbid76

30.6k112842




30.6k112842











  • Oh thank you for your answer. I'm going to scratch my head on it to understand everything but sure It's going to help ! Keep you in touch
    – CtrlZ
    Nov 10 at 10:21










  • it works perfectly ! I was stuck since one week on it ! Thank you so much Now I have to understand it :)
    – CtrlZ
    Nov 10 at 10:31










  • Done Yes I understood that there was a threshold using distance but could not find the solution as I'm a newbie in programmation ^^
    – CtrlZ
    Nov 10 at 10:42






  • 1




    @ I tried to add some more explanations to the answer. I think the key to understand the solution is the sketch at the end of the answer an he understanding of the Dot product.
    – Rabbid76
    Nov 10 at 10:46
















  • Oh thank you for your answer. I'm going to scratch my head on it to understand everything but sure It's going to help ! Keep you in touch
    – CtrlZ
    Nov 10 at 10:21










  • it works perfectly ! I was stuck since one week on it ! Thank you so much Now I have to understand it :)
    – CtrlZ
    Nov 10 at 10:31










  • Done Yes I understood that there was a threshold using distance but could not find the solution as I'm a newbie in programmation ^^
    – CtrlZ
    Nov 10 at 10:42






  • 1




    @ I tried to add some more explanations to the answer. I think the key to understand the solution is the sketch at the end of the answer an he understanding of the Dot product.
    – Rabbid76
    Nov 10 at 10:46















Oh thank you for your answer. I'm going to scratch my head on it to understand everything but sure It's going to help ! Keep you in touch
– CtrlZ
Nov 10 at 10:21




Oh thank you for your answer. I'm going to scratch my head on it to understand everything but sure It's going to help ! Keep you in touch
– CtrlZ
Nov 10 at 10:21












it works perfectly ! I was stuck since one week on it ! Thank you so much Now I have to understand it :)
– CtrlZ
Nov 10 at 10:31




it works perfectly ! I was stuck since one week on it ! Thank you so much Now I have to understand it :)
– CtrlZ
Nov 10 at 10:31












Done Yes I understood that there was a threshold using distance but could not find the solution as I'm a newbie in programmation ^^
– CtrlZ
Nov 10 at 10:42




Done Yes I understood that there was a threshold using distance but could not find the solution as I'm a newbie in programmation ^^
– CtrlZ
Nov 10 at 10:42




1




1




@ I tried to add some more explanations to the answer. I think the key to understand the solution is the sketch at the end of the answer an he understanding of the Dot product.
– Rabbid76
Nov 10 at 10:46




@ I tried to add some more explanations to the answer. I think the key to understand the solution is the sketch at the end of the answer an he understanding of the Dot product.
– Rabbid76
Nov 10 at 10:46

















 

draft saved


draft discarded















































 


draft saved


draft discarded














StackExchange.ready(
function ()
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53234632%2fdrawing-line-using-matrix-opengl%23new-answer', 'question_page');

);

Post as a guest















Required, but never shown





















































Required, but never shown














Required, but never shown












Required, but never shown







Required, but never shown

































Required, but never shown














Required, but never shown












Required, but never shown







Required, but never shown







Popular posts from this blog

Use pre created SQLite database for Android project in kotlin

Darth Vader #20

Ondo