Sign in to follow this  
tfm

Coloring a 3D Surface

Recommended Posts

I have a 3D like the following: http://tabishfayyaz.googlepages.com/blackGraph.JPG How do I color them to give a picture like the following: http://tabishfayyaz.googlepages.com/colorGraph.JPG I create a mesh from a list of vertices. I heard coloring has something to do with normals but haven't been able to get my head working around that.

Share this post


Link to post
Share on other sites
Quote:
Original post by tfm
I create a mesh from a list of vertices. I heard coloring has something to do with normals but haven't been able to get my head working around that.
The normals only affect lighting, which affects colouring. For the effect in that image, you just want to set a vertex colour for each vertex, and the video card with blend the vertex volours across the triangle.

Share this post


Link to post
Share on other sites
You don't have to use normals here.

I would create a similar affect by defining three colors for the dimensions of the graph space, and then linearly interpolating the colors to determine the color at a certain vertex.

for example to determine a color at a certain vertex (0.5, 0.6, 0.2):

0.5 * red + 0.6 * green + 0.2 * yellow = the color at this vertex.

You might have to play around a little with that, it is hard to see from your colored graph exactly how the color changes according to the position it is at.

Share this post


Link to post
Share on other sites
It looks like it's just using a gradient from one colour to another along the x and y axes (independent of z).

ie: -x = blue, +x = green, -y = yellow, +y = magenta

GraphCalc for Windows has something very similar within its 3D graphing functionality.

My personal favourite method is to use Perlin noise to make a cow texture that is independent of all axes. It doesn't help with visualization, but it looks cool.

Share this post


Link to post
Share on other sites
@taby I would second your opinion.

the formula given by stevenmarky would most likely help in achieving that.

However as I'm using Mesh for my vertices and in the Mesh I use a Material object what property should I set for Material or I shouldn't just use it ?


and in order to tell me Mesh that I have vertices which store color information as well I would need to use the Diffuse tag along with Position in the following line ?

mesh = new Mesh(indices.Length, this.verticesFromMaple.Count, 0, VertexFormats.Position | VertexFormats.Diffuse , d3dManager.device);

Share this post


Link to post
Share on other sites
Based on the previous discussion I get the following. The regions are very well defined now which is not desired:

http://tabishfayyaz.googlepages.com/strictlyColoredGraph.JPG

The code which is used is this:

if(x<0 && y<0)
vertexPosColor = new CustomVertex.PositionColored(x, y, (float)z, Color.Blue.ToArgb() * Color.Magenta.ToArgb());
else if(x<0 && y>0)
vertexPosColor = new CustomVertex.PositionColored(x, y, (float)z, Color.Blue.ToArgb() * Color.Pink.ToArgb());
else if(x>0 && y<0)
vertexPosColor = new CustomVertex.PositionColored(x, y, (float)z, Color.Green.ToArgb() * Color.Yellow.ToArgb());
else if(x>0 && y>0)
vertexPosColor = new CustomVertex.PositionColored(x, y, (float)z, Color.Green.ToArgb() * Color.Magenta.ToArgb());

Share this post


Link to post
Share on other sites
At the moment you are just setting the different quadrants of the graph to different colors.
You need to multiply the colors by the position of the vertex.

I think your code should look more like the following:

vertexPosColor = new CustomVertex.PositionColored(x, y, (float)z, Color.Blue.ToArgb()*x + Color.Magenta.ToArgb()*y + Color.Green.ToArgb()*z);


This code is only correct if your graph is in the range 0-1 (In all axis). If not then you need to do some scaling and offsetting on the values you multiply the colors with.

I hope that helps.

Share this post


Link to post
Share on other sites
I'm just checking for negativity, why do you say its only correct for (0-1) ?
What you are saying I tried that already before trying the one which I showed. However using your technique the results are following:

http://tabishfayyaz.googlepages.com/multiColoredGraph.JPG

using only the following line of code for all points:
vertexPosColor = new CustomVertex.PositionColored(x, y, (float)z, (int)(Color.Blue.ToArgb() * x) + (int)(Color.Magenta.ToArgb() * y) + (int)(Color.Green.ToArgb() * z));

Share this post


Link to post
Share on other sites
You need to multiply the (r,g,b,a) components of each color seperately.
I'm not very familiar with C# so I'm not sure what the best way to do that is.
I hope somebody else can help with that.


I said it would only work in the range 0-1 because greater than 1 you would end up with a color component that is greater than full color and smaller than 0 you would end up with 'less than black', but all you have to do is scale appropriately and that isn't a problem.

Share this post


Link to post
Share on other sites
"You need to multiply the (r,g,b,a) components of each color seperately."

Can you elaborate more on that, I mean I get get the (r,g,b,a) of Color.Blue but what would be the operators involved in the equation among each other ?

Thank you very much

Share this post


Link to post
Share on other sites
Sure, sorry for not explaining more clearly:

If I have a color (r = 12 g = 100 b = 60) multiplying it by two should give (r = 24, g = 200. b=120).

So the function to do a color multiply looks something like this (pseudocode):
void multiply(color& c, float f)
{
c.r*=f;
c.g*=f;
c.b*=f;
}

If you use this instead of multiplying the whole number you should end up with something looking a bit better.


Share this post


Link to post
Share on other sites
I mean to say are you talking about something like this:


Color c = (Color.Blue.r*x + Color.Blue.g*x + Color.Blue.b.x + Color.Blue.a.x) *
(Color.Blue.r*y + Color.Blue.g*y + Color.Blue.b.y + Color.Blue.a.y)


if the above is what you mean then this doesn't work.

Share this post


Link to post
Share on other sites
Edit:
No I don't mean that, it seems like you just mixed all the color components together which I guess would just make a visual mess.

This is about smoothly interpolating between colors.

Since I can't help much with the C# code right now, I'll try helping you work it out yourself


0 0.2 0.4 0.6 0.8 1.0
black blue


Imagine our color is black at point 0 and blue at point 1, what color is it at point 0.4?

Easy, 0.4 * blue.
(r = 0.4 * 0, g = 0.4 * 0, b = 0.4 * 255)

answer: (0, 0, 102)

The only way this wouldn't work is if you did something wrong.

Share this post


Link to post
Share on other sites
But you see with the quadrants approach you were mentioning, where:
ie: -x = blue, +x = green, -y = yellow, +y = magenta

the colors get divided into 4 well defined portions and that is not what I want

if (realX < 0 && realY < 0)
{ }
else if (realX < 0 && realY > 0)
{ }
else if (realX > 0 && realY < 0)
{ }
else
{ }

Share this post


Link to post
Share on other sites
I never told you to take a quadrant approach.

In short I told you to multiply a color by a vertices position, and set this as the vertice color. No if statements are needed.

[Edited by - stevenmarky on August 20, 2007 10:43:08 AM]

Share this post


Link to post
Share on other sites
first of all Thanks for your help man

Do you have any idea of what is XY Shading & XYZ Shading ?

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

Sign in to follow this