Charts: Making X-Values Properly Scaled (Not Equidistant)

[ghost]

Hi, I'm making a line chart with the following example data points:

(0,0)
(1,0)
(5,0)

Is there a way I can get the 3 points to show up so that they're scaled properly? Right now, if I add a Data Set with 2 arrays, all 3 points are the same distance from each other. I know there's a thread about this in MPAndroidCharts, but I was wondering if anyone's figured out how to do this in iOS. Thank you so much!

[liuxuan30]

are you saying they are equal distance on xAxis currently, and you want xAxis behave like yAxis?

[ghost]

Hi Xuan,

Yes. The 3 points are the same distance apart on the x axis. Therefore, the graph of
(0,0) (1,0) (2,0) looks the same as (0,0) (1,0) (100,0) with the exception of the labels. I would like (0,0) and (1,0) to be very close together while (1,0) and (100,0) are far apart. I'm not sure if that makes sense. Thanks for the reply!

Best,
Felix

On Jul 8, 2015, at 7:53 PM, Xuan [email protected] wrote:

are you saying they are equal distance on xAxis?

—
Reply to this email directly or view it on GitHub.

[liuxuan30]

Great, I have been the first (I guess) person to ask for this feature. I have filed the request for both Android and iOS, however no response yet... I hope more and more people can realize this is an important feature for professional users.

@PhilJay and @danielgindi I think we are aiming at providing the world-class charts. I would love to help on this, however, I cannot see the whole picture for all the features inside the projects. You guys have better understanding on it. From what I have tried, render xAxis like yAxis is not the tough part, what blocks me is the xAxis labels is not in the right place while zooming and scaling. I still don't get how to correctly render the labels, considering the label width and the position.

[liuxuan30]

FYI, https://github.com/danielgindi/ios-charts/issues/176 and https://github.com/PhilJay/MPAndroidChart/issues/821 is the same request I have been filed.

[danielgindi]

This is becoming a popular feature, we know. It is quite complex to implement and we haven't got to designing it yet...
It involves of course changing the whole coordinate system to something that cannot assume anything about the X axis. We haven't got to the details yet but I'm planning on learning this topic soon.

[danielgindi]

"Soon" meaning when I get the time to sit a whole night on it. I have a wedding to plan at the moment so you can see I'm a little less active here :-)

[liuxuan30]

@danielgindi HUGE congratulations to you from China!

[aaga]

Can you give us a rough idea of when this might be implemented? And congratulations!

[liuxuan30]

@aaga I think it takes a lot of time, since the logic is very different and lots of things to think about and re-write. Could be months even if it has a high priority.

[plamenterziev]

+1 for this feature

[shrikantwalekar-tudip]

Hi, I am new in iOS, working with swift. I am using this beautiful charts library. I'm making a line chart with the dates on x axis and unable to plot properly scaled points(Dates). Tried with passing NSDates to xVals. I don't know what is wrong with the way I am doing .... plz help me out.

[pmairoldi]

You can convert your dates to time intervals to use as X values. Then you can format the time interval back to dates to display on the X axis.

[adamawolf]

@petester42 @shrikantwalekar-tudi but note that subsequent x-axis data points will be represented equidistantly even if the time interval between the data points is not equidistant.

Hence I think we can interpret the comment @shrikantwalekar-tudip made as: +1

[shrikantwalekar-tudip]

Hi, I did that and it worked !!, but if my whole x- axis is of thousand of values and if the points to plot are less like 10 points. I am getting something like this, while scrolling after zoom.
While there was no gap as showing.

[pmairoldi]

In not sure I understand.

[shrikantwalekar-tudip]

Can anyone help me with this please!!! Any help will be appreciated! Thank you!!!

[bakso]

It's very impontant

[ezamagni]

+1 for me, this feature would be REALLY a breakthrough

[rlimberger]

+1

[pdura]

+1 for me too

[StephanieB5]

+1 for me too. You can't use X-Axis to represent time without this feature since most data doesn't come at equidistant time intervals.

[RyGuyM]

+1 Is there any work being done on this?

[StephanieB5]

On my end I'm going to start dabbling with this. Since my main concern is using the x axis to represent time, to start I'm going to only support affine transformations from x values to pixel space. I figure the other key will be adding a framework to format values on the x axis into appropriate labels. Of course if a fix is waiting in the wings I'll hold off. :)

[RyGuyM]

@StephanieB5 I'm in the same situation. I'll going to take a look and attempt to get a better idea of what is required. If you need any help or want to discuss anything let me know. I would be nice to get an idea of the roadmap for this feature if there is one, @danielgindi or @PhilJay https://github.com/PhilJay/MPAndroidChart/issues/12 ?

