1👍
alert(this.chartID) displays the content of the chartID property of your element. This property contains the string “figure1”, since this is passed in as the attribute chartID="figure1".
this.chartID.getContext('2d') tries to call the function getContext() on this string. Since strings don’t contain this function, you get an “undefined is not a function” error.
this.$.chartID is undefined, because the object that is returned by the $ function contains properties which keys are the ids of the elements in the element’s template. So you can write this.$.figure1 but not this.$.chartID (this only works if you’d written <canvas id="chartID">)
Long story short, what you could do is writing this.$[this.chartID]. This accesses the element which id is this.chartID which in turn is “figure1”.
But the question is: why would you want to do this at all. Since the shadow DOM isolates all the DOM in your element from the outside, it doesn’t cause any problems if you simply write <canvas id="chart">. Even if you instantiate many chart-elements, these same ids don’t interfere with each other.
Additional note: There is a Chart.js Polymer element in the Polymer-Labs GitHub repository and Rob Dodson has also written some Chart.js Polymer elements.