Trying to set the maximum value of the x-axis of a dygraph after it has been drawn.
Tried
axes = g.axes_;
axes.maxxval = maxVal;
g.updateOptions({
axes
});
You want to be setting the valueRange property. See this demo.
The trailing _ in g.axes_ means it's a private internal property. Nothing good will come from messing with it.
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 have this (SOLVED) chart where i want to find the x coordinates for the corresponding max/min value on the y axis.(and display em on the line chart as I've already started to do)
I've managed to find the coordinates for the y axis and it updates accordingly, but I'm not sure how I would find the corresponding date to the max/min value.
I tried using the d3.nest function and associate the max/min value to it's date and tried to assign it to a single key but wasn't sure how to go about it or whether it was the right approach to begin with.
An easier approach is simply finding the object with the highest value:
var maximumObj = data.filter(e => e[city] === maximum)[0];
And using it to plot a circle or anything you want.
Check the bl.ocks: https://bl.ocks.org/anonymous/b388c8557f4210b66f8eae25b436f4f3
There is a stacked area chart built with NVD3's multichart. The values in the chart can change, and I want the y Axis to scale according to the selected values.
How can I update the yAxis for multiChart?
I have used forceY to change the yAxis in other NVD3 charts, but forceY doesn't work with multiChart.
Below are several strategies. The last strategy changes the value of the domain, but the new value is not reflected on the chart.
Thanks for any help offered.
//existing domain values -- to be changed
chart.stack1.yDomain()
=> [-.1, -1.92]
//new values that I want the y axis to use
let [padStart, padEnd] = [.12, 0.27];
//DOESNT WORK - this changes the yDomain of stack1, but does not change yAxis1.domain
// chart.stack1.yDomain([padStart, padEnd]);
//DOESNT WORK - error -chart.forceY is not a function
// chart.forceY(padStart, padEnd);
//DOESNT WORK - error - chart.yAxis1.forceY is not a function
// chart.yAxis1.forceY(padStart, padEnd);
//DOESNT WORK - this does not change domain value
// chart.yAxis1.scale().domain([padStart, padEnd]);
//WORKS -- this changes domain value, but the view doesn't update
chart.yAxis1.domain([padStart, padEnd]);
The correct approach for multichart is to access the yDomain directly:
chart.yDomain([padStart, padEnd])
I have a linar chart on Highchart.lib. I am showing more than zero values on it. How can i move X Axis to the bottom, because i dont need less then zero values. See attach.
I assume from your image that you mean the y axis.
Easiest way is to simply set your y axis min and max values.
You can also work with the startOnTick and minPadding settings for a variety of control options.
http://api.highcharts.com/highcharts#yAxis
set min Value and minRange Value - thats it.
I'm trying to do a chart based on http://mbostock.github.com/d3/talk/20111116/bar-hierarchy.html, the only difference being that I'd like to use a log scale for the x-axis.
Here's my fiddle: http://jsfiddle.net/JhDVC/5/
As you can see, the x-axis is defined at line 4:
x = d3.scale.linear().range([0, w]),
If I change it for
x = d3.scale.log().range([0, w]),
Then it doesn't work (nothing is rendered), throwing these error messages:
Error: Invalid value for <rect> attribute width="NaN"
Changing the domain setting from
x.domain([0, root.value]).nice();
to
x.domain([1, root.value]).nice();
shows me the z axis (names) but still no bars or values.
There are a few other places where the domain for the scale is set. You need to update those as well.
Working jsfiddle here.
And here's some code so that it allows me to post this:
x.domain([1, root.value]).nice();
Your range includes zero - log(0) is undefined.