diff --git a/packages/jaeger-ui/src/components/Monitor/ServicesView/__snapshots__/serviceGraph.test.js.snap b/packages/jaeger-ui/src/components/Monitor/ServicesView/__snapshots__/serviceGraph.test.js.snap
index b4aba88d6d..def2f5df7f 100644
--- a/packages/jaeger-ui/src/components/Monitor/ServicesView/__snapshots__/serviceGraph.test.js.snap
+++ b/packages/jaeger-ui/src/components/Monitor/ServicesView/__snapshots__/serviceGraph.test.js.snap
@@ -80,6 +80,12 @@ exports[`<ServiceGraph> Base graph should be displayed  1`] = `
     }
     onMouseLeave={[Function]}
     width={300}
+    xDomain={
+      Array [
+        1,
+        2,
+      ]
+    }
   >
     <XAxis
       attr="x"
@@ -190,6 +196,12 @@ exports[`<ServiceGraph> Base graph with custom color should be displayed 1`] = `
     }
     onMouseLeave={[Function]}
     width={300}
+    xDomain={
+      Array [
+        1,
+        2,
+      ]
+    }
   >
     <XAxis
       attr="x"
@@ -300,6 +312,12 @@ exports[`<ServiceGraph> Base graph with horizontal lines should be displayed 1`]
     }
     onMouseLeave={[Function]}
     width={300}
+    xDomain={
+      Array [
+        1,
+        2,
+      ]
+    }
   >
     <HorizontalGridLines
       attr="y"
@@ -414,6 +432,12 @@ exports[`<ServiceGraph> Base graph with legends should be displayed 1`] = `
     }
     onMouseLeave={[Function]}
     width={300}
+    xDomain={
+      Array [
+        1,
+        2,
+      ]
+    }
   >
     <XAxis
       attr="x"
@@ -545,6 +569,12 @@ exports[`<ServiceGraph> Crosshair map test 1`] = `
     }
     onMouseLeave={[Function]}
     width={300}
+    xDomain={
+      Array [
+        1,
+        2,
+      ]
+    }
   >
     <XAxis
       attr="x"
@@ -679,3 +709,34 @@ exports[`<ServiceGraph> Loading indicator is displayed 1`] = `
   </div>
 </div>
 `;
+
+exports[`<ServiceGraph> Loading indicator is displayed when xDomain is empty 1`] = `
+<div
+  className="graph-container "
+  style={
+    Object {
+      "height": 242,
+    }
+  }
+>
+  <h3
+    className="graph-header"
+  >
+    Hello Graph
+  </h3>
+  <div
+    className="center-placeholder"
+    style={
+      Object {
+        "height": 168,
+        "width": 300,
+      }
+    }
+  >
+    <LoadingIndicator
+      centered={true}
+      small={false}
+    />
+  </div>
+</div>
+`;
diff --git a/packages/jaeger-ui/src/components/Monitor/ServicesView/serviceGraph.test.js b/packages/jaeger-ui/src/components/Monitor/ServicesView/serviceGraph.test.js
index 25bcc51807..6bfaff47fe 100644
--- a/packages/jaeger-ui/src/components/Monitor/ServicesView/serviceGraph.test.js
+++ b/packages/jaeger-ui/src/components/Monitor/ServicesView/serviceGraph.test.js
@@ -25,6 +25,7 @@ const props = {
   loading: true,
   marginClassName: '',
   crosshairValues: [],
+  xDomain: [1, 2],
 };
 
 describe('<ServiceGraph>', () => {
@@ -42,6 +43,11 @@ describe('<ServiceGraph>', () => {
     expect(wrapper).toMatchSnapshot();
   });
 
+  it('Loading indicator is displayed when xDomain is empty', () => {
+    wrapper.setProps({ ...props, xDomain: [], loading: false });
+    expect(wrapper).toMatchSnapshot();
+  });
+
   it('"No data" displayed', () => {
     wrapper.setProps({ ...props, loading: false });
     expect(wrapper).toMatchSnapshot();
diff --git a/packages/jaeger-ui/src/components/Monitor/ServicesView/serviceGraph.tsx b/packages/jaeger-ui/src/components/Monitor/ServicesView/serviceGraph.tsx
index b2e1dfa4e9..a7bd604f4f 100644
--- a/packages/jaeger-ui/src/components/Monitor/ServicesView/serviceGraph.tsx
+++ b/packages/jaeger-ui/src/components/Monitor/ServicesView/serviceGraph.tsx
@@ -198,7 +198,7 @@ export class ServiceGraphImpl extends React.PureComponent<TProps> {
       </XYPlot>
     );
 
-    if (!loading) {
+    if (!loading && xDomain.length > 0) {
       GraphComponent = metricsData === null ? noDataComponent : Plot;
     }