Using ECharts I am giving it a data series that consists of a number of data against really values. (e.g plotting stock prices).
I also have data zoom enabled.
My issue is that the generated X axis' labels overlap with the dataZoom. I can't understand from the documentation how to fix this.
You need to set the value of grid.bottom. This will move the whole grid further from the bottom of the canvas and pull the whole X Axis with it.
Example: grid: { bottom: 60 }
// usage
this._displayedChart.setOption({ grid: { bottom: 10 } })
Not a great solution but works.
https://ecomfe.github.io/echarts-doc/public/en/option.html#grid.bottom
Related
I have been attempting to get a google chart to show each and every specified value labeled along the vAxis.
Currently, the most I can can get it to show is a label for every other tick. It seems like there should be a way to get around this.
Here's what I'm seeing:
I have the vAxis options set like this:
vAxis: {
ticks: [1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20,21],
direction: -1,
minValue: 0,
maxValue:20,
showTextEvery:1
}
What I need is for it to label each and every row, meaning 1,2,3,4,5, etc... instead of just 1,3,5,9....
if the values are specified in the vAxis.ticks option and still do not appear,
then you will need to either increase the height of the chart and / or chart area...
height
chartArea.height
or decrease the font size...
vAxis.textStyle.fontSize
For a bar or column chart in Highcharts, is there a setting(s) to make it automatically set the min of the y-axis based on the min of the data? For example, if my data values fall between 200 and 300, then the plot doesn't look so good if the chart y-axis starts at 0, but rather it looks much better if the y-axis min is 200.
My current approach is supply the yAxis.min setting the minimum vale from the data subtracted by some "smart offset" (smart offset so that the min of the data is not plotted at the very bottom). The problem is i'm not 100% yet how to calculate that "smart offset" so I'm wondering if Higcharts can do the min from the data for me (rather than supplying it), then it might be able also figure out that offset.
You need to enable softThreshold property:
softThreshold: boolean
When this is true, the series will not cause the Y axis to cross the
zero plane (or threshold option) unless the data actually crosses the
plane. (...)
series: [{
softThreshold: true,
...
}]
Live demo: http://jsfiddle.net/BlackLabel/05tgmz9c/
API Reference: https://api.highcharts.com/highstock/series.column.softThreshold
I have a single data series and need the bars stacked right next to each other. What Google Visualization API call / property would help me accomplish this?
Set the bar.groupWidth option. You can either set it as an integer (number of pixels for the group to take up) or as a percent of the available space. In your case, I suggest using the percent:
bar: {
groupWidth: '100%'
}
That will remove all space from between adjacent bars.
I am trying to implement drag and drop functionality in highcharts. But I am facing 2 problems:
Secondary Y-Axis is not seems to be working, any reason why the line of for Phasing series is showing like this?
How can I show the sum of Phasing series in tooltip while user is dragging, how can I do it in drag event?
Basically only the uplift series is draggable and the sum of all points in that series should be exactly 100.
Since all points have the same calue, Highcharts can't calculate yAxis - set min or max for second yAxis, to give some more information for calculations: http://jsfiddle.net/ZQQpS/9/
Why you want to do it in drag event? Use tooltip.formatter - there loop through all points using this.point.series.data and sum values to display in a tooltip.
I am using the MS Chart Control in a Windows application.
I am charting various series dynamically and the user can specify which charttype each series should be. This leads to situations where pie charts are combined with line/spline charts etc..
When at least one series is specified to be a pie chart, I am dynamically adding chartareas and legends to give each of these series their own chartarea, while all the "basic" charttypes (line(area)/spline(area)/etc.) are combined into a single chartarea.
The issue is that when adding 10+ series where the majority are pie charts, the charts are resized so small, they become useless. My thought was to dynamically increase the size of the chart control (thereby increasing the size of all chartareas within). My issue is, the width and height of the InnerPlotPosition are always zero unless I set them explicitly.
Is there any way to determine the size of the Plotting Area in pixels or percentage (which I could multiply by the chart controls size to get pixels), etc. even if not explicitly set? This would allow me to increase the chart controls size until some minimum ( and hopefully, readable) value was reached.
I find that InnerPlotPosition is set at least in a PostPaint event callback. You may be checking that property before the Plot Area has been calculated.
This works:
var c = new Chart();
c.PostPaint += c_PostPaint;
// Do whatever to setup the chart
// Then in my case I'm saving the image which causes rendering
c.SaveImage(myFileName);
void c_PostPaint(object sender, ChartPaintEventArgs e)
{
var ipp = e.Chart.ChartAreas[0].InnerPlotPosition; // Values populated here
}