summaryrefslogtreecommitdiff
path: root/frontend/src/components/app/map/elements
diff options
context:
space:
mode:
authorGeorgios Andreadis <info@gandreadis.com>2020-07-22 14:07:39 +0200
committerFabian Mastenbroek <mail.fabianm@gmail.com>2020-08-24 19:48:18 +0200
commit92ce9387f5c3ce54b4077ef6a5f604fc2cfe6ade (patch)
tree90432dbd06a13d300f8307dea342f4639c9c57e7 /frontend/src/components/app/map/elements
parentae8f03d514ba0982a34b96f1e29e262ca6048a19 (diff)
parent8739a156b75ba96e15d1bb19b08ca829c1eb01e8 (diff)
Merge pull request #12 from atlarge-research/feature/scenario-plots
Plotting of portfolio results
Diffstat (limited to 'frontend/src/components/app/map/elements')
-rw-r--r--frontend/src/components/app/map/elements/Backdrop.js10
-rw-r--r--frontend/src/components/app/map/elements/RackFillBar.js35
-rw-r--r--frontend/src/components/app/map/elements/TilePlusIcon.js8
-rw-r--r--frontend/src/components/app/map/elements/WallSegment.js9
4 files changed, 11 insertions, 51 deletions
diff --git a/frontend/src/components/app/map/elements/Backdrop.js b/frontend/src/components/app/map/elements/Backdrop.js
index 556d6a7b..8ccfe584 100644
--- a/frontend/src/components/app/map/elements/Backdrop.js
+++ b/frontend/src/components/app/map/elements/Backdrop.js
@@ -3,14 +3,6 @@ import { Rect } from 'react-konva'
import { BACKDROP_COLOR } from '../../../../util/colors'
import { MAP_SIZE_IN_PIXELS } from '../MapConstants'
-const Backdrop = () => (
- <Rect
- x={0}
- y={0}
- width={MAP_SIZE_IN_PIXELS}
- height={MAP_SIZE_IN_PIXELS}
- fill={BACKDROP_COLOR}
- />
-)
+const Backdrop = () => <Rect x={0} y={0} width={MAP_SIZE_IN_PIXELS} height={MAP_SIZE_IN_PIXELS} fill={BACKDROP_COLOR} />
export default Backdrop
diff --git a/frontend/src/components/app/map/elements/RackFillBar.js b/frontend/src/components/app/map/elements/RackFillBar.js
index 6e56e059..8c573a6f 100644
--- a/frontend/src/components/app/map/elements/RackFillBar.js
+++ b/frontend/src/components/app/map/elements/RackFillBar.js
@@ -21,27 +21,14 @@ const RackFillBar = ({ positionX, positionY, type, fillFraction }) => {
const x =
positionX * TILE_SIZE_IN_PIXELS +
OBJECT_MARGIN_IN_PIXELS +
- (type === 'space'
- ? halfOfObjectBorderWidth
- : 0.5 * (TILE_SIZE_IN_PIXELS - 2 * OBJECT_MARGIN_IN_PIXELS))
- const startY =
- positionY * TILE_SIZE_IN_PIXELS +
- OBJECT_MARGIN_IN_PIXELS +
- halfOfObjectBorderWidth
- const width =
- 0.5 * (TILE_SIZE_IN_PIXELS - OBJECT_MARGIN_IN_PIXELS * 2) -
- halfOfObjectBorderWidth
- const fullHeight =
- TILE_SIZE_IN_PIXELS -
- OBJECT_MARGIN_IN_PIXELS * 2 -
- OBJECT_BORDER_WIDTH_IN_PIXELS
+ (type === 'space' ? halfOfObjectBorderWidth : 0.5 * (TILE_SIZE_IN_PIXELS - 2 * OBJECT_MARGIN_IN_PIXELS))
+ const startY = positionY * TILE_SIZE_IN_PIXELS + OBJECT_MARGIN_IN_PIXELS + halfOfObjectBorderWidth
+ const width = 0.5 * (TILE_SIZE_IN_PIXELS - OBJECT_MARGIN_IN_PIXELS * 2) - halfOfObjectBorderWidth
+ const fullHeight = TILE_SIZE_IN_PIXELS - OBJECT_MARGIN_IN_PIXELS * 2 - OBJECT_BORDER_WIDTH_IN_PIXELS
const fractionHeight = fillFraction * fullHeight
const fractionY =
- (positionY + 1) * TILE_SIZE_IN_PIXELS -
- OBJECT_MARGIN_IN_PIXELS -
- halfOfObjectBorderWidth -
- fractionHeight
+ (positionY + 1) * TILE_SIZE_IN_PIXELS - OBJECT_MARGIN_IN_PIXELS - halfOfObjectBorderWidth - fractionHeight
return (
<Group>
@@ -50,22 +37,14 @@ const RackFillBar = ({ positionX, positionY, type, fillFraction }) => {
y={startY}
width={width}
height={fullHeight}
- fill={
- type === 'space'
- ? RACK_SPACE_BAR_BACKGROUND_COLOR
- : RACK_ENERGY_BAR_BACKGROUND_COLOR
- }
+ fill={type === 'space' ? RACK_SPACE_BAR_BACKGROUND_COLOR : RACK_ENERGY_BAR_BACKGROUND_COLOR}
/>
<Rect
x={x}
y={fractionY}
width={width}
height={fractionHeight}
- fill={
- type === 'space'
- ? RACK_SPACE_BAR_FILL_COLOR
- : RACK_ENERGY_BAR_FILL_COLOR
- }
+ fill={type === 'space' ? RACK_SPACE_BAR_FILL_COLOR : RACK_ENERGY_BAR_FILL_COLOR}
/>
<ImageComponent
src={'/img/topology/rack-' + type + '-icon.png'}
diff --git a/frontend/src/components/app/map/elements/TilePlusIcon.js b/frontend/src/components/app/map/elements/TilePlusIcon.js
index dd6e0beb..be3a00a8 100644
--- a/frontend/src/components/app/map/elements/TilePlusIcon.js
+++ b/frontend/src/components/app/map/elements/TilePlusIcon.js
@@ -10,16 +10,12 @@ const TilePlusIcon = ({ pixelX, pixelY, mapScale }) => {
pixelX + 0.5 * TILE_SIZE_IN_PIXELS * mapScale,
pixelY + TILE_PLUS_MARGIN_IN_PIXELS * mapScale,
pixelX + 0.5 * TILE_SIZE_IN_PIXELS * mapScale,
- pixelY +
- TILE_SIZE_IN_PIXELS * mapScale -
- TILE_PLUS_MARGIN_IN_PIXELS * mapScale,
+ pixelY + TILE_SIZE_IN_PIXELS * mapScale - TILE_PLUS_MARGIN_IN_PIXELS * mapScale,
],
[
pixelX + TILE_PLUS_MARGIN_IN_PIXELS * mapScale,
pixelY + 0.5 * TILE_SIZE_IN_PIXELS * mapScale,
- pixelX +
- TILE_SIZE_IN_PIXELS * mapScale -
- TILE_PLUS_MARGIN_IN_PIXELS * mapScale,
+ pixelX + TILE_SIZE_IN_PIXELS * mapScale - TILE_PLUS_MARGIN_IN_PIXELS * mapScale,
pixelY + 0.5 * TILE_SIZE_IN_PIXELS * mapScale,
],
]
diff --git a/frontend/src/components/app/map/elements/WallSegment.js b/frontend/src/components/app/map/elements/WallSegment.js
index d1ba6157..8aa2aebf 100644
--- a/frontend/src/components/app/map/elements/WallSegment.js
+++ b/frontend/src/components/app/map/elements/WallSegment.js
@@ -22,14 +22,7 @@ const WallSegment = ({ wallSegment }) => {
]
}
- return (
- <Line
- points={points}
- lineCap="round"
- stroke={WALL_COLOR}
- strokeWidth={WALL_WIDTH_IN_PIXELS}
- />
- )
+ return <Line points={points} lineCap="round" stroke={WALL_COLOR} strokeWidth={WALL_WIDTH_IN_PIXELS} />
}
WallSegment.propTypes = {