fix: add watermark for chart

superset-frontend/package.json

@@ -335,6 +335,7 @@
     "react-test-renderer": "^16.9.0",
     "redux-mock-store": "^1.5.4",
     "sinon": "^9.0.2",
+    "source-map": "^0.7.4",
     "source-map-support": "^0.5.21",
     "speed-measure-webpack-plugin": "^1.5.0",
     "storybook-addon-jsx": "^7.3.14",

superset-frontend/src/dashboard/components/gridComponents/Chart.jsx

@@ -42,6 +42,7 @@ import { slicePropShape, chartPropShape } from '../../util/propShapes';
 
 import { isFilterBox } from '../../util/activeDashboardFilters';
 import getFilterValuesByFilterId from '../../util/getFilterValuesByFilterId';
+import watermarkImage from '../../../assets/images/ortege-logo-horiz.png';
 
 const propTypes = {
   id: PropTypes.number.isRequired,
@@ -119,6 +120,29 @@ const ChartOverlay = styled.div`
   z-index: 5;
 `;
 
+
+const ChartWaterMark = styled.div`
+  position: absolute;
+  top: 0;
+  bottom: 0;
+  left: 0;
+  right: 0;
+  max-width: min(50%,20rem);
+  max-height: min(25%,20rem);
+  margin: auto;
+  pointer-events: none;
+  opacity: .2;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+`;
+
+const WatermarkImage = styled.img`
+  max-width: 100%;
+  max-height: 100%;
+`;
+
+
 const SliceContainer = styled.div`
   display: flex;
   flex-direction: column;
@@ -424,9 +448,9 @@ class Chart extends React.Component {
     const isOverflowable = OVERFLOWABLE_VIZ_TYPES.has(slice.viz_type);
     const initialValues = isFilterBox(id)
       ? getFilterValuesByFilterId({
-          activeFilters: filters,
-          filterId: id,
-        })
+        activeFilters: filters,
+        filterId: id,
+      })
       : {};
 
     return (
@@ -504,6 +528,10 @@ class Chart extends React.Component {
             />
           )}
 
+          <ChartWaterMark>
+            <WatermarkImage src={watermarkImage} />
+          </ChartWaterMark>
+
           <ChartContainer
             width={width}
             height={this.getChartHeight()}