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









New contributor




CtrlZ is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
Check out our Code of Conduct.




















  • 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
    21 hours ago












  • 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
    20 hours ago










  • 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
    20 hours ago








  • 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
    20 hours ago








  • 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
    19 hours ago

















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









New contributor




CtrlZ is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
Check out our Code of Conduct.




















  • 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
    21 hours ago












  • 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
    20 hours ago










  • 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
    20 hours ago








  • 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
    20 hours ago








  • 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
    19 hours ago















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









New contributor




CtrlZ is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
Check out our Code of Conduct.











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









New contributor




CtrlZ is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
Check out our Code of Conduct.











share|improve this question









New contributor




CtrlZ is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
Check out our Code of Conduct.









share|improve this question




share|improve this question








edited 16 hours ago









Spektre

28.6k645199




28.6k645199






New contributor




CtrlZ is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
Check out our Code of Conduct.









asked yesterday









CtrlZ

62




62




New contributor




CtrlZ is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
Check out our Code of Conduct.





New contributor





CtrlZ is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
Check out our Code of Conduct.






CtrlZ is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
Check out our Code of Conduct.












  • 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
    21 hours ago












  • 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
    20 hours ago










  • 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
    20 hours ago








  • 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
    20 hours ago








  • 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
    19 hours ago




















  • 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
    21 hours ago












  • 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
    20 hours ago










  • 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
    20 hours ago








  • 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
    20 hours ago








  • 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
    19 hours ago


















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
21 hours ago






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
21 hours ago














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
20 hours ago




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
20 hours ago












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
20 hours ago






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
20 hours ago






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
20 hours ago






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
20 hours ago






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
19 hours ago






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
19 hours ago














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
    20 hours ago










  • it works perfectly ! I was stuck since one week on it ! Thank you so much Now I have to understand it :)
    – CtrlZ
    20 hours ago










  • 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
    19 hours ago






  • 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
    19 hours ago











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
});


}
});






CtrlZ is a new contributor. Be nice, and check out our Code of Conduct.










 

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
































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
    20 hours ago










  • it works perfectly ! I was stuck since one week on it ! Thank you so much Now I have to understand it :)
    – CtrlZ
    20 hours ago










  • 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
    19 hours ago






  • 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
    19 hours ago















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
    20 hours ago










  • it works perfectly ! I was stuck since one week on it ! Thank you so much Now I have to understand it :)
    – CtrlZ
    20 hours ago










  • 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
    19 hours ago






  • 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
    19 hours ago













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 19 hours ago

























answered 20 hours ago









Rabbid76

29.3k112742




29.3k112742












  • 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
    20 hours ago










  • it works perfectly ! I was stuck since one week on it ! Thank you so much Now I have to understand it :)
    – CtrlZ
    20 hours ago










  • 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
    19 hours ago






  • 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
    19 hours ago


















  • 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
    20 hours ago










  • it works perfectly ! I was stuck since one week on it ! Thank you so much Now I have to understand it :)
    – CtrlZ
    20 hours ago










  • 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
    19 hours ago






  • 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
    19 hours ago
















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
20 hours ago




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
20 hours ago












it works perfectly ! I was stuck since one week on it ! Thank you so much Now I have to understand it :)
– CtrlZ
20 hours ago




it works perfectly ! I was stuck since one week on it ! Thank you so much Now I have to understand it :)
– CtrlZ
20 hours ago












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
19 hours ago




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
19 hours ago




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
19 hours ago




@ 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
19 hours ago










CtrlZ is a new contributor. Be nice, and check out our Code of Conduct.










 

draft saved


draft discarded


















CtrlZ is a new contributor. Be nice, and check out our Code of Conduct.













CtrlZ is a new contributor. Be nice, and check out our Code of Conduct.












CtrlZ is a new contributor. Be nice, and check out our Code of Conduct.















 


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




















































































Popular posts from this blog

Florida Star v. B. J. F.

Error while running script in elastic search , gateway timeout

Adding quotations to stringified JSON object values