[Bug]: MarkerView not displayed on Android
See original GitHub issueMapbox Implementation
Mapbox
Mapbox Version
10.9.0
Platform
Android
@rnmapbox/maps
version
10.0.0-beta.54
Standalone component to reproduce
This is simply the examples/Annotations/MarkerView.js
:
import React from 'react';
import { View, Text, TouchableOpacity } from 'react-native';
import MapboxGL from '@rnmapbox/maps';
import PropTypes from 'prop-types';
import sheet from '../../styles/sheet';
import BaseExamplePropTypes from '../common/BaseExamplePropTypes';
import Page from '../common/Page';
import Bubble from '../common/Bubble';
const styles = {
touchableContainer: { borderColor: 'black', borderWidth: 1.0, width: 60 },
touchable: {
backgroundColor: 'blue',
width: 40,
height: 40,
borderRadius: 20,
alignItems: 'center',
justifyContent: 'center',
},
touchableText: {
color: 'white',
fontWeight: 'bold',
},
};
const AnnotationContent = ({ title }) => (
<View style={styles.touchableContainer}>
<Text>{title}</Text>
<TouchableOpacity style={styles.touchable}>
<Text style={styles.touchableText}>Btn</Text>
</TouchableOpacity>
</View>
);
AnnotationContent.propTypes = {
title: PropTypes.string,
};
class ShowMarkerView extends React.Component {
static propTypes = {
...BaseExamplePropTypes,
};
constructor(props) {
super(props);
this.state = {
backgroundColor: 'blue',
coordinates: [
[-73.99155, 40.73581],
[-73.99155, 40.73681],
],
};
}
render() {
return (
<Page {...this.props}>
<MapboxGL.MapView
ref={(c) => (this._map = c)}
onPress={this.onPress}
onDidFinishLoadingMap={this.onDidFinishLoadingMap}
style={sheet.matchParent}
>
<MapboxGL.Camera
zoomLevel={16}
centerCoordinate={this.state.coordinates[0]}
/>
<MapboxGL.PointAnnotation
coordinate={this.state.coordinates[1]}
id="pt-ann"
>
<AnnotationContent title={'this is a point annotation'} />
</MapboxGL.PointAnnotation>
<MapboxGL.MarkerView coordinate={this.state.coordinates[0]}>
<AnnotationContent title={'this is a marker view'} />
</MapboxGL.MarkerView>
</MapboxGL.MapView>
<Bubble>
<Text>Click to add a point annotation</Text>
</Bubble>
</Page>
);
}
}
export default ShowMarkerView;
Observed behavior and steps to reproduce
MarkerView
is not displayed anymore on Android. I think it has begun between Beta 48 and 49, maybe after 49.
Furthermore allowOverlap
, isSelected
and anchor
are now required props.
Expected behavior
No response
Notes / preliminary analysis
No response
Additional links and references
No response
Issue Analytics
- State:
- Created a year ago
- Reactions:1
- Comments:19 (2 by maintainers)
Top Results From Across the Web
MarkerView & PointAnnotation doesn't work on Android #993
Describe the bug Within my map, I need to mark a single coordinate. I have tried using PointAnnotations but it only worked in...
Read more >MarkerView is not showing up using MPAndroidChart
Your MarkerView is not showing because you have not highlighted any entry in your chart. The MarkerView is only displayed for entries that ......
Read more >Advanced Markers (beta) | Maps JavaScript API
Sets the AdvancedMarkerView 's position. An AdvancedMarkerView may be constructed without a position, but will not be displayed until its position is provided...
Read more >Mark a Coordinate on Mapbox Map in React Native
In Android, the child React Native View is captured into a static image and then displayed. So, for instance, you cannot place a...
Read more >rnmapbox/Lobby - Gitter
MarkerView > is not showing following methods ... MarkerView> in android ... Is this a bug or is there something that i'll have...
Read more >Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start FreeTop Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
Top GitHub Comments
That’s not good! Let me look into this today.
I did. 😃 Doesn’t work. Same as 10.9.0.