question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

react-native-hms-map not working with Vue Native

See original GitHub issue

Background

I have react-native-maps installed in my Vue Native App. Now, I would like to extend my app to Huawei Devices. I installed react-native-hms-map but it seems having some issues.

Installation steps

  1. npm install @hmscore/react-native-hms-map

Attemps

I attempted using two methods, but both methods were not working either. I have the screenshots of the errors attached.

Method 1

<template>
    ...
          {{ renderMap() }}
    ...
</template>
<script>
import MapView, { GroundOverlay, MapTypes,TileOverlay } from "@hmscore/react-native-hms-map";
import React from "react"

...
export defaults {
  methods: {
    renderMap() {
      return (
        <MapView mapType={MapTypes.NONE}>
          <TileOverlay
            tileProvider={{url: 'https://a.tile.openstreetmap.org/{z}/{x}/{y}.png'}}
          />
        </MapView>
      )
    }
  }
}
 </script>

capture_method_1

Method 2

This method is also the method I use to integrate with react-native-maps.

<template>
    ....
    <MapView :mapType="mapType">
      <TileOverlay
        :tileProvider="{url: 'https://a.tile.openstreetmap.org/{z}/{x}/{y}.png'}"
      />
    </MapView>
    ....
<template/>

<script>
import MapView, { GroundOverlay, MapTypes,TileOverlay } from "@hmscore/react-native-hms-map";

export defaults {
  data() {
    return {
      mapType: MapTypes.NONE
    }
  }
}
</scripts>

Capture_method_2

Versions

"@hmscore/react-native-hms-location": "^5.0.0-301",
"@hmscore/react-native-hms-map": "5.0.1-300",
"react": "16.11.0",
"react-native": "0.62.2",
"vue-native-core": "^0.1.4",
"vue-native-helper": "^0.1.4",
"vue-native-scripts": "^0.1.4"

Any idea?

Issue Analytics

  • State:closed
  • Created 3 years ago
  • Comments:13

github_iconTop GitHub Comments

1reaction
melvinchngcommented, Nov 11, 2020

Thanks! Got it to work after adding the missing configurations provided.

1reaction
utaritcommented, Nov 11, 2020

Hi, can you add these configurations to your proguard file and run the app again

-ignorewarnings 

-keepattributes *Annotation* 
-keepattributes Exceptions 
-keepattributes InnerClasses 
-keepattributes Signature 

-keep class com.hianalytics.android.**{*;} 
-keep class com.huawei.updatesdk.**{*;} 
-keep class com.huawei.hms.**{*;}

-repackageclasses
Read more comments on GitHub >

github_iconTop Results From Across the Web

HMS Map Kit - React Native Marker Problem - Stack Overflow
React Native Sample Code. Maybe you forgot to set the marker for mapview. Also If you want check HMS Map Kit sample codes...
Read more >
Development in React Native Platform with HMS Location kit ...
Hello, in this article, as in my previous article, we will look at the most needed topics in React Native Location, Map, Site...
Read more >
Here map integration in react-native mobile ... - appsloveworld
Here map integration in react-native mobile app · Here map integration using React native · Redirection to a mobile app from the webview...
Read more >
@hmscore/react-native-hms-map - npm
Start using @hmscore/react-native-hms-map in your project by running `npm i @hmscore/react-native-hms-map`. There are no other projects in ...
Read more >
Top 50+ React Native Development companies - Upwork
Find a React Native Development agency to get even the most complex work done ... can work with your teams directly, not with...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found