Change plot series background dinamically
Is it possible to change a segmented fill plot series background dinamically? For example when clicking a button.
-
You can change the draw mode of a plot series in script using the following:
plotName.seriesName.DrawMode = enum.DrawMode.FillType;
where FillType is the name of the desired line style (https://qdexapps.com/drawing-types/). You must also update the plot series for the change to take effect.
Example:
<xyPlot name="drawPlot">
<series name="series1">
<data>0 0; 1 1; 8 0; 7 1; 8 3; 7 2; 0 3; 1 2; 0 0; 1 1</data>
</series>
<series name="series2">
<data>4 9; 2 9; 2 7; 4 7</data>
</series>
</xyPlot>
<button content="Change Draw Style">
<onClick>
drawPlot.series1.DrawMode = enum.DrawMode.SegmentedFill;
drawPlot.series2.DrawMode = enum.DrawMode.Points;
drawPlot.series1:Update()
drawPlot.series2:Update()
</onClick>
</button> -
Hi Abbey, I'm working with Martin.
Thank you for the reply but what we are trying to do is change the background color of a series using segmented fill as drawmode. Is it possible to do it dinamically?
We tried something like this but it didn't work:
<button>
<onClick>
series.Style.BackgroundColor = color.green;
series:Update()
</onClick>
</button>Thank you!
-
Okay I see now.
Yes, it is possible to change the color of a series dynamically. When updating the color of a plot series, you must use the ForegroundColor style.
<button content="Click Me">
<onClick>
plotName.seriesName1.Style.ForegroundColor = color.green;
plotName.seriesName2.Style.ForegroundColor = color.rgb(255,50,220);
</onClick>
</button> -
Hi Abbey, we managed to make it work this week. Changing the foreground color of the series wasn't working because we were using the plot tools for drawing a square. We found out that the function drawSquare sets the color for every dot and that's why we couldn't change the color dinamically. We modified the function for our app and we could make it work.
This is the original function:
function plotTools.drawSquare(series, centre, width, height, customColor)
local x = centre[1];
local y = centre[2];
local shapeColor = customColor or series.Style.ForegroundColor
series:Add(x - width/2, y + height/2, shapeColor);
series:Add(x + width/2, y + height/2, shapeColor);
series:Add(x + width/2, y - height/2, shapeColor);
series:Add(x - width/2, y - height/2, shapeColor);
series:Add(x - width/2, y + height/2, shapeColor);
endWe changed it to:
function plotTools.drawSquare(series, centre, width, height, customColor)
local x = centre[1];
local y = centre[2];
series:Add(x - width/2, y + height/2);
series:Add(x + width/2, y + height/2);
series:Add(x + width/2, y - height/2);
series:Add(x - width/2, y - height/2);
series:Add(x - width/2, y + height/2);
end -
I am glad you found a solution. You are right that it is not possible to change the foreground style of a plot series if it is being colored using per-vertex colors. However, it is possible to create a color vector to apply to the series instead.
More information about per-vertex colors and color vectors can be found on the Knowledge Base.
<script>
plotTools.drawSquare(plot.shape, {0.5,0.5}, 1, 1, color.blue)
local myColorVector = colors(5);
</script>
<xyPlot name="plot">
<series name="shape" />
</xyPlot>
<button content="Click Me">
<onClick>
myColorVector[1] = color.red;
myColorVector[2] = color.blue;
myColorVector[3] = color.green;
myColorVector[4] = color.yellow;
myColorVector[5] = color.red;
plot.shape.Colors:Clear();
plot.shape.Colors:Add(myColorVector);
</onClick>
</button>
<button content="Click Me">
<onClick>
local anotherColorVector = colors(5, color.red);
plot.shape.Colors:Clear();
plot.shape.Colors:Add(anotherColorVector);
</onClick>
</button>
Please sign in to leave a comment.
Comments
5 comments