See this JSFiddle of a bullet chart showing decimal values in the x-axis.
https://jsfiddle.net/5az19o2t/
I've tried to remove the decimals with the following options:
{ xAxis: { minTickInterval: 1, tickInterval: 1, allowDecimals: false }}
None of those options appear to do anything. How can I define the tick intervals on a Bullet Chart?
Thanks in advance!
I'm going to answer my own question, and then maybe someone can explain to me why it is.
Placing those settings on the Y-Axis config does adjust the chart. Doesn't basic charting 101 dictate that X-Axis is left to right, and Y-Axis is up and down?
{yAxis: minTickInterval: 1} or {yAxis: allowDecimals: false}
both work.
Related
I want to restrict user to do maximum zoom to 80% for line chart in echarts. Is there any way to do so ?
Yes. You have at least two ways:
The easiest and comfortable:
Add to config component DataZoom, setup it as you needed and hide. The component won't show up but will work. And for the last step just dispatch the action dataZoom:
chartInstance.dispatchAction({
type: 'dataZoom',
dataZoomIndex: 0,
// set as percents
start: '20%',
end: '80%',
// or set as values
startValue: 1234,
endValue: 4321
})
Difficult way:
The each Axes in Echarts has two attributes: min and max that can control view window of axis. Just change it as you need. Also you can pass callback to attributes that will change the value when Echarts draw chart.
This is probably a simple problem. I am trying to find out how to move a vertical axis title closer to the axis in Google charts. Can anyone help? Thanks
From https://developers.google.com/chart/interactive/docs/customizing_axes:
Label positioning and style - You can customize label positioning and style using the hAxis/vAxis.textPosition and hAxis/vAxis.textStyle options.
EDIT:
Tested using this fiddle
replace vAxis: {title: 'Year', with vAxis: {title: '\nYear', would "nudge" your Axis title closer
how can I move yAxis labels from Right of chart to left of chart in highstock.
Here is a jsfiddle example in which we have labels like Fresh Breeze on the right side of chart which I want it on the left.
In the previous version of Highstock it is was on left by default.
I have also tried the property align:left inside the yAxis options but it does not give the desired result.
Thanks
You don't want to set align:left at the axis level, you need to use it on the plotband label level.
The code in that example is explicitly telling the chart to align the plot band labels to the right, and push them an extra 40 pixels right as well.
Change that to align:left, and x:0
(or, just don't set the align or x properties at all, and by default the labels will be on the left, as they've always been...)
example:
http://jsfiddle.net/jlbriggs/LKtpc/28/
{{EDIT:
Your original question referenced the plotband labels in highcharts...
But it seems your question is really about the y axis placement in Highstock.
To move it to the left, you need to add this:
yAxis: {
opposite:false
}
as Highstock sets the axis to opposite:true by default.
Example:
http://jsfiddle.net/aayajgLe/1/
In order to put your yAxis label to the left side, just set yAxis' opposite property to false.
yAxis: {
opposite: false
}
It seems not intuitive, though.
I'm using the dojox/charting/plot2d/Spider to show a Spider chart and having at least 3 series at a time in the same chart makes it difficult to see the actual strokes that are the important thing there. Is there any way to remove the fill?
I've tried the following but it ends up black.
chart.addSeries("test", { data: whatever }, { fill: "transparent" });
Any help is appreciated!
I've found the right option! If you set seriesFillAlpha to 0 when adding the Spider plot then the fill doesn't show up.
Example:
new Chart(someNode)
.addPlot("default", {
type: Spider,
seriesFillAlpha: 0.1
});
Hope this helps somebody.
I need to align the series lines to the right of the chart. It is always centered. How I can do it?
The Q3 version of the Chart supports a justified setting for each axis. It stretches line and area series to the very end of the axis.
categoryAxis: {
justified: true
}
See a live demo here: JS Bin
I hope I understood your question correctly.