forked from sap-labs-france/ev-mobile
-
Notifications
You must be signed in to change notification settings - Fork 1
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge pull request sap-labs-france#576 from sap-labs-france/charging_…
…stations_radius Charging stations radius
- Loading branch information
Showing
18 changed files
with
951 additions
and
4,751 deletions.
There are no files selected for viewing
Large diffs are not rendered by default.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,69 @@ | ||
| import React from 'react'; | ||
| import MapView from 'react-native-map-clustering'; | ||
| import MapCluster from './cluster/MapCluster'; | ||
| import { Region } from 'react-native-maps'; | ||
| import ChargingStation from '../../types/ChargingStation'; | ||
| import Site from '../../types/Site'; | ||
| import SiteArea from '../../types/SiteArea'; | ||
| import Utils from '../../utils/Utils'; | ||
| import ThemeManager from '../../custom-theme/ThemeManager'; | ||
| import computeStyleSheet from './ClusterMapStyle'; | ||
| import { View } from 'native-base'; | ||
|
|
||
| interface State {} | ||
|
|
||
| type Localizable = ChargingStation | Site | SiteArea; | ||
|
|
||
| export interface Props<T> { | ||
| items: T[] | ||
| renderMarker: (item: T, index: number) => React.ReactElement; | ||
| initialRegion: Region; | ||
| onMapRegionChangeComplete: (region: Region) => void; | ||
| satelliteMap?: boolean; | ||
| } | ||
|
|
||
| export default class ClusterMap<T extends Localizable> extends React.Component<Props<T>, State> { | ||
| public props: Props<T>; | ||
| public state: State; | ||
| private darkMapTheme = require('../../utils/map/google-maps-night-style.json'); | ||
|
|
||
| public constructor(props: Props<T>) { | ||
| super(props); | ||
| this.state = { | ||
| satelliteMap: false | ||
| } | ||
| } | ||
|
|
||
| public render() { | ||
| const { items, renderMarker, initialRegion, onMapRegionChangeComplete, satelliteMap } = this.props; | ||
| const commonColors = Utils.getCurrentCommonColor(); | ||
| const isDarkModeEnabled = ThemeManager.getInstance()?.isThemeTypeIsDark(); | ||
| const style = computeStyleSheet(); | ||
| return ( | ||
| <View style={style.map}> | ||
| {initialRegion && ( | ||
| <MapView | ||
| customMapStyle={isDarkModeEnabled ? this.darkMapTheme : null} | ||
| style={style.map} | ||
| showsCompass={false} | ||
| showsUserLocation={true} | ||
| zoomControlEnabled={false} | ||
| toolbarEnabled={false} | ||
| spiralEnabled={true} | ||
| radius={5} | ||
| tracksViewChanges={false} | ||
| renderCluster={(cluster) => <MapCluster cluster={cluster} />} | ||
| spiderLineColor={commonColors.textColor} | ||
| mapType={satelliteMap ? 'satellite' : 'standard'} | ||
| initialRegion={initialRegion} | ||
| onRegionChangeComplete={onMapRegionChangeComplete} | ||
| > | ||
| {items.map((item, index) => ( | ||
| renderMarker?.(item, index) | ||
| ))} | ||
| </MapView> | ||
| )} | ||
| </View> | ||
| ) | ||
| } | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,19 @@ | ||
| import deepmerge from 'deepmerge'; | ||
| import { StyleSheet } from 'react-native'; | ||
| import ResponsiveStylesSheet from 'react-native-responsive-stylesheet'; | ||
| import { ScaledSheet } from 'react-native-size-matters'; | ||
|
|
||
| export default function computeStyleSheet(): StyleSheet.NamedStyles<any> { | ||
| const commonStyles = ScaledSheet.create({ | ||
| map: { | ||
| width: '100%', | ||
| height: '100%' | ||
| } | ||
| }); | ||
| const portraitStyles = {}; | ||
| const landscapeStyles = {}; | ||
| return ResponsiveStylesSheet.createOriented({ | ||
| landscape: deepmerge(commonStyles, landscapeStyles) as StyleSheet.NamedStyles<any>, | ||
| portrait: deepmerge(commonStyles, portraitStyles) as StyleSheet.NamedStyles<any> | ||
| }); | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,24 @@ | ||
| import React from 'react'; | ||
| import { Marker } from 'react-native-maps'; | ||
| import { View } from 'native-base'; | ||
| import { Text } from 'react-native'; | ||
| import computeStyleSheet from './MapClusterStyle'; | ||
|
|
||
| export interface Props { | ||
| cluster: any; | ||
| } | ||
|
|
||
| interface State {} | ||
|
|
||
| export default class MapCluster extends React.Component<Props, State> { | ||
|
|
||
| public render() { | ||
| const style = computeStyleSheet(); | ||
| const { geometry, onPress, id, properties } = this.props?.cluster; | ||
| return ( | ||
| <Marker onPress={onPress} tracksViewChanges={false} key={id} coordinate={{longitude: geometry.coordinates[0], latitude: geometry.coordinates[1]}}> | ||
| <View style={style.cluster}><Text>{properties?.point_count}</Text></View> | ||
| </Marker> | ||
| ); | ||
| } | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,30 @@ | ||
| import deepmerge from 'deepmerge'; | ||
| import { StyleSheet } from 'react-native'; | ||
| import ResponsiveStylesSheet from 'react-native-responsive-stylesheet'; | ||
| import { ScaledSheet } from 'react-native-size-matters'; | ||
|
|
||
| import Utils from '../../../utils/Utils'; | ||
|
|
||
| export default function computeStyleSheet(): StyleSheet.NamedStyles<any> { | ||
| const commonColor = Utils.getCurrentCommonColor(); | ||
| const commonStyles = ScaledSheet.create({ | ||
| cluster: { | ||
| backgroundColor: commonColor.listItemBackground, | ||
| padding: '10@s', | ||
| width: '50@s', | ||
| height: '50@s', | ||
| alignItems: 'center', | ||
| justifyContent: 'center', | ||
| borderRadius: '50@s', | ||
| borderWidth: 2, | ||
| borderColor: commonColor.mapClusterBorder, | ||
| zIndex: 1 | ||
| } | ||
| }); | ||
| const portraitStyles = {}; | ||
| const landscapeStyles = {}; | ||
| return ResponsiveStylesSheet.createOriented({ | ||
| landscape: deepmerge(commonStyles, landscapeStyles) as StyleSheet.NamedStyles<any>, | ||
| portrait: deepmerge(commonStyles, portraitStyles) as StyleSheet.NamedStyles<any> | ||
| }); | ||
| } |
Oops, something went wrong.