in this page https://ticr.live/ticker-demo.php
i am showing the data generated roughly in the last 15mins, in a TradingView chart widget.
I wish that all points are visible inside the chart, without the need to scroll the chart left horizontally to see the past values, in case there are many points.
So the whole chart should "fit" exactly the container div.
How is this achieved?
Thanks
Yes, you can fit all your data inside the chart by calling chart.timeScale().fitContent() method.
Related
Datalabels on the top bars in chart are getting cut off. Could you please provide me some suggestions
It looks like not the issue of chart.js but of the parent div mainly. You are crashing the divs of the container. Try resizing it
I am using amcharts and I have a grid layout on my page to store 3 elements: List, map and radar chart.
The radar chart doesn't display properly for some reason. It doesn't matter what dimensions and sizes I give to the parent div, it doesn't display the radar with all the labels. It always cuts off some of them.
I couldn't find anything about it in documentation or in here. Here are the results of my stylings: first, second third.
After unsuccessful attempts at altering CSS, I fixed it by adding a title of the chart at the top and label with opacity 0 at the bottom using charts prototypes in JS. I couldn't find any solution in documentation, but to set fixed maxHeight of the radar in pixels. The solution with pixels wouldn't work well with CSS-Grid.
fixed container
Does anyone know if it's possible with Chartist.js to ensure a horizontal bar chart takes full width of the chart container?
If you look at the screenshot you can see that the gray bar does not take up the whole width, based on the examples I would have thought that the highest value data point in the series would be scaled to fill to the end of the chart (and the axis scaled accordingly).
See screenshot.
A little late but I spent the afternoon trying to achieve the same thing with some success.
In short, I created a simple plugin that, on creation, dynamically adjusts the bar width based on the stepLength property.
https://jsfiddle.net/traviss0/gg1oj35x/
using JS charts:
http://www.jscharts.com/
This is the example, of what I am talking about, chart is overlapping table
http://char.web44.net/
I think it has something to do with layout, any suggestions how to fix it?
There is a margin-top of -321px on a div (the jscharts logo) inside of div#graph and it's pulling the content after #graph. You need to set a height on the #graph div, then everything will be pushed down correctly.
My GWT application consists of a "Dashboard" that has a few charts . I need to be able to hide and show charts as and when necessary.
As you can see in the jsfiddle below, i was able to hide the chart, but the invisible chart eats up mouse events(when the mouse hovers over the invisible chart the tooltips are still displayed).I need to stack another canvas on top of the chart when the chart is hidden.But since the chart is taking up the mouse events , my canvas cannot receive any. Any ideas as to how to fix this ?
http://jsfiddle.net/archerabi/vnBsx/1/
I think it's because you're only hiding the legend instead of the whole container. I changed .highcharts-legend to .highcharts-container and I think it solved that issue. See here