mfajri
/
SurveyApp
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

layerlist

master
Irul24 1 year ago
parent
c0eb428221
commit
0e0e82baa5
1 changed files with 70 additions and 56 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 124
      src/component/mapCollectScreen.tsx

124
src/component/mapCollectScreen.tsx
Unescape View File

@ -27,8 +27,9 @@ function MapCollectScreen({route,navigation}:MapCollectProps):React.JSX.Element{ @@ -27,8 +27,9 @@ function MapCollectScreen({route,navigation}:MapCollectProps):React.JSX.Element{
const [modalInputLocation, setmodalInputLocation] = useState(false);
const [modalBasemap, setmodalBasemap] = useState(false);
const [modalLayerList, setmodalLayerList] = useState(false);
const [isSelectedLayer1, setSelectionLayer1] = useState(false);
const [layerList,setLayerList] = useState('')
const [isSelectedLayerPDAM, setSelectionLayerPDAM] = useState(false);
const [isSelectedLayerPermit, setSelectionLayerPermit] = useState(false);
const [layerList,setLayerList] = useState(['pdams','permits','pjus'])
const getLocation = () => {
Geolocation.getCurrentPosition(
@ -51,7 +52,7 @@ function MapCollectScreen({route,navigation}:MapCollectProps):React.JSX.Element{ @@ -51,7 +52,7 @@ function MapCollectScreen({route,navigation}:MapCollectProps):React.JSX.Element{
await RNFetchBlob.config({
trusty : true
})
.fetch('GET', `https://c557-117-102-73-102.ngrok-free.app/catalog`,{
.fetch('GET', `https://de36-117-102-73-102.ngrok-free.app/catalog`,{
"Accept": 'application/json',
"Content-Type": "application/json",
}
@ -149,58 +150,62 @@ function MapCollectScreen({route,navigation}:MapCollectProps):React.JSX.Element{ @@ -149,58 +150,62 @@ function MapCollectScreen({route,navigation}:MapCollectProps):React.JSX.Element{
mapStyle={styleURL}
zoomEnabled={true}
compassEnabled={false}
>
<VectorSource
id="pdams"
url="https://c557-117-102-73-102.ngrok-free.app/pdams"
tileUrlTemplates={["https://c557-117-102-73-102.ngrok-free.app/pdams/{z}/{x}/{y}"]}
onPress={(e)=>{
console.log(e.features[0].properties?.nama);
Alert.alert(e.features[0].properties?.nama)
}}
>
<LineLayer
sourceID="pdams"
sourceLayerID="pdams"
{/* Layer Visibility */}
{
isSelectedLayerPDAM ?
<VectorSource
id="pdams"
style={{lineColor:'red',lineWidth:3}}
/>
{/* {isSelectedLayer1 ?
:
null
} */}
</VectorSource>
<VectorSource
id="permits"
url="https://c557-117-102-73-102.ngrok-free.app/permits"
tileUrlTemplates={["https://c557-117-102-73-102.ngrok-free.app/permits/{z}/{x}/{y}"]}
onPress={(e)=>{
console.log(e.features[0].properties?.company_name);
// Alert.alert(e.features[0].properties?.nama)
}}
>
<LineLayer
sourceID="permits"
sourceLayerID="permits"
id="permits"
style={{lineColor:'red',lineWidth:3}}
/>
{/* <FillLayer
url="https://de36-117-102-73-102.ngrok-free.app/pdams"
tileUrlTemplates={["https://de36-117-102-73-102.ngrok-free.app/pdams/{z}/{x}/{y}"]}
onPress={(e)=>{
console.log(e.features[0].properties?.nama);
Alert.alert(e.features[0].properties?.nama)
}}
>
<LineLayer
sourceID="pdams"
sourceLayerID="pdams"
id="pdams"
style={{lineColor:'blue',lineWidth:3}}
/>
</VectorSource>
:null
}
{
isSelectedLayerPermit ?
<VectorSource
id="permits"
style={{
fillColor: ['interpolate', ['linear'], ['zoom'], 0, '#eeddbb', 2, '#0daa00', 3, '#bbbbee'],
fillOpacity:0.5
url="https://de36-117-102-73-102.ngrok-free.app/permits"
tileUrlTemplates={["https://de36-117-102-73-102.ngrok-free.app/permits/{z}/{x}/{y}"]}
onPress={(e)=>{
console.log(e.features[0].properties!.company_name);
Alert.alert(e.features[0].properties!.company_name)
}}
/> */}
{/* {isSelectedLayer1 ?
>
<FillLayer
sourceLayerID="permits"
id="some-fill-feature"
style={{
fillColor: ['interpolate', ['linear'], ['zoom'], 0, 'blue', 2, 'black', 3, 'grey'],
fillOpacity:0.5
}}
/>
<LineLayer
sourceLayerID="permits"
id="linelayer1"
style={{lineColor:'red',lineWidth:3}}
/>
</VectorSource>
:null
}
:
null
} */}
</VectorSource>
{!delayRender ?
<>
<PointAnnotation
@ -392,16 +397,25 @@ function MapCollectScreen({route,navigation}:MapCollectProps):React.JSX.Element{ @@ -392,16 +397,25 @@ function MapCollectScreen({route,navigation}:MapCollectProps):React.JSX.Element{
/>
</Pressable>
</View>
<View style={{flexDirection:'column',marginTop:'10%',padding:20}}>
<View style={{flexDirection:"row",alignItems:'center',justifyContent:'space-around'}}>
<Text style={{color:'black',fontWeight:'400',fontSize:16}}>Administrasi Kecamatan Jakut</Text>
<View style={{flexDirection:'column', marginTop:'10%',paddingStart:'10%',paddingEnd:'10%'}}>
<View style={{flexDirection:"row",alignItems:'center',justifyContent:'flex-start',borderBottomColor:'#A6A6A6',borderBottomWidth:2,padding:5}}>
<CheckBox
disabled={false}
value={isSelectedLayer1}
onValueChange={(newValue) => setSelectionLayer1(newValue)}
value={isSelectedLayerPDAM}
onValueChange={(newValue) => setSelectionLayerPDAM(newValue)}
/>
<Text style={{color:'black',fontWeight:'400',fontSize:16}}>Pipa PDAM</Text>
</View>
<View style={{flexDirection:"row",alignItems:'center',justifyContent:'flex-start',borderBottomColor:'#A6A6A6',borderBottomWidth:2,padding:5}}>
<CheckBox
disabled={false}
value={isSelectedLayerPermit}
onValueChange={(newValue) => setSelectionLayerPermit(newValue)}
/>
<Text style={{color:'black',fontWeight:'400',fontSize:16}}>Land Permit</Text>
</View>
</View>
</View>
</Modal>

Write Preview
Loading…
Cancel
Save