diff --git a/package.json b/package.json
index 5d4c165c55899..0274034d12c2b 100644
--- a/package.json
+++ b/package.json
@@ -120,7 +120,7 @@
     "@babel/plugin-transform-modules-commonjs": "^7.10.1",
     "@babel/register": "^7.10.1",
     "@elastic/apm-rum": "^5.2.0",
-    "@elastic/charts": "19.2.0",
+    "@elastic/charts": "19.5.2",
     "@elastic/datemath": "5.0.3",
     "@elastic/ems-client": "7.9.3",
     "@elastic/eui": "24.1.0",
diff --git a/packages/kbn-ui-shared-deps/package.json b/packages/kbn-ui-shared-deps/package.json
index 9ea006cff2841..fe4d3d06517d2 100644
--- a/packages/kbn-ui-shared-deps/package.json
+++ b/packages/kbn-ui-shared-deps/package.json
@@ -9,7 +9,7 @@
     "kbn:watch": "node scripts/build --dev --watch"
   },
   "dependencies": {
-    "@elastic/charts": "19.2.0",
+    "@elastic/charts": "19.5.2",
     "@elastic/eui": "24.1.0",
     "@elastic/numeral": "^2.5.0",
     "@kbn/i18n": "1.0.0",
diff --git a/x-pack/plugins/lens/public/xy_visualization/__snapshots__/xy_expression.test.tsx.snap b/x-pack/plugins/lens/public/xy_visualization/__snapshots__/xy_expression.test.tsx.snap
index f8f467b25643b..fc5ed7480dd1f 100644
--- a/x-pack/plugins/lens/public/xy_visualization/__snapshots__/xy_expression.test.tsx.snap
+++ b/x-pack/plugins/lens/public/xy_visualization/__snapshots__/xy_expression.test.tsx.snap
@@ -4,7 +4,7 @@ exports[`xy_expression XYChart component it renders area 1`] = `
 <Chart
   renderer="canvas"
 >
-  <Connect(spec)
+  <Connect(SpecInstance)
     legendPosition="top"
     onBrushEnd={[Function]}
     onElementClick={[Function]}
@@ -13,21 +13,21 @@ exports[`xy_expression XYChart component it renders area 1`] = `
     showLegendExtra={false}
     theme={Object {}}
   />
-  <Connect(spec)
+  <Connect(SpecInstance)
     id="x"
     position="bottom"
     showGridLines={false}
     tickFormat={[Function]}
     title="c"
   />
-  <Connect(spec)
+  <Connect(SpecInstance)
     id="y"
     position="left"
     showGridLines={false}
     tickFormat={[Function]}
     title=""
   />
-  <Connect(spec)
+  <Connect(SpecInstance)
     data={
       Array [
         Object {
@@ -72,7 +72,7 @@ exports[`xy_expression XYChart component it renders bar 1`] = `
 <Chart
   renderer="canvas"
 >
-  <Connect(spec)
+  <Connect(SpecInstance)
     legendPosition="top"
     onBrushEnd={[Function]}
     onElementClick={[Function]}
@@ -81,21 +81,21 @@ exports[`xy_expression XYChart component it renders bar 1`] = `
     showLegendExtra={false}
     theme={Object {}}
   />
-  <Connect(spec)
+  <Connect(SpecInstance)
     id="x"
     position="bottom"
     showGridLines={false}
     tickFormat={[Function]}
     title="c"
   />
-  <Connect(spec)
+  <Connect(SpecInstance)
     id="y"
     position="left"
     showGridLines={false}
     tickFormat={[Function]}
     title=""
   />
-  <Connect(spec)
+  <Connect(SpecInstance)
     data={
       Array [
         Object {
@@ -140,7 +140,7 @@ exports[`xy_expression XYChart component it renders horizontal bar 1`] = `
 <Chart
   renderer="canvas"
 >
-  <Connect(spec)
+  <Connect(SpecInstance)
     legendPosition="top"
     onBrushEnd={[Function]}
     onElementClick={[Function]}
@@ -149,21 +149,21 @@ exports[`xy_expression XYChart component it renders horizontal bar 1`] = `
     showLegendExtra={false}
     theme={Object {}}
   />
-  <Connect(spec)
+  <Connect(SpecInstance)
     id="x"
     position="left"
     showGridLines={false}
     tickFormat={[Function]}
     title="c"
   />
-  <Connect(spec)
+  <Connect(SpecInstance)
     id="y"
     position="bottom"
     showGridLines={false}
     tickFormat={[Function]}
     title=""
   />
-  <Connect(spec)
+  <Connect(SpecInstance)
     data={
       Array [
         Object {
@@ -208,7 +208,7 @@ exports[`xy_expression XYChart component it renders line 1`] = `
 <Chart
   renderer="canvas"
 >
-  <Connect(spec)
+  <Connect(SpecInstance)
     legendPosition="top"
     onBrushEnd={[Function]}
     onElementClick={[Function]}
@@ -217,21 +217,21 @@ exports[`xy_expression XYChart component it renders line 1`] = `
     showLegendExtra={false}
     theme={Object {}}
   />
-  <Connect(spec)
+  <Connect(SpecInstance)
     id="x"
     position="bottom"
     showGridLines={false}
     tickFormat={[Function]}
     title="c"
   />
-  <Connect(spec)
+  <Connect(SpecInstance)
     id="y"
     position="left"
     showGridLines={false}
     tickFormat={[Function]}
     title=""
   />
-  <Connect(spec)
+  <Connect(SpecInstance)
     data={
       Array [
         Object {
@@ -276,7 +276,7 @@ exports[`xy_expression XYChart component it renders stacked area 1`] = `
 <Chart
   renderer="canvas"
 >
-  <Connect(spec)
+  <Connect(SpecInstance)
     legendPosition="top"
     onBrushEnd={[Function]}
     onElementClick={[Function]}
@@ -285,21 +285,21 @@ exports[`xy_expression XYChart component it renders stacked area 1`] = `
     showLegendExtra={false}
     theme={Object {}}
   />
-  <Connect(spec)
+  <Connect(SpecInstance)
     id="x"
     position="bottom"
     showGridLines={false}
     tickFormat={[Function]}
     title="c"
   />
-  <Connect(spec)
+  <Connect(SpecInstance)
     id="y"
     position="left"
     showGridLines={false}
     tickFormat={[Function]}
     title=""
   />
-  <Connect(spec)
+  <Connect(SpecInstance)
     data={
       Array [
         Object {
@@ -348,7 +348,7 @@ exports[`xy_expression XYChart component it renders stacked bar 1`] = `
 <Chart
   renderer="canvas"
 >
-  <Connect(spec)
+  <Connect(SpecInstance)
     legendPosition="top"
     onBrushEnd={[Function]}
     onElementClick={[Function]}
@@ -357,21 +357,21 @@ exports[`xy_expression XYChart component it renders stacked bar 1`] = `
     showLegendExtra={false}
     theme={Object {}}
   />
-  <Connect(spec)
+  <Connect(SpecInstance)
     id="x"
     position="bottom"
     showGridLines={false}
     tickFormat={[Function]}
     title="c"
   />
-  <Connect(spec)
+  <Connect(SpecInstance)
     id="y"
     position="left"
     showGridLines={false}
     tickFormat={[Function]}
     title=""
   />
-  <Connect(spec)
+  <Connect(SpecInstance)
     data={
       Array [
         Object {
@@ -420,7 +420,7 @@ exports[`xy_expression XYChart component it renders stacked horizontal bar 1`] =
 <Chart
   renderer="canvas"
 >
-  <Connect(spec)
+  <Connect(SpecInstance)
     legendPosition="top"
     onBrushEnd={[Function]}
     onElementClick={[Function]}
@@ -429,21 +429,21 @@ exports[`xy_expression XYChart component it renders stacked horizontal bar 1`] =
     showLegendExtra={false}
     theme={Object {}}
   />
-  <Connect(spec)
+  <Connect(SpecInstance)
     id="x"
     position="left"
     showGridLines={false}
     tickFormat={[Function]}
     title="c"
   />
-  <Connect(spec)
+  <Connect(SpecInstance)
     id="y"
     position="bottom"
     showGridLines={false}
     tickFormat={[Function]}
     title=""
   />
-  <Connect(spec)
+  <Connect(SpecInstance)
     data={
       Array [
         Object {
diff --git a/x-pack/plugins/uptime/public/components/common/charts/__tests__/__snapshots__/monitor_bar_series.test.tsx.snap b/x-pack/plugins/uptime/public/components/common/charts/__tests__/__snapshots__/monitor_bar_series.test.tsx.snap
index b389139d71dbf..1db4a87b1c37b 100644
--- a/x-pack/plugins/uptime/public/components/common/charts/__tests__/__snapshots__/monitor_bar_series.test.tsx.snap
+++ b/x-pack/plugins/uptime/public/components/common/charts/__tests__/__snapshots__/monitor_bar_series.test.tsx.snap
@@ -7,6 +7,10 @@ exports[`MonitorBarSeries component renders if the data series is present 1`] =
   <div
     class="echChart"
   >
+    <div
+      class="echChartBackground"
+      style="background-color:transparent"
+    />
     <div
       class="echChartStatus"
       data-ech-render-complete="false"
@@ -17,15 +21,7 @@ exports[`MonitorBarSeries component renders if the data series is present 1`] =
     />
     <div
       class="echContainer"
-    >
-      <div
-        class="echReactiveChart_unavailable"
-      >
-        <p>
-          No data to display
-        </p>
-      </div>
-    </div>
+    />
   </div>
 </div>
 `;
diff --git a/x-pack/plugins/uptime/public/components/common/charts/__tests__/__snapshots__/ping_histogram.test.tsx.snap b/x-pack/plugins/uptime/public/components/common/charts/__tests__/__snapshots__/ping_histogram.test.tsx.snap
index db07faae44272..668e4e0c064a8 100644
--- a/x-pack/plugins/uptime/public/components/common/charts/__tests__/__snapshots__/ping_histogram.test.tsx.snap
+++ b/x-pack/plugins/uptime/public/components/common/charts/__tests__/__snapshots__/ping_histogram.test.tsx.snap
@@ -14,6 +14,10 @@ Array [
     <div
       class="echChart"
     >
+      <div
+        class="echChartBackground"
+        style="background-color:transparent"
+      />
       <div
         class="echChartStatus"
         data-ech-render-complete="false"
@@ -24,15 +28,7 @@ Array [
       />
       <div
         class="echContainer"
-      >
-        <div
-          class="echReactiveChart_unavailable"
-        >
-          <p>
-            No data to display
-          </p>
-        </div>
-      </div>
+      />
     </div>
   </div>,
 ]
diff --git a/yarn.lock b/yarn.lock
index d3dd4aeabfdb6..4715703e86b83 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -2208,11 +2208,13 @@
   dependencies:
     "@elastic/apm-rum-core" "^5.3.0"
 
-"@elastic/charts@19.2.0":
-  version "19.2.0"
-  resolved "https://registry.yarnpkg.com/@elastic/charts/-/charts-19.2.0.tgz#45db8c80e4699e5088a1771f190171c1144c5242"
-  integrity sha512-uhk73OQPaxg7l54gfr+kv+c6jiEngewwH408OySzJbnH23z/5sIpLSziZhV33I6bs/LKDXQSqamC9Jh6Xcwk1A==
+"@elastic/charts@19.5.2":
+  version "19.5.2"
+  resolved "https://registry.yarnpkg.com/@elastic/charts/-/charts-19.5.2.tgz#6117f7b3acce6deef0a4f272ae491d99d2e3b1e0"
+  integrity sha512-6GdqwVrDwQu+h5GUXpwy9a8dQ66oTNl3SO+ih1sljWvni+f/wcsrRcCTJUP99vtUcPQ8BT9Pn79QknBk1ZOH5Q==
   dependencies:
+    "@popperjs/core" "^2.4.0"
+    chroma-js "^2.1.0"
     classnames "^2.2.6"
     d3-array "^1.2.4"
     d3-collection "^1.0.7"
@@ -3506,6 +3508,11 @@
     which "^2.0.1"
     winston "^3.0.0"
 
+"@popperjs/core@^2.4.0":
+  version "2.4.2"
+  resolved "https://registry.yarnpkg.com/@popperjs/core/-/core-2.4.2.tgz#7c6dc4ecef16149fd7a736710baa1b811017fdca"
+  integrity sha512-JlGTGRYHC2QK+DDbePyXdBdooxFq2+noLfWpRqJtkxcb/oYWzOF0kcbfvvbWrwevCC1l6hLUg1wHYT+ona5BWQ==
+
 "@reach/router@^1.2.1":
   version "1.2.1"
   resolved "https://registry.yarnpkg.com/@reach/router/-/router-1.2.1.tgz#34ae3541a5ac44fa7796e5506a5d7274a162be4e"
@@ -9990,7 +9997,7 @@ chroma-js@^1.4.1:
   resolved "https://registry.yarnpkg.com/chroma-js/-/chroma-js-1.4.1.tgz#eb2d9c4d1ff24616be84b35119f4d26f8205f134"
   integrity sha512-jTwQiT859RTFN/vIf7s+Vl/Z2LcMrvMv3WUFmd/4u76AdlFC0NTNgqEEFPcRiHmAswPsMiQEDZLM8vX8qXpZNQ==
 
-chroma-js@^2.0.4:
+chroma-js@^2.0.4, chroma-js@^2.1.0:
   version "2.1.0"
   resolved "https://registry.yarnpkg.com/chroma-js/-/chroma-js-2.1.0.tgz#c0be48a21fe797ef8965608c1c4f911ef2da49d5"
   integrity sha512-uiRdh4ZZy+UTPSrAdp8hqEdVb1EllLtTHOt5TMaOjJUvi+O54/83Fc5K2ld1P+TJX+dw5B+8/sCgzI6eaur/lg==