diff --git a/src/components/chart/ha-chart-base.ts b/src/components/chart/ha-chart-base.ts
index 22249c6889..8570d46511 100644
--- a/src/components/chart/ha-chart-base.ts
+++ b/src/components/chart/ha-chart-base.ts
@@ -168,14 +168,16 @@ export class HaChartBase extends LitElement {
   }
 
   protected firstUpdated() {
-    this._setupChart();
+    if (this.isConnected) {
+      this._setupChart();
+    }
   }
 
   public willUpdate(changedProps: PropertyValues): void {
     if (!this.chart) {
       return;
     }
-    if (changedProps.has("_themes")) {
+    if (changedProps.has("_themes") && this.hasUpdated) {
       this._setupChart();
       return;
     }
@@ -802,6 +804,7 @@ export class HaChartBase extends LitElement {
         };
       }
     }
+
     const replaceMerge = options.series ? ["series"] : [];
     this.chart.setOption(options, { replaceMerge });
   }
diff --git a/src/components/chart/ha-network-graph.ts b/src/components/chart/ha-network-graph.ts
index fb4477d8a7..414210eb7a 100644
--- a/src/components/chart/ha-network-graph.ts
+++ b/src/components/chart/ha-network-graph.ts
@@ -105,12 +105,14 @@ export class HaNetworkGraph extends SubscribeMixin(LitElement) {
   }
 
   protected render() {
-    if (!GraphChart) {
+    if (!GraphChart || !this.data.nodes?.length) {
       return nothing;
     }
+
     const isMobile = window.matchMedia(
       "all and (max-width: 450px), all and (max-height: 500px)"
     ).matches;
+
     return html`<ha-chart-base
       .hass=${this.hass}
       .data=${this._getSeries(
@@ -243,6 +245,7 @@ export class HaNetworkGraph extends SubscribeMixin(LitElement) {
   ) {
     const containerWidth = this.clientWidth;
     const containerHeight = this.clientHeight;
+
     const positionedNodes: NetworkNode[] = nodes.map((node) => ({ ...node }));
     positionedNodes.forEach((node) => {
       if (nodePositions[node.id]) {