Android 如何使用React Native更改Google Mapview多段线笔划样式虚线样式线?
在我的场景中,我已经在我的应用程序中使用“react native maps”npm包实现了Google MapView。根据我的要求,在这个软件包中我必须画一个虚线圆圈多段线,就像下面提到的图像一样,绿线应该是虚线笔划样式。如何将其更改为虚线或虚线笔划样式线Android 如何使用React Native更改Google Mapview多段线笔划样式虚线样式线?,android,ios,typescript,react-native,google-maps,Android,Ios,Typescript,React Native,Google Maps,在我的场景中,我已经在我的应用程序中使用“react native maps”npm包实现了Google MapView。根据我的要求,在这个软件包中我必须画一个虚线圆圈多段线,就像下面提到的图像一样,绿线应该是虚线笔划样式。如何将其更改为虚线或虚线笔划样式线 您应该使用而不是`。下面是一个示例和代码片段。(注意:lineDashPattern仅在iOS per中可用) import React,{Component}来自'React'; 从“react native”导入{文本、视图、样式表
您应该使用
而不是`。下面是一个示例和代码片段。(注意:lineDashPattern仅在iOS per中可用)
import React,{Component}来自'React';
从“react native”导入{文本、视图、样式表、维度};
从“react native maps”导入MapView,{标记、圆、多段线};
const styles=StyleSheet.create({
容器:{
弹性:1,
背景颜色:“#fff”,
对齐项目:“居中”,
为内容辩护:“中心”,
},
地图:{
宽度:尺寸。获取('窗口')。宽度,
高度:尺寸。获取(“窗口”)。高度,
},
});
类MapApp扩展组件{
render(){
返回(
);
}
}
导出默认MapApp;
<Polyline
coordinates={[
{ latitude: 37.88045, longitude: -122.4324 },
{ latitude: 37.78825, longitude: -122.3903 },
]}
strokeWidth={3}
lineDashPattern={[170, 170]}
/>
import React, { Component } from 'react';
import { Text, View, StyleSheet, Dimensions } from 'react-native';
import MapView, { Marker, Circle, Polyline } from 'react-native-maps';
const styles = StyleSheet.create({
container: {
flex: 1,
backgroundColor: '#fff',
alignItems: 'center',
justifyContent: 'center',
},
map: {
width: Dimensions.get('window').width,
height: Dimensions.get('window').height,
},
});
class MapApp extends Component {
render() {
return (
<View style={styles.container}>
<MapView style={styles.map}
initialRegion={{
latitude: 37.78825,
longitude: -122.4324,
latitudeDelta: 0.0922,
longitudeDelta: 0.0421,
}}
>
<Marker
coordinate={{ latitude: 37.78825, longitude: -122.4324 }}
/>
<Circle
center={{ latitude: 37.78825, longitude: -122.4324 }}
radius={1000}
strokeWidth={3}
strokeColor="green"
lineDashPattern={[10]} />
</MapView>
</View>
);
}
}
export default MapApp;