RTL text not supported
shaniqwa opened this issue · comments
Hi, I'm having issues with RTL languages display. Mapbox docs say I should use mapbox-gl-rtl-text.js plugin, which is initialized like this:
mapboxgl.accessToken = 'xxx';
mapboxgl.setRTLTextPlugin('https://api.mapbox.com/mapbox-gl-js/plugins/mapbox-gl-rtl-text/v0.2.0/mapbox-gl-rtl-text.js');
var map = new mapboxgl.Map({
container: 'map',
style: 'mapbox://styles/mapbox/streets-v9',
center: [44.3763, 33.2788],
zoom: 11
});
Can you please help me initialize this via vue-mapbox-gl?
thanks!
Yes you should be able to do this in the @map-init
event like so:
<mapbox
access-token="your access token"
:map-options="{
style: 'mapbox://styles/mapbox/light-v9',
center: [-96, 37.8],
zoom: 3
}"
:geolocate-control="{
show: true,
position: 'top-left'
}"
:scale-control="{
show: true,
position: 'top-left'
}"
:fullscreen-control="{
show: true,
position: 'top-left'
}"
@map-init="mapInitialized">
</mapbox>
import Mapbox from 'mapbox-gl-vue';
const app = new Vue({
el: '#app',
components: { Mapbox },
methods: {
mapInitialized(map) {
map.setRTLTextPlugin('https://api.mapbox.com/mapbox-gl-js/plugins/mapbox-gl-rtl-text/v0.2.0/mapbox-gl-rtl-text.js');
}
}
});
I haven't personally tested but according to the documentation this seems like the logical thing to try. Give that a shot and see if it works!
Hi I tested it, it does not work
mapInitialized(map) {
map.setRTLTextPlugin('https://api.mapbox.com/mapbox-gl-js/plugins/mapbox-gl-rtl-text/v0.2.0/mapbox-gl-rtl-text.js');
}
It gives the following error :
TypeError: map.setRTLTextPlugin is not a function
at VueComponent.mapInitialized (map.f834d33b7d830e239136.hot-update.js:53)
But, when trying it as :
mapInitialized() {
mapboxgl.setRTLTextPlugin('https://api.mapbox.com/mapbox-gl-js/plugins/mapbox-gl-rtl-text/v0.2.0/mapbox-gl-rtl-text.js');
}
It works..
I am having an issue with setRTLTextPlugin
When navigating between pages and return back to map, I got the following error :
Error: setRTLTextPlugin cannot be called multiple times.
Hi @abdelhameedhamdy,
I tried what you said and it didn't worked for me. can you guess what may be wrong?
This is closed but might help somebody looking into this now;
Do something like this
mapInitialized() {
if (window.mapboxgl.getRTLTextPluginStatus() != "loaded") {
window.mapboxgl.setRTLTextPlugin('https://api.mapbox.com/mapbox-gl-js/plugins/mapbox-gl-rtl-text/v0.2.0/mapbox-gl-rtl-text.js')
}
}
@abdelhameedhamdy
Did you succeed in enabling it?