Skip to content

Commit

Permalink
feat: add support for map controls localization (requires mapbox-gl >…
Browse files Browse the repository at this point in the history
…= 1.6.0)
  • Loading branch information
dmytro-gokun committed Dec 6, 2019
1 parent 08124a6 commit c669619
Show file tree
Hide file tree
Showing 3 changed files with 43 additions and 2 deletions.
4 changes: 3 additions & 1 deletion projects/ngx-mapbox-gl/src/lib/map/map.component.ts
Original file line number Diff line number Diff line change
Expand Up @@ -66,6 +66,7 @@ export class MapComponent implements OnChanges, OnDestroy, AfterViewInit, MapEve
@Input() transformRequest?: Function;
@Input() bounds?: LngLatBoundsLike; // Use fitBounds for dynamic input
@Input() antialias?: boolean;
@Input() locale: { [key:string]: string };

/* Dynamic inputs */
@Input() minZoom?: number;
Expand Down Expand Up @@ -193,7 +194,8 @@ export class MapComponent implements OnChanges, OnDestroy, AfterViewInit, MapEve
transformRequest: this.transformRequest,
bounds: this.bounds ? this.bounds : this.fitBounds,
fitBoundsOptions: this.fitBoundsOptions,
antialias: this.antialias
antialias: this.antialias,
locale: this.locale
},
mapEvents: this
});
Expand Down
5 changes: 4 additions & 1 deletion projects/showcase/src/app/demo/demo.module.ts
Original file line number Diff line number Diff line change
Expand Up @@ -17,6 +17,7 @@ import { AttributionPositionComponent } from './examples/attribution-position.co
import { CenterOnSymbolComponent } from './examples/center-on-symbol.component';
import { ClusterHtmlComponent, ClusterPointComponent } from './examples/cluster-html.component';
import { ClusterComponent } from './examples/cluster.component';
import { CustomLocaleComponent } from './examples/custom-locale.component';
import { CustomMarkerIconsComponent } from './examples/custom-marker-icons.component';
import { CustomStyleIdComponent } from './examples/custom-style-id.component';
import { DisplayMapComponent } from './examples/display-map.component';
Expand Down Expand Up @@ -103,6 +104,7 @@ export const DEMO_ROUTES: Routes = [
{ path: 'polygon-popup-on-click', component: PolygonPopupOnClickComponent, data: { label: 'Show polygon information on click', cat: Category.CONTROLS_AND_OVERLAYS } },
{ path: 'add-image-missing-generated', component: AddImageMissingGeneratedComponent, data: { label: 'Generate and add a missing icon to the map', cat: Category.STYLES } },
{ path: 'custom-attribution', component: CustomAttributionComponent, data: { label: 'Add custom attributions', cat: Category.CONTROLS_AND_OVERLAYS } },
{ path: 'custom-locale', component: CustomLocaleComponent, data: { label: 'Add custom localization for controls', cat: Category.CONTROLS_AND_OVERLAYS } },
{ path: '**', redirectTo: 'display-map' }
]
}
Expand Down Expand Up @@ -162,7 +164,8 @@ export const DEMO_ROUTES: Routes = [
NgxClusterHtmlComponent,
ClusterPopupComponent,
AddImageMissingGeneratedComponent,
CustomAttributionComponent
CustomAttributionComponent,
CustomLocaleComponent
]
})
export class DemoModule { }
36 changes: 36 additions & 0 deletions projects/showcase/src/app/demo/examples/custom-locale.component.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,36 @@
import { Component } from '@angular/core';

@Component({
selector: 'showcase-demo',
template: `
<mgl-map
[style]="'mapbox://styles/mapbox/light-v9'"
[center]="[36.235656, 50.003870]"
[zoom]="[11.15]"
[locale]="locale"
>
<mgl-control mglFullscreen position="top-left"></mgl-control>
<mgl-control mglGeolocate position="top-left"></mgl-control>
<mgl-control mglNavigation position="top-left"></mgl-control>
<mgl-control mglScale></mgl-control>
</mgl-map>
`,
styleUrls: ['./examples.css']
})
export class CustomLocaleComponent {
readonly locale = {
'FullscreenControl.Enter': 'Перейти в повоекранний режим',
'FullscreenControl.Exit': 'Вийти з повноекранного режиму',
'GeolocateControl.FindMyLocation': 'Знайти моє місцеположення',
'GeolocateControl.LocationNotAvailable': 'Місцеположення недоступне',
'LogoControl.Title': 'Лого Mapbox',
'NavigationControl.ResetBearing': 'Cкинути компас',
'NavigationControl.ZoomIn': 'Наблизити',
'NavigationControl.ZoomOut': 'Віддалити',
'ScaleControl.Feet': 'ф',
'ScaleControl.Meters': 'м',
'ScaleControl.Kilometers': 'км',
'ScaleControl.Miles': 'ми',
'ScaleControl.NauticalMiles': 'нм'
};
}

0 comments on commit c669619

Please sign in to comment.