[StephanieB5]

@RyGuyM great asking about the roadmap for this feature. As well, collaboration would be great. :) I've forked this repo and I'm starting to prototype an idea I have for this. If there isn't anyone else working on this we can move our conversation to my repo. I'll ping you from there just in case.

[liuxuan30]

thank you guys! Here's what I have been tried: implement the x axis and renderer just like how y axis works. The idea is clear, but the problem is, lots of things needs to be considered to make it a good design and implementation from the framework perspective, plus Android portion. That's why it's slow to move forward.

If you just want to solve you problem, you can take a look at how horizontal bar chart's y axis is implemented, since it's already at the 'x axis' position. so you can borrow this y axis as your x axis.

If you are serious to want it merged into master(which I wish), and have a thread to track the discussion and progress, give me the link and we can continue, I will see what I can help and offer.

@danielgindi I also would suggest this to be the next killing feature :dancer:

[StephanieB5]

Thanks @liuxuan30. :) I'm just playing around in my own test branch right now. I've broken my idea down into stages so I won't have anything ready for mainline for a while. However, if you wish you can always follow my incremental updates.

[RyGuyM]

@liuxuan30 Thanks for response! I'll be making a serious effort to work on this in the coming weeks and I would like to see it get back into the project as well. This library is great but unfortunately this is a show stopper for me. I'll start getting organized with @StephanieB5 tomorrow and we can start tracking the discussion.

[stevekelly20]

+1

[mpiannucci]

+1

[AdamMak]

Is there any ETA on when this feature will be brought in? I am working on a project at the moment which requires this feature as we are displaying timeline data on graph, so need x axis to be properly scaled

[liuxuan30]

No, there is no ETA

[kaustubhkabra]

+1

[p0fi]

+1

[spinach]

+1

[briancl2]

I need this too, but for now, what is the appropriate workaround to change the x-axis values for non-regular time-series data? I.e., if I have

(4/25, 5)
(4/29, 10)
(5/10, 15)
(5/11, 20)
(7/4, 25)

What data can I use to create a graph that appropriately displays the amount of time between each data point so that the 7/4 data point shows as ~60 days away from the previous data point instead of showing as 1 day away.

Does something like this work:

(4/25, 5)
(4/26, nil)
(4/27, nil)
(4/28, nil)
(4/29, 10)
(4/30, nil)
(5/1, nil)
etc...

I've tried playing around with this, but I get errors when the number of xVals is not equal to the number of yVals.

[liuxuan30]

when you don't have y value for the xIndex, simply not insert y values into the array

[PhilJay]

Sorry repository mixup :-)
This feature will soon be available :-)

[elsurudo]

@PhilJay that's great news! I'm just trying out this library for the first time, but since my use-case is time-series data, I really need this to get things working

[danielgindi]

I'm working on migrating the beta-changes from the Android repo, and it will be available soon :-)

[rlimberger]

Does this migration include all new features of 3.0 including the scattered x values?

On Jul 10, 2016, at 8:06 AM, Daniel Cohen Gindi [email protected] wrote:

I'm working on migrating the beta-changes from the Android repo, and it will be available soon :-)

—
You are receiving this because you commented.
Reply to this email directly, view it on GitHub, or mute the thread.

[leandrinux]

Good to see that this feature was already requested and that work has been done on it. I anxiously await for the solution since I love this library but I cannot use it in my apps unless the charts are properly proportioned in the X axis.

[liuxuan30]

I believe it's coming out soon, has been a lonnnnng time!

[Fedenieto90]

I can't wait for this feature to be available, I really need it as my app uses a time based X axis.

[rlimberger]

@danielgindi thank you for your great work! Have you had a chance to migrate the android changes to enable this feature? Can how to use this feature? Thanks again!

[liuxuan30]

there is a branch already. However still under bug fix

[rlimberger]

@liuxuan30 which branch is that? 3.0?

[liuxuan30]

@rlimberger v3 branch

[rlimberger]

Thank you. Is there an example on how to use this feature (irregular x spacing and different x values for different datasets)?

[liuxuan30]

