trading-peter / chart-elements

Chart.js as Polymer Elements
https://robdodson.github.io/chart-elements
267 stars 70 forks source link

chart-bar does not render unless updateChart() is called after `attached` #29

Closed frontrangerider2004 closed 8 years ago

frontrangerider2004 commented 8 years ago

Hey Rob,

Thanks for putting these chart elements together!

Trying to get a <chart-bar> to work and noticed it will not render. The element exists in the DOM but the console prints a canvas undefined error during page load and you get a blank screen.

After page load I can get it to render by manually calling updateChart(). This appears to be related to life-cycle timing. I was able to solve both problems by doing two things:

  1. checking for isAttached within updateChart()
  2. calling updateChart() within the attached callback

See my Gist of char-bar for the complete code.

robdodson commented 8 years ago

Can you explain a bit more about how you're using it. It renders OK in the demo so I feel like there must be more going on. Are you using it within iron-pages or dynamically inserting it?

On Thu, Dec 3, 2015 at 4:01 PM, FrontRangeRider notifications@github.com wrote:

Hey Rob,

Thanks for putting these chart elements together!

Trying to get a to work and noticed it will not render. The element exists in the DOM but the console prints a canvas undefined error during page load and you get a blank screen.

After page load I can get it to render by manually calling updateChart(). This appears to be related to life-cycle timing. I was able to solve both problems by doing two things:

1.

checking for isAttached within updateChart() 2.

calling updateChart() within the attached callback

See my Gist of char-bar https://gist.github.com/frontrangerider2004/cf8171353eca8f4bebaa for the complete code.

— Reply to this email directly or view it on GitHub https://github.com/robdodson/chart-elements/issues/29.

frontrangerider2004 commented 8 years ago

Thanks for the quick response!

Happy to provide more detail. As a pre-cursor to doing anything with other elements I tried putting together a very basic sample.

  1. I created a custom element called <my-chart> to hold my data.
  2. I put an instance of <chart-bar> inside of that.
  3. I bound the data from <my-chart> to <chart-bar>
  4. I put my element inside my main app.html as the only element.

See this Gist for my example app

Eventually I'd like to use the chart inside a flex layout and have it be responsive...

robdodson commented 8 years ago

ok i think i see what may be causing the possible bug... i'll have to work on this a bit

On Thu, Dec 3, 2015 at 4:58 PM, FrontRangeRider notifications@github.com wrote:

Thanks for the quick response!

Happy to provide more detail. As a pre-cursor to doing anything with other elements I tried putting together a very basic sample.

1.

I created a custom element called to hold my data. 2.

I put an instance of inside of that. 3.

I bound the data from to 4.

I put my element inside my main app.html as the only element.

See this Gist for my example app https://gist.github.com/frontrangerider2004/fc68de9a9ed201e1dd57

Eventually I'd like to use the chart inside a flex layout and have it be responsive...

— Reply to this email directly or view it on GitHub https://github.com/robdodson/chart-elements/issues/29#issuecomment-161840927 .

robdodson commented 8 years ago

I just pushed a change to master. Would you mind trying again with that latest version?

frontrangerider2004 commented 8 years ago

Awesome! No problem. I probably won't get to it until tomorrow or Monday but it will be first on my list.

On Sat, Dec 5, 2015, 4:05 PM Rob Dodson notifications@github.com wrote:

I just pushed a change to master. Would you mind trying again with that latest version?

— Reply to this email directly or view it on GitHub https://github.com/robdodson/chart-elements/issues/29#issuecomment-162255622 .

frontrangerider2004 commented 8 years ago

Just tried the update and it works great! Good call on putting it in the data behavior as opposed to where I had it in the chart. Now all the chart elements can inherit it.

Thanks again!

robdodson commented 8 years ago

yay! glad that fixed it. let me know if you find anything else. I'm trying to spend more time on these elements now to improve them a bit

frontrangerider2004 commented 8 years ago

Awesome! I'll be integrating with some other code this week so I'll keep you posted.

On Mon, Dec 7, 2015, 5:10 PM Rob Dodson notifications@github.com wrote:

yay! glad that fixed it. let me know if you find anything else. I'm trying to spend more time on these elements now to improve them a bit

— Reply to this email directly or view it on GitHub https://github.com/robdodson/chart-elements/issues/29#issuecomment-162711294 .