根据座标底图在缩小图像上放置地图标记

Question

嘿，我正在制作一个向用户展示会议室的React Native应用。给出房间在图像上的位置的x和y坐标。我的图像是300 X400。但是我的标记关闭了，我在做什么错了？

坐标计算：

this.setState({xCoordinate: (item.x / 300) * 100 , yCoordinate: (item.y / 400) * 100 })

  RoomRender = () => {
    return (
      <View>
        {this.state.mapImageState !==
        "https://sd.keepcalm-o-matic.co.uk/i-w600/sorry-no-picture-available.jpg" ? (
          <View>
            <Image
              style={{
                width: 300,
                height: 400,
                marginTop: "3%",
                marginBottom: 0,
                alignSelf: "center",
                backgroundColor: 'transparent'
              }}
              resizeMode={"contain"}
              // source={{ uri: this.state.mapImageState }}
              source={require('../images/room.png')}
              onError={this.onError.bind(this)}
              onLoadStart={() => this.setState({ loading: true })}
              // onLoadEnd={() => this.setState({ loading: false })}
              onLoadEnd={this.onLoadEnd.bind(this)}
              // source={require("../images/netflix.png")}
            />
            <View style={{position: 'absolute', top: this.state.yCoordinate, left: this.state.xCoordinate, right: 0, bottom: 0, justifyContent: 'center', alignItems: 'center'}}>
            <FontAwesomeIcon
            name="map-marker-alt"
            size={20}
            color="red"
          />
</View>