I want Google chart to make better use of the vertical space available for this graph:
https://chart.googleapis.com/chart?chs=300x150&cht=bvs&chxt=x%2Cy&chd=t:7,8,5,6
QUESTION: How to make the vertical axis adapt to the range of values automatically?
For instance, 0→max value would be great.
Note: I could write a server-side algorithm to find the max value and use it as a parameter, but there is probably a better way to do this with Google Charts, right?
I ended up writing a server-side loop to check what is the maximum value, and then use it:
&chxr=1%2C0%2C" + max + "&chds=0," + max
Any better solution is welcome!
Related
In chartjs (v3) I'm programmatically zooming and panning by setting the min and max values for a series.
This works great, except if the series has a logarithmic scale ... this method doesn't seem to work, and has some strange results.
Any ideas on how I can achieve programmatic panning and zoom with logarithmic scales? Simply adding/subtracting the min/max values doesn't work correctly
EDIT: I see that the zoom plugin API has a zoomScale() function, but setting the min and max has the same effect... should min and max be calculated differently for logarithmic scales?
EDIT2: I'm trying to call the pan() function, which accepts Scale[] as a parameter ... I'm strugging to work out how to pass one of my scales, any ideas?
For zooming and panning, I'm using Zoom plugin: https://github.com/chartjs/chartjs-plugin-zoom
You can also find a specific sample on log axis: https://www.chartjs.org/chartjs-plugin-zoom/latest/samples/wheel/log.html
For anyone with a similar problem, I've got it working ...
I simply need to call the pan function like this:
mychart.pan(10, [mychart.scales['yMyScale']], 'none');
I need to compare Year Month values somehow next to each other.
But the difference is so big that it is not very visually appealing.
I tried to find a good chart to display those, but so far no success.
Any recommendation?
If you want them to share the same axis as you have in your image, you could switch the scale to logarithmic instead of linear. Otherwise, you could try putting them on separate axes so they scale independently.
Another option would be to normalize them somehow. If one set were monthly, then you could multiply it by 12 to "annualize" it.
I want to calculate percent based on count of events. Basically, I want to calculate successful login attempts on a website. Something like below
count(successful_attempts)/count(total_attempts)
successful_attempts and total_attempts are recorded as events in login_attempts column.
How would I achieve this?
There are mainly 2 approaches to your problem.
Compute the percentage yourself:
You can add a calculated field to your analysis or your dataset and use the a similar formula to the one you mentioned.
You might need to use sum rather than count depending on the type of your login_attemps column.
You'll then be able to see that value using a simple KPI chart
Use charts to make the computation:
You could use a gauge chart.
Using the sum of successful attempts as value and sum of attempts as target. The chart will compute the percentages itself.
Donut charts and Pie charts will work in a similar fashion.
Finally, horizontal or vertical stacked 100% bar charts might be another alternative.
Maybe this question exists already, but I could not find it.
I am making plots in Python. I don't want to set my axes range such that all points are included - there are some really high or really low values, and all I care about in those points is that they exist - that is, they need to be in the plot, but not on their actual value - rather, somewhere on the top of the canvas.
So i found something that helps a bit in achieving what i want to do in this question Link
So basically this thing works:
xmax=0.18
plt.(np.minimum(x,xmax),y)
But when I tried something like this then it didn't work.
xmin=0.8
xmax=0.18
plt.(np.minimum(x, xmin,xmax),y)
How can i solve this?
To force the points above a threshold to a maximum level you may use np.minimum(x,xmax).
To force the points below a threshold to a minimum level you may use np.maximum(x,xmin).
To do both you may combine the two commands
xlimited = np.minimum(np.maximum(x,xmin),xmax)
Note that to have the points restricted in the vertical direction you would do this to the y values of course.
I'm using Baidu ECharts2 to visualise a dynamic amount of series (up to 100) as a line chart.
The issue I face is the legend overlaps the graph in case if the series are too many.
I spent good 2 hours in searching the documentation and reading, but cannot figure out any way to set the graph position (y/y2 top/height).
It seems the chart consists of different elements (legend, toolbox etc), but none of them seems to be the graph itself.
An example I found showcases a fully responsive way to position pie charts, but this is not applicable in my case:
https://ecomfe.github.io/echarts-examples/public/editor.html?c=doc-example/pie-media
I'd be grateful if someone has more experience with ECharts and can tell me way to move the graph down by y and set a height.
Thank you!
Your best option may be to set the legend type to scroll so it fits on one line.
legends.push({
type: 'scroll',
show: true,
data: myData,
...
});
You may also be able combine Ovilia's and Zain's solutions to move the grid down to leave space for the legend. Unfortunately that would require a way to determine the legend's size before setting the chart's container size.
You can set grid position to make it.
In ECharts 2, you may set grid.y, grid.y2, or grid.height.
In ECharts 3, you may set grid.top, grid.bottom, or grid.height.