Tickmarks in the SVG Line chart

Share RGraph:   To help my Google visibility (it can't get much worse!), if you like and use RGraph I'd appreciate it if you could link to me

« Back to message list

Enter your email address to get email updates on this topic. You can stop receiving updates by clicking the link in the update email messages.

Posted by Jan Dirk on 24th March 2017
Hi Richard,

I try to create a Line graph, showing values in time. On the x-axis I have dates. The actual data does have much finer granularity than the labels can have (, because that many labels won't fit), e.g. the data can be per day, where the labels show only the year or month.

E.g. The data may be from the 1 Apr 2014 until now. I now want to have on the x-axis the labels 2014, 2015, 2016 and 2017, where 2014 and 2017 will not be a whole year. Something like (you need to see this with a fixed font):

|
|
--------+------------+------------+----
  2014 2015 2016 2017
   

Preferably, I'd like to see
- the tickmarks be on the borders of the periods denoted by the labels (here the years), the tickmarks should therefore not have to start at the origin.
- the labels centered between the tickmarks,

Currently I am able to get/set the correct labels and the number of tickmarks. Using xaxisLabelsOffsetx I can also shift the labels, so that the origin of the x-axis is not a 1-Jan-2014, but 1-Apr-2014.
However, I don't get the tickmarks shifted as well, like the labels do.

I'd like to see the tickmarks to be shifted with the value of xaxisLabelsOffsetx as well. Is this possible?

Did I miss something? Is there a workaround? Can you fix this or make an enhancement for this?

(I've tried canvas scatter-line graphs before, but I'd like to use the filled-property)

Thanks in advance,

Jan Dirk
Posted by Richard on 24th March 2017
Hi there,

It sounds like you're talking about a "xaxisTickmarksHmargin" option - is that right? So that if you use the Line chart hmargin option the tickmarks will still line up.

Or perhaps Bar chart style labels but with the Line chart? Which you should be able to achieve with the xaxisLabelsPosition (set it to 'section') option.




Richard
Posted by Jan Dirk on 27th March 2017
I'm not sure if I understand you correctly.
The hmargin creates a margin on both sides, where I do think that the "xaxisTickmarksHmargin" should only make the tickmarks to shift.

I also looked again to the xaxisLabelsPosition option, and I do think that indeed the value 'section' makes more sense (to me).
In my case the labels describe the section (Jan 2014, i.e. 1-Jan-2014 until 31-Jan-2014).
In the case of xaxisLabelsPosition=edge, the labels should describe the edges, and than the label should be like '1-Jan-2014'.

Unfortuntely, in the case of xaxisLabelsPosition=section, I cannot regulate the number of tickmarks.

So, when you can have a "xaxisTickmarksOffsetx" option and a "xaxisTickmarksCount" option, that would be great.

For clarity I made three screenshots: imgur.com/a/JyM1P

Regards,

Jan Dirk
Posted by Richard on 27th March 2017
Hi,

Would the SVG Scatter chart work better for you?

www.rgraph.net/fiddle/view.html/svg-scatter-example

Here you give the X and Y values and the points are connected with a line. The X axis labels are positioned using the "section" mode of the X axis.

This sounds more like what you might want.





Richard
Posted by Jan Dirk on 27th March 2017
Hi Richard,

I've used the scatter-line before, but I do miss the possibility for the fill-colour here.
Even here, when a 'section' is a month, and the data starts in the middle of a month, is it then possible to start with half a 'section'?

Jan Dirk
Posted by Richard on 27th March 2017
Hi,

Not really - Starting the line half way through the year would send the positioning out of whack.

I've changed the X values to dates which you may find easier to work with.

www.rgraph.net/fiddle/view.html/svg-scatter-example





Richard

Add a reply




« Back to message list