QCustomPlot Discussion and Comments

ColorMap gradient is not working like I am expecting.Return to overview

I am new with QCustomPlot. This is just an exercise. I am trying to set the Gradient for the colormap. It is quite possible that I just don't understand how the color map works. Please correct me if I am wrong.
I tried to create a gradient map with 4 colors (red, green, blue, yellow). These were just random color selection. I want to set the stop at every 25%. I just create a simple 1X4 grid with each row has a different color.

   

    setGeometry(0, 0, 200, 200);

    QCustomPlot* customPlot = new QCustomPlot();
    QCPColorMap *colorMap = new QCPColorMap(customPlot->xAxis, customPlot->yAxis);

    QCPColorGradient gradient;
    gradient.setLevelCount(4);

    gradient.clearColorStops();

    gradient.setColorStopAt(0.25, QColor("red"));
    gradient.setColorStopAt(0.50, QColor("green"));
    gradient.setColorStopAt(0.75, QColor("blue"));
    gradient.setColorStopAt(1.00, QColor("yellow"));

    colorMap->setDataScaleType(QCPAxis::stLinear);

    colorMap->data()->setSize(1, 4);
    colorMap->data()->setRange(QCPRange(0, 1), QCPRange(0, 1));

    colorMap->setGradient(gradient);
    colorMap->setInterpolate(false);

    colorMap->data()->setCell(0, 0, 0.25);
    colorMap->data()->setCell(0, 1, 0.50);
    colorMap->data()->setCell(0, 2, 0.75);
    colorMap->data()->setCell(0, 3, 1.00);

    colorMap->rescaleDataRange(false);
    customPlot->rescaleAxes();
    customPlot->replot();

    setCentralWidget(customPlot);
 ;

I was expecting that 4 rows with different colors (red, green, blue, yellow) at an .25 interval. I got a red, maroon, blue, yellow and they were not at the specified interval. It looks like there may be some kind of color interpolation. I played around with the colorstop by adding something like this

    gradient.setColorStopAt(0.00, QColor("red"));
    gradient.setColorStopAt(0.25, QColor("red"));
    gradient.setColorStopAt(0.26, QColor("green"));
    gradient.setColorStopAt(0.50, QColor("green"));
    gradient.setColorStopAt(0.51, QColor("blue));
    gradient.setColorStopAt(0.75, QColor("blue"));
    gradient.setColorStopAt(0.75, QColor("yellow"));
    gradient.setColorStopAt(1.00, QColor("yellow"));

This time I did get a true red, green, blue, yellow but the colors were not on the right ticker boundary.
the green and blue had a big chunk while the red and yellow was smaller. I also playing around changing the values of the cells but got really weird result (color that does not match value).
Is this the correct behavior ?
Would you explain why it is that way ?

Well one problem is surely that you call rescaleDataRange and your data is only 0.25...1.0. So the color range will accordingly be lower = 0.25, upper = 1.0. However, in gradient's color stop definition, the range is always 0.0 to 1.0 (see documentation).
This means your data points are associated like this to the color gradient:
0.25 -> color 0.0
0.50 -> color 0.333...
0.75 -> color 0.666...
1.00 -> color 1.0

Further, I don't see you ever define a 0.0 color, your first defined color is at 0.25. You might be confusing how the range of the data maps to the color stop index. They are not related. The gradient is always defined from 0.0...1.0. How the different data values map to this gradient range is given by the data range (QCPColorMap::setDataRange, or for automatic scaling ::rescaleDataRange).

What I just noticed is that you also maybe not got the meaning/function of setLevelCount correct. Have a look at the documentation. It's only useful if you want very sharp gradient quantization (looks like iso-lines).
Try removing that line altogether, it shouldn't matter for you right now.

Hi Isso, thanks for the reply. Adding the 0.0 color and setting resacleDataRange to false seems to show the correct color.

    gradient.setColorStopAt(0.00, QColor("black"));
    gradient.setColorStopAt(0.25, QColor("red"));
    gradient.setColorStopAt(0.50, QColor("green"));
    gradient.setColorStopAt(0.75, QColor("blue"));
    gradient.setColorStopAt(1.00, QColor("yellow"));
   .
   // i also changed the cell values
    colorMap->data()->setCell(0, 0, 0.35);
    colorMap->data()->setCell(0, 1, 0.40);
    colorMap->data()->setCell(0, 2, 0.75);
    colorMap->data()->setCell(0, 3, 0.80);

From looking at the code what do you think the display color would be ?
I was expecting
0.0 < value < 0.25 black
0.25 < value < 0.50 red
0.50 < value < 0.75 green
0.75 < value < 1.00 blue
+1.0 yellow
Since the cell values (.35, .40, .75, .80) i was expecting (red, red, blue, blue) instead i have red, green, blue, yellow. You mentioned that i might be confused about the dataRange and gradient. This might well be the case. I thought they are related in a sense that the data value is map to the color in the specified color stop definition. If not, how is the cell values get its color ? Thanks for your time.

When I removed the setLevelCount. The colors are completely different. It looks like the new color some of interpolation color.

1. QCPColorGradient always use interpolation color.
2. use colormap->setDataRange set the data range, see document Sets the data range of this color map to dataRange. The data range defines which data values are mapped to the color gradient.