diff --git a/src/cards/ha-weather-card.html b/src/cards/ha-weather-card.html
index eaac032fcc..3527023ed1 100644
--- a/src/cards/ha-weather-card.html
+++ b/src/cards/ha-weather-card.html
@@ -21,7 +21,7 @@
     <google-legacy-loader on-api-load='googleApiLoaded'></google-legacy-loader>
     <ha-card header='[[computeTitle(stateObj)]]'>
       <div class='content'>
-        <div id$='[[computeChartId(stateObj)]]'></div>
+        <div id='chart_id'></div>
         <ha-attributes state-obj='[[stateObj]]' extra-filters='forecast'></ha-attributes>
       </div>
     </ha-card>
@@ -50,10 +50,6 @@
       return stateObj.attributes.friendly_name;
     },
 
-    computeChartId: function (stateObj) {
-      return 'chart_area_' + stateObj.id;
-    },
-
     getDataArray: function () {
       var dataArray = [];
       var data = this.stateObj.attributes.forecast;
@@ -84,7 +80,7 @@
 
       if (!this.chartEngine) {
         this.chartEngine = new window.google.visualization.LineChart(
-          document.getElementById(this.computeChartId(this.stateObj)));
+          this.$.chart_id);
       }
 
       this.drawChart();