Untitled
unknown
plain_text
a month ago
3.5 kB
3
Indexable
import React, { useState, useEffect } from 'react'; import { View, Text, Button } from 'react-native'; import MapView, { Marker } from 'react-native-maps'; import axios from 'axios'; const TrafficApp = () => { const [trafficData, setTrafficData] = useState([]); useEffect(() => { // Fetch live traffic data (for example, from Google Maps API) axios.get('YOUR_API_ENDPOINT') .then(response => { setTrafficData(response.data); }) .catch(error => console.log(error)); }, []); return ( <View style={{ flex: 1 }}> <MapView style={{ flex: 1 }} initialRegion={{ latitude: 37.78825, longitude: -122.4324, latitudeDelta: 0.0922, longitudeDelta: 0.0421, }} > {trafficData.map((incident, index) => ( <Marker key={index} coordinate={{ latitude: incident.lat, longitude: incident.lon }} title={incident.type} description={incident.details} /> ))} </MapView> <Button title="Report Incident" onPress={() => { /* Handle reporting incident */ }} /> <Text>Traffic Alerts:</Text> {trafficData.length > 0 && trafficData.map((incident, index) => ( <Text key={index}>{incident.type}: {incident.details}</Text> ))} </View> ); }; export default TrafficApp; ))} ))} }} ) }) }) }
Editor is loading...
Leave a Comment