更新 js 组件

components/MapView.js

@@ -7,7 +7,6 @@ import {
 } from 'react-native'
 import {LatLng} from './PropTypes'
 import Marker from './Marker'
-import InfoWindow from './InfoWindow'
 import Overlay from './Overlay'
 import Polyline from './Polyline'
 import Polygon from './Polygon'
@@ -123,11 +122,6 @@ class MapView extends Component {
      */
     tiltEnabled: PropTypes.bool,
 
-    /**
-     * 地图加载完毕事件
-     */
-    onReady: React.PropTypes.func,
-
     /**
      * 点击事件
      */
@@ -176,7 +170,6 @@ class MapView extends Component {
 
   static Marker = Marker
   static Overlay = Overlay
-  static InfoWindow = InfoWindow
   static Polyline = Polyline
   static Polygon = Polygon
   static Circle = Circle
@@ -185,4 +178,4 @@ class MapView extends Component {
 AMapView = requireNativeComponent('AMapView', MapView)
 
 export default MapView
-export {MapView, Marker, InfoWindow, Overlay, Polyline, Polygon, Circle}
+export {MapView, Marker, Overlay, Polyline, Polygon, Circle}

components/Marker.js

 import React, {PropTypes, Component} from 'react'
-import {requireNativeComponent, View, PixelRatio, Platform} from 'react-native'
+import {requireNativeComponent, View, Platform, StyleSheet} from 'react-native'
 import {LatLng} from './PropTypes'
-import InfoWindow from './InfoWindow'
+import Overlay from './Overlay'
 
-class Marker extends Component {
+export default class Marker extends Component {
   static propTypes = {
     ...View.propTypes,
 
@@ -111,15 +111,15 @@ class Marker extends Component {
       })
     }
 
-    let customInfoWindow = null
-    let customMarker = null
+    let customInfoWindow = <View collapsable={false}/>
+    let customMarker = <View collapsable={false}/>
 
     if (props.children) {
-      customInfoWindow = props.children
+      customInfoWindow = <Overlay style={styles.overlay}>{props.children}</Overlay>
     }
 
     if (typeof props.icon === 'function') {
-      customMarker = props.icon()
+      customMarker = <Overlay style={styles.overlay}>{props.icon()}</Overlay>
       delete props.icon
     }
 
@@ -132,4 +132,8 @@ class Marker extends Component {
 
 AMapMarker = requireNativeComponent('AMapMarker', Marker)
 
-export default Marker
+const styles = StyleSheet.create({
+  overlay: {
+    position: 'absolute',
+  },
+})

components/Polyline.js

 import React, {PropTypes, Component} from 'react'
-import {processColor, requireNativeComponent, View, PixelRatio} from 'react-native'
+import {processColor, requireNativeComponent, View, PixelRatio, Platform} from 'react-native'
 import {LatLng} from './PropTypes'
 
 class Polyline extends Component {
@@ -33,7 +33,7 @@ class Polyline extends Component {
     /**
      * 是否绘制虚线
      */
-    dottedLine: PropTypes.bool,
+    dashed: PropTypes.bool,
 
     /**
      * 点击事件
@@ -56,7 +56,11 @@ class Polyline extends Component {
   render() {
     const props = {
       ...this.props,
-      width: PixelRatio.getPixelSizeForLayoutSize(this.props.width),
+      ...Platform.select({
+        android: {
+          width: PixelRatio.getPixelSizeForLayoutSize(this.props.width),
+        },
+      }),
       colors: this.props.colors.map(processColor),
       onPolylineClick: this._handle('onPress'),
     }

example/src/examples/polyline.js

@@ -9,18 +9,6 @@ export default class PolylineExample extends Component {
 
   render() {
     return <MapView style={StyleSheet.absoluteFill}>
-      <Polyline
-        width={5}
-        coordinates={[
-          {
-            latitude: 40.106901,
-            longitude: 116.097972,
-          },
-          {
-            latitude: 40.106901,
-            longitude: 116.597972,
-          },
-        ]}/>
       <Polyline
         width={5}
         color='red'
@@ -35,7 +23,7 @@ export default class PolylineExample extends Component {
           },
         ]}/>
       <Polyline
-        dottedLine
+        dashed
         width={5}
         coordinates={[
           {
@@ -50,7 +38,6 @@ export default class PolylineExample extends Component {
       <Polyline
         gradient
         width={5}
-        color='blue'
         colors={['#f44336', '#2196f3', '#4caf50']}
         onPress={() => Alert.alert('onPress')}
         coordinates={[