1 files changed, 16 insertions, 0 deletions
diff --git a/opendc-web/opendc-web-ui/src/components/app/map/controls/ScaleIndicator.js b/opendc-web/opendc-web-ui/src/components/app/map/controls/ScaleIndicator.js
new file mode 100644
index 00000000..11c2f2d3
--- /dev/null
+++ b/opendc-web/opendc-web-ui/src/components/app/map/controls/ScaleIndicator.js
@@ -0,0 +1,16 @@
+import PropTypes from 'prop-types'
+import React from 'react'
+import { TILE_SIZE_IN_METERS, TILE_SIZE_IN_PIXELS } from '../MapConstants'
+import { scaleIndicator } from './ScaleIndicator.module.scss'
+
+const ScaleIndicator = ({ scale }) => (
+    <div className={scaleIndicator} style={{ width: TILE_SIZE_IN_PIXELS * scale }}>
+        {TILE_SIZE_IN_METERS}m
+    </div>
+)
+
+ScaleIndicator.propTypes = {
+    scale: PropTypes.number.isRequired,
+}
+
+export default ScaleIndicator