@rlimberger It should be similar approach. You could check out v3 branch to see if there is a ChartsDemo example (sorry I don't have time to check out right now)

[hourlink]

The Objc demo works well enough to provide a good demonstration of the capabilities of v3. Thanks @liuxuan30! By the way, is it possible to make the scatter chart with a line connecting the points (a different line for each data set)? Unlike the Multiple Lines Chart demo, the Scatter Chart demo seems to show an independent set of x values for each data set, which is exactly what I want. However, I would like all of the points in each data set connected by a separate line.

[hourlink]

never mind; I found the answer to my own question. Both LineChartDataSet and ScatterChartDataSet are initialized with an array of ChartDataEntry objects, each of which can have a completely independent (x,y) set. Awesome!

[danielgindi]

Yeah, awesome :-)
We're almost ready with v3, some last bugfixes etc.
Basically - we want users to test the v3 branch now, tell us if we've introduced any new bugs.

This issue is going to be closed now (yay!!!)

[hourlink]

My code now crashes with the message "'NSInvalidArgumentException', reason: '-[Charts.ChartDataEntry encodeWithCoder:]: unrecognized selector sent to instance...'" when executing NSKeyedArchiver.archivedData(withRootObject:) with an argument of type ChartDataEntry. This didn't happen before. Is it possible that it is due to a bug in v3?

[hourlink]

Never mind. It's not a bug in v3 that caused my code to crash. I just had to re-add conformance of the ChartDataEntry class to NSCoding.

[hourlink]

Anyone else getting this error: "Error: this application, or a library it uses, has passed an invalid numeric value (NaN, or not-a-number) to CoreGraphics API"

[hourlink]

The backtrace indicates: ": CGContextAddLineToPoint: no current point."

[ChaosPredictor]

Where can I find an example for not equidistant x data (like date)?
I mean I would like to create graph like this:

Is it possible?

[saravananmnm]

y and x axis values are not set properly.
` if (!UIUtils.isEmpty(mModel.getChartData())) {
for (String lists : mModel.getChartData().split(",")) {
if (lists != null) {
String[] str = lists.split(":");
mXAxisNames.add(str[0]);
mYAxisNames.add(str[1]);
}
}
float count = mYAxisNames.size();
ArrayList yvalues = new ArrayList<>();
for (int i = 0; i < mYAxisNames.size(); i++) {
yvalues.add(new BarEntry(i, Float.parseFloat(mYAxisNames.get(i))));
}
BarDataSet dataSet = new BarDataSet(yvalues, "");
dataSet.setColors(Utils.getBarChartColors());
dataSet.setValueFormatter(new MyvalueFormatter());

        BarData data = new BarData(dataSet);
        data.setValueTextSize(10f);
        data.setBarWidth(0.9f);
        data.setValueTextColor(Color.DKGRAY);

        float minValue = data.getYMin();
        float maxValue = data.getYMax();
        //Initial values for Y axis
        int yMax = (int) maxValue + 1;
        int yMin = (int) minValue - 1;

        XAxis xAxis = mBinding.barChart.getXAxis();
        xAxis.setGranularity(1f);
        xAxis.setDrawGridLines(false);
        xAxis.setDrawAxisLine(true);
        xAxis.setDrawLabels(true);
        xAxis.setPosition(XAxis.XAxisPosition.BOTTOM);
        xAxis.setValueFormatter(new MyAxisValueFormatter(mXAxisNames));

//Y-axis
mBinding.barChart.getAxisRight().setEnabled(false);
mBinding.barChart.getAxisLeft().setEnabled(true);
YAxis leftAxis = mBinding.barChart.getAxisLeft();
leftAxis.setValueFormatter(new MyYAxisValueFormatter());
leftAxis.setDrawGridLines(true);
leftAxis.setDrawLabels(true);
leftAxis.setSpaceTop(10f);
leftAxis.setAxisMinimum(0f);
leftAxis.setAxisMaximum(yMax);
leftAxis.setLabelCount((int) count,true);

        // Default value
        mBinding.barChart.setDrawBarShadow(false);
        mBinding.barChart.setTouchEnabled(false);
        mBinding.barChart.setDrawValueAboveBar(true);
        mBinding.barChart.setPinchZoom(false);
        mBinding.barChart.setScaleEnabled(false);
        mBinding.barChart.setDescription(null);
        mBinding.barChart.setVerticalScrollBarEnabled(false);
        mBinding.barChart.setHorizontalScrollBarEnabled(false);
        mBinding.barChart.setDrawGridBackground(false);
        mBinding.barChart.setDoubleTapToZoomEnabled(false);
        mBinding.barChart.setData(data);
        mBinding.barChart.setFitBars(true);
        mBinding.barChart.setAutoScaleMinMaxEnabled(true);
        mBinding.barChart.animateXY(1000, 1000);
        mBinding.barChart.invalidate();
    [}`]