comunes/todos-contra-el-fuego-web
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Added opacity to maps

Browse source
This commit is contained in:
vjrj 2018-03-04 10:44:26 +01:00
parent 965a80fb3f
commit 815bbb48fe
1 changed files with 7 additions and 3 deletions
Download patch file Download diff file Expand all files Collapse all files

10
imports/ui/components/Maps/DefMapLayers.js
View file

@ -11,6 +11,8 @@ import { TileLayer, LayersControl } from 'react-leaflet';
const { BaseLayer } = LayersControl; const { BaseLayer } = LayersControl;
const defOpacity = 0.7;
class DefMapLayers extends Component { class DefMapLayers extends Component {
constructor(props) { constructor(props) {
super(props); super(props);
@ -31,6 +33,7 @@ class DefMapLayers extends Component {
const osmgraylayer = ( const osmgraylayer = (
<BaseLayer checked={this.props.gray} name={t('Mapa gris de OpenStreetMap')}> <BaseLayer checked={this.props.gray} name={t('Mapa gris de OpenStreetMap')}>
<TileLayer <TileLayer
opacity={defOpacity}
attribution="&copy; <a href=&quot;http://osm.org/copyright&quot;>OpenStreetMap</a> contributors" attribution="&copy; <a href=&quot;http://osm.org/copyright&quot;>OpenStreetMap</a> contributors"
url="https://tiles.wmflabs.org/bw-mapnik/{z}/{x}/{y}.png" url="https://tiles.wmflabs.org/bw-mapnik/{z}/{x}/{y}.png"
/> />
@ -38,6 +41,7 @@ class DefMapLayers extends Component {
const osmlayer = ( const osmlayer = (
<BaseLayer checked={this.props.osmcolor} name={t('Mapa color de OpenStreetMap')}> <BaseLayer checked={this.props.osmcolor} name={t('Mapa color de OpenStreetMap')}>
<TileLayer <TileLayer
opacity={defOpacity}
attribution="&amp;copy <a href=&quot;http://osm.org/copyright&quot;>OpenStreetMap</a> contributors" attribution="&amp;copy <a href=&quot;http://osm.org/copyright&quot;>OpenStreetMap</a> contributors"
url="https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png" url="https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png"
/> />
@ -49,15 +53,15 @@ class DefMapLayers extends Component {
{/* React.Fragment does not work here */} {/* React.Fragment does not work here */}
{ this.state.gkey && { this.state.gkey &&
<BaseLayer name={t('Mapa de carreteras de Google')}> <BaseLayer name={t('Mapa de carreteras de Google')}>
<GoogleLayer googlekey={this.state.gkey} maptype="ROADMAP" /> <GoogleLayer opacity={defOpacity} googlekey={this.state.gkey} maptype="ROADMAP" />
</BaseLayer> } </BaseLayer> }
{ this.state.gkey && { this.state.gkey &&
<BaseLayer name={t('Mapa de terreno de Google')}> <BaseLayer name={t('Mapa de terreno de Google')}>
<GoogleLayer googlekey={this.state.gkey} maptype="TERRAIN" /> <GoogleLayer opacity={defOpacity} googlekey={this.state.gkey} maptype="TERRAIN" />
</BaseLayer> } </BaseLayer> }
{ this.state.gkey && { this.state.gkey &&
<BaseLayer name={t('Mapa de satélite de Google')} checked={this.props.satellite}> <BaseLayer name={t('Mapa de satélite de Google')} checked={this.props.satellite}>
<GoogleLayer googlekey={this.state.gkey} maptype="SATELLITE" /> <GoogleLayer opacity={defOpacity} googlekey={this.state.gkey} maptype="SATELLITE" />
</BaseLayer> } </BaseLayer> }
</LayersControl> </LayersControl>
); );