Chart size problem about vaadin-chartjs HOT 9 CLOSED

Could you please provide a example because in the demo I don't see that behaviour.

from vaadin-chartjs.

Same problem here, but with two behaviors:

When navigate to view (Problem):

When call browser refresh (Ok):

No mystery on layout, just setSizeFull() on Chart component.

from vaadin-chartjs.

@dyorgio thanks for the clarification

from vaadin-chartjs.

@moberwasserlechner @gokhanoner
If you put on charts-connector.js this line:

canvas.setAttribute('height', '100%');

The problem stops, but, in my retina display (HDPi), the chart appears smooth (bad rendered).

from vaadin-chartjs.

@dyorgio
Your retina display issue might be related to chartjs/Chart.js#3575.

Could you please share your configuration, because in the mentioned issue resizing problems appear if 'responsive' option was set to false.

from vaadin-chartjs.

@moberwasserlechner I made new test with this modification:

• Update Chartjs to 2.4.0.

Now the problem only occurs if I use

chart.maintainAspectRatio(true).

But, using

chart.maintainAspectRatio(false)

works perfectly to me, including responsive resizing.

Animations stopped to work using % sizes, if I change to pixels animations works ok.

from vaadin-chartjs.

@moberwasserlechner
I investigate some time for analysing why the chart is not sized correctly
I find the following in chartjs-connector.js:
if (state.width > 0) {

The width in state object is a string (e.g. 100%) state.width > 0 will always return false. If you change the line to state.width.length > 0 or something similar it should work.

Best regards

from vaadin-chartjs.

@Maegar @dyorgio thx for that. I hope I can get a new release ready soon.

from vaadin-chartjs.

I'm just looking to the demo site, pie with data refresh example. When I refresh the data, chart size incorrectly until you resize the browser.

from vaadin-chartjs.