spacecruft/Farmbot-Web-App
spacecruft/Farmbot-Web-App
1
0
Fork 0
Code Issues Pull requests Releases Activity

shadow spread

Browse source
This commit is contained in:
Rory Aronson 2017-09-12 20:53:36 +08:00
parent fd0981c790
commit 075f89475c
2 changed files with 11 additions and 9 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
webpack/css/animations.scss
View file

@ -45,12 +45,10 @@
0% {
transform: scale(0.9);
fill-opacity: 0;
stroke-opacity: 0;
}
100% {
transform: scale(1);
fill-opacity: 0.2;
stroke-opacity: 1;
fill-opacity: 1;
}
}

16
webpack/farm_designer/map/layers/spread_layer.tsx
View file

@ -53,7 +53,14 @@ export class SpreadCircle extends
const { radius, x, y, id } = this.props.plant.body;
const { quadrant, gridSize } = this.props.mapTransformProps;
const { qx, qy } = getXYFromQuadrant(round(x), round(y), quadrant, gridSize);
return (
return <g>
<defs>
<radialGradient id="SpreadGradient">
<stop offset="90%" stopColor="rgba(0, 0, 0, 0.08)" />
<stop offset="100%" stopColor="rgba(0, 0, 0, 0)" />
</radialGradient>
</defs>
<circle
className="spread"
id={"spread-" + id}
@ -62,10 +69,7 @@ export class SpreadCircle extends
// Convert `spread` from diameter in cm to radius in mm.
// `radius * 10` is the default value for spread.
r={(this.state.spread || radius) / 2 * 10}
fillOpacity={0.2}
fill={"green"}
stroke={"green"}
strokeWidth={"1.5"} />
);
fill={"url(#SpreadGradient)"} />
</g>;
}
}