HighCharts FORCE pointInterval (from user selection), pointPixelWidth and pointPadding(in pixels) - javascript

I have a candleStick and Column(volume) chart. I want the user to pick the interval (1m, 3m, 5m, 15m) etc.
The problem i am having is i cannot correctly set the point padding in pixels so the spacing will either vary between the different intervals (pointPadding is represented as a percent of the interval width on the axis). This screws up the chart as you change intervals.
As an additional problem, if highcharts own datagrouping calculates the total points in the plotArea based on the width of the plot (in pixels) and the width of the points. If this is off by one pixel my volume/column chart loses it's last points depending on how it determines the grouping.
It is strange because setting the column and candle pixelPoint widths the same for each gives different results as well.

Related

Data label is getting hidden in pie(simple donut) chart.Not adjusting with-in the given space

I am trying to fit in the dynamic text on to the pie chart (donut) with fixed width and height. The data labels with connector are not getting aligned within the specified boundaries which are 550w x 208h. The number of data labels are fixed to be 4.
I have tried the following:
Increase/decrease distance of connector.
Increase/decrease connector-padding.
Increase/decrease the radius of the chart.(Wont fit for all the texts).
I have tried to use css in the formatter of the function which uses html with word-wrap. Have specified the width in plot options as well.
The second data label is getting cut.

Set second axis in proportion of first axis

I have a chart which contains two series, and each of them has its own yAxis. I need to automatically set the second axis maximum to 13.5% of the first axis maximum. For example, if the first axis goes from 0 to 100, then I want the second axis to go from 0 to 13.5 (No matter the second series value).
The only way I found to achieve this is to calculate the max of the first series, and then affect it to the max of the second axis. But this is not what I really want. See this JSFiddle.
My fiddle seems to work, but in reality, I am not calculating the second axis maximum in a good way, as I refer to the first series maximum and not the first axis maximum.
Does anyone knows a general way to set the max of an axis accordingly to the max of another axis ?
The linkedTo attribute from Highcharts axis is close to what I want, but I need to add a coefficient. I don't know how to proceed.
There is no default API function in Highcharts that would allow that.
If you want to get percentage of max of created axis, then you can get it in load event of chart (API: http://api.highcharts.com/highcharts#chart.events.load )or in callback (as in demo below). Next you will need to update second axis' max.
Example: http://jsfiddle.net/cg0c5tkd/
function(chart){
chart.yAxis[1].update({max: chart.yAxis[0].getExtremes().max * 0.135});
}

Highstock data points pixel spacing

Is there a way to set point spacing in pixels on x/y axis for highstock? For example data points should be 5px apart.
Also is there way to shift chart left or right? For example shift all data points 5px right or left?
The spacing between points can be control by
pointPadding
groupPadding
pointWidth
If you want the points of a line to be a certain distance apart, you need to make sure that the width of the plot area, divided by the number of points , equals that pixel value.
(or divided by the number of axis units, if you are artificially setting a min and max beyond the range of the data)
There can't possibly be a property to account for this - it's all about the space available and the number of points.
As for shifting left or right, it depends exactly what you mean. If you're looking to add spacing to the left or right end of the x axis, you can use midPadding or maxPadding.
http://api.highcharts.com/highcharts#xAxis.minPadding
http://api.highcharts.com/highcharts#xAxis.maxPadding

How to get the uniform column width in DHTMLX bar chart

What is the default width of each column in the DHTMLX bar chart.
I know that we can set the width of bar. But what is the default width of each column.
As I observed it depends on the total width of the chart. The larger the width of the chart, the larger the width of each column in width. Am I correct?
If I am correct with the above statement, in my chart I giving the day number of the months as the X-axis values. the chart is drawing fine till the last day. For the last day I am getting too much space.
Please observe the space between 31 and 1.
Could you please tell me what would be the problem?
How can I get the uniform column width in my chart? Please advice
Chart counts default width itself. It depens on common chart width (container dimention), items quantity, etc.
There is offset settings you can set empty fields "around" chart scale

NVD3 legend Show/Hide chart getting scale / zoom feature disabling

I have 2 line chart shown side by side which has 5 lines being plotted on each chart. So there are 5 legend for each of them. Unchecking each legend would hide the respective line specific to legend and optimize(May be zooming or scale) the chart with new scale measurement.
This is default functionality of legend. What i am looking for is ONLY just show/hide respective line. No other functionality like zoom/scale so that user does get distracted by zooming as s/he is comparing 2 charts side by side. I hunted documentation but did not find these feature on/off information.
Force X
List of numbers to Force into the X scale (ie. 0, or a max / min, etc.). The numbers tell the d3.js the values to use in the scale, rather than d3.js determining the values.
Force Y
List of numbers to Force into the Y scale (ie. 0, or a max / min, etc.). The numbers tell the d3.js the values to use in the scale, rather than d3.js determining the values.
Datatype: Array of Numbers (i.e. [0, 50]
Reference: http://cmaurer.github.io/angularjs-nvd3-directives/line.chart.html

Categories