I have chart of winning positions. http://jsfiddle.net/DhcTV/4/ like this. As you can see the last ones and the biggest postion get's your attention.
How to reverse the columns so the smallest positions get the biggest columns and the last positions gets small column ?
Would this be possible to do with the highcharts or does this requires additional calculation ?
Why don't you just reverse the order of the values? See your code updated.
In order to reverse the values of an array, you can use the reverse(..) function on the values array.
Related
I am using NVD3 (a wrapper of d3) to draw a line graph. I want the data in the graph to be within the range of the axis. However, it looks inconsistent with the other labels, as the chart displays the max value of my data set on its own. See screenshot:
In this exanple, 18,554.41 is my highest data point. What I would like to see is the ticks/axis-lables to be in the same order of rounding throughout, with no overflow. i.e. 20,000,18000,16000 etc.
The caveat is that my dataset can vary quite differently - so I can't just set a max. Is there a way of just increasing the tick count by one or something?
Current relevant code:
var chart = nv.models.lineChart()
.showYAxis(true)
.forceY([0]);
chart.yAxis
.axisLabel('£')
.tickFormat(d3.format(','))
.ticks(8);
EDIT: added https://jsfiddle.net/60equ79h/2/
on the fiddle, I would like the first data set's topmost label to be 10,000. the second would be 80. i.e I would like to the y-axis to be increased by one tick
If I understand your question correctly, you can force the yAxis to have the values you define. You can hard code the values or write something clever to identify the min & max for your yAxis.
Update your chart to have the following:
chart.forceY([0, 20000]); // [min, max]
Hope it helps
I am rendering a bar chart but, even though my data is sorted correctly (and appearing with the correct sort order, largest to smallest), my axis is backwards by default.
I have tried changing the values in the chart options for both hAxis and vAxis and I can not get this to reverse to the correct direction (low to high).
My other properties in options are working fine.
Here's what I'm seeing:
For the hAxis, what's it set to now? Did you try:
{direction: -1}
I resolved this issue by making sure the chart was seeing my numbers as number and not as string.
First, define your column as a number:
data.addColumn('number', 'Your Column Name');
Then, if your "number" is actually a string in JavaScript, you'll need to convert this using parseFloat() before attempting to add a row to the dataTable.
This has fixed the reverse-axis issue for me.
This is the fiddle.
I'm trying to show the show the top 100 rows in descending order of a column.
Suppose I have a dimension, how do it sort it?
Came across this. But couldn't fine anythign useful.
Help me in sorting the data in descending order on the value column.
When you create a dimension, it will sort the data for you using a dual-pivot quick sort algorithm. Calling dimension.top(n) will return you the top documents back. Vice versa, calling dimension.bottom(n), will return you the bottom most documents. It will be the natural sort order, so if you want all the documents back sorted descending, use:
var sortedDescending = dimension.top(Number.POSITIVE_INFINITY);
I have a 2D array DATA in javascript and want to calculate a histogram. I have the bins already in place as a 1D array my_bins.
Is there an easy way to calculate, for each bin in my_bins, how many entries are in total in DATAthat matches between my_bins[i]-dand my_bins[i] +d. I want to calculate across the 2 dimensions in DATA.
I'm using mongodb, in case this is important for the answer. Thank you very much!
I wish to create a graph whose y-axis starts at 0. None of my values are 0 though. How do i go about doing that in graphael ?
As an extension, how can I create a graph with a y-axis whose maximum value is, lets say, twice the maximum value in the provided data ?
I don't know if this is too late but I've been struggling with gRaphael myself and came across a solution that might work for you. There's no obvious or clean way to do this but I've found a decent hack for it.
You can add in another array of y values (the first being 0 and last being 2x your max value) and specify the color for this line to be transparent using the colors option.
I've created a fiddle so you can see what I mean: jsFiddle example
The first chart is what you currently have and the second shows the addition of the second set of y values.