Limit on Y-Axis Value in Chart - kendo-ui

This may not be an option currently for the Kendo Charts, however, I want to set a limit on the max value displayed on the chart. The chart I am displaying gives the user the option to select fixed y-axis at 100% or auto y-axis. The information being displayed is CPU usage so it's absolute maximum value is 100%.
The problem: I have found that if I use auto y-axis (don't provide a max y-value) then when the data hits 100% the chart will display up to 120% because of the 20% step size.
My current fix: I check the max value in the returned data during the chart render event. If the max value is >= 80% then I set the y-axis max to 100% so it doesn't display 120%. Then I redraw the chart.
Is there a better way to do this so I don't have to redraw the chart? I didn't have this problem with other charting libraries.
Thanks

Is valueAxis.max setting that you need ?

I ended up moving the code to update the max y-value from onRender to onDataBound. This way still feels kind of "hacky", but it ended up causing only one chart render event instead of two.

Related

How to auto scale Y-values for a DateTime series within a zoomed in X boundaries?

I am writing an application for Windows 10 using Delphi 11 and Steema TeeChart pro 11 components.
I use AddXY(….) to plot a DateTime series of about 1000 values as points in Chart1 with BottomAxis set to DateTime and the Leftaxis set to float.
Thereafter I zoom in a small part of the data in Chart1 using the mouse wheel or drawing a rectangle.
Then I want to plot a new time series (AddXY(….)) of 1000 values in Chart1, keeping the zoomed in min and max values for the bottom axes, but use automatic scaling for LeftAxis. Before plotting the second series I delete the first.
The second series have the same DateTime values as the first series, but the Y values are sometimes very different compared with the first series and may not be visible in the graph.
Now the problem occurs. The Left axis will be automatic scaled based on all the data points and not on the points only falling within the zoomed X boundaries.
Does TChart have a simple method to find the min and max Y-values for the second series within the zoomed in time period. I thought of using the LeftAxis.AdjustMinMax() procedure for rescaling the left axis?
Of course I could scan through all the Y-values within the zoomed in period and calculate the min and max value. Then, how do I know the starting and ending valueindex of the data points falling within the zoomed in time period? I hoped to avoid using this method due to speed resons if number of points are > 1000.
Hopefully someone more experienced TeeChart programmer than I am can give me some suggestions of the best way to achieve this.

Get a minimum value between view high and view width

I'm fairly new to scss, I'm trying to make a variable that has the minimum value of 10 percent view height and 10 percent view width.
my approach is
$size = min(10vh, 10vw);
But I would get unit not comparable error.
How would I solve such issue? Thanks in advance
I think that this can't be done.
At transpile time SASS doesn't know what the height and the width of the viewport are gonna be (think about the change of orientation of a tablet). That information is only available on the client device.
This can't be done in CSS either (there is no max or min function), see Calc of max, or max of calc in CSS

UWP WinRTXamlToolkit: Chart labels cut off

I'm using the charts of the WinRTXamlToolkit for an UWP-App.
Using an 720p display or better (e.g. Lumia 640) the chart looks just fine, but using a device with a lower resolution (e.g. Lumia 535 at 960x540), the edges of the chart are cut off.
I've already tried to change several variables of the chart like padding, margin, width or height, but the outer parts of the chart remain cut off.
Whatsoever: changing the scaling of the lower-resolution-device to 125% solves the problem.
Is there a way, to achieve a non-cut-off-chart, without having to set the scaling in device settings on affected devices? The current behaviour forces users to change their overall resolution-scaling just for this one feature.
Example of a cut-off chart
Example of a "normal" chart
Seems like the layout is just unable to fit all the elements so they all get their fair amounts of space and the rest gets clipped off. Of course there's probably some issue with that layout logic of the chart control that might be fixed, but if you want a quick fix - you could set the Width/Height of the chart to fixed values and stuff it in a Viewbox.

Kendo UI radial gauge start max number first

is it possible to go from high number to low number in the Kendo UI Radial gauge? I know I can use reverse but the meter then starts from the right side instead of the left. If there a way to have the numbers in the gauge go from max to min and have the meter start from the left side?
I recommend you add the labels yourself in the gauge's background image using a graphic program. Then turn off the visibility of the labels.

dimple.js - keeping scale after reloading new data

In d3.js I can load a dataset and filter it on 'year'. This opproach gives me the possibility to calculate my d3 scales and vertical axis based on my complete dataset's max y value.
My aim is to get the graph to be visually comparable when changing view from one year to another. - With the same maxscale value, and the same relative vertical height per unit in the columns after reloading data for another year.
Do anybody know how to accomplish this in dimple.js?
Thanks :)
In the documentation there are some examples of what you're trying to achieve..
Namely, one in which the axis min and max settings are manually set..
// Setting min and max dates requires them to be set
// as actual javascript date objects
y.overrideMin = new Date("01/01/2000 9:00 am");
y.overrideMax = new Date("01/01/2000 6:00 pm");
In this case they are Time values for a day, which make sense not to change, but the same should apply.. But, you should give us some of your code examples for more specific answers.
So from chart change to chart change, you will retain the same Min & Max as the previous year.
Reference DimpleJS Advanced Time Axis

Resources