Vision Chart Layout to add padding/margin to left of Y axis

I am working on Vision using the chart component and I want check if anyone know a way to align several charts, on the picture you can see the Y axis all start at different location, base on the label values. So it would be something similar to adding a left padding of 100px for exemplo, no matter the value be 1 or 2000

I try to check the jFreeChart api and I think getXYPlot might do this, but so far I haven't found the function to add a padding (not sure if possible), so if anyone has any info and could point me in the right diretion, that will be awesome.



I try using

from org.jfree.ui import RectangleInsets

but this add padding to the entire chart :frowning: so still trying to add padding from Y axis line to begin of the chart box element

I see what you are saying. When one chart is scaled to four digits it pushes the chart to the right causing a misalignment relative to the other charts that are scaled to three digits. This is an interesting challenge, but I would say the easiest approach would be to just move and resize the charts based on how they are scaled.


chart1 = event.source.parent.getComponent('Chart 1')
system.gui.transform(chart1,chart1.x+10, chart1.y, chart1.width-10)

This code would move the left side of the chart over 10 pixels, but because the width is offset by the same amount as the horizontal move, the right side of the chart will remain in the same place. Effectively, this has the exact same effect as padding the y axis within the chart component itself.


You're looking for the fixedRangeAxisSpace()

So code something like this:

space = 10.0
plots = getattr(chart.plot,"subplots",[chart.plot])
for index, plot in enumerate(plots):

I'll see if I can work up an example.

Thanks for the quick reply but I try the examples from Justin and Irose, but I didn't have any luck getting that working.
Couple things to add to this, I am using Ignition 8.1.20, also I am trying to run the code from the chart component scripting > extension functions > configureChart.

on Justin example I add to a button to test and this is the result:

I have similar results using this code from chart component scripting:

# option 1
from org.jfree.ui import RectangleInsets
chart.getXYPlot().getRangeAxis().setTickLabelInsets(RectangleInsets(0, 0, 0, 50))

# option 2

# option 3
chart.getPlot().setInsets(RectangleInsets(0, 50, 0, 0))

I try Irose code, but the [setFixedDomainAxisSpace or getFixedRangeAxisSpace().setLeft] doesn't exist as an attribute.

I try couple options base on our code but none of that work:

# I try this, but I still not sure how to pass the AxisSpace properlly
from org.jfree.chart.axis import AxisSpace
# this part I am not sure
AxisSpace.setLeft = 100.0


I hope this help

Okay, a few things.

1.) The best way to do this, is to actually configure a single chart component to use sub plots. Then the renderer will align the edges of the plot area for you.

2.) The original code I provided had a typo in it, because I converted it from an example with the Domain Axis and I missed one of the references, oh well it doesn't actually apply in this case because you're not using sub plots.

3.) Here is the working code, you will need to put this code in the configureChart extension function on each chart that you want aligned. You will need to insure that the chart objects themselves are aligned as well.

	from org.jfree.chart.axis import AxisSpace
	space = 80 #total space to occupy
	axisSpace = AxisSpace()
	plot = chart.getXYPlot()

80 was the number that I stopped on it will give you 12 digits on the Range Axis (surely that is more than enough, besides more than that and the chart bugs out)


1 Like

Hello Irose,

thanks for the quick reply and this works great, I really appreciate the help.