Clusterer
- Class: MMapClusterer
- Class: Config
- Class: Context<_T>
- Class: GenericComplexEntity<Props, DefaultProps, Root>
- Class: GenericEntity<Props, DefaultProps, Root>
- Class: GenericGroupEntity<Props, DefaultProps, Root>
- Class: GenericRootEntity<Props, DefaultProps>
- Class: MMap
- Class: MMapComplexEntity<Props, DefaultProps>
- Class: MMapEntity<Props, DefaultProps>
- Interface: IClusterMethod
- Interface: Apikeys
- Interface: ComplexOptions<Root>
- Interface: GenericFeature<TCoordinates>
- Interface: GenericLineStringGeometry<TCoordinates>
- Interface: GenericMultiLineStringGeometry<TCoordinates>
- Interface: GenericMultiPolygonGeometry<TCoordinates>
- Interface: GenericPointFeature<TCoordinates>
- Interface: GenericPointGeometry<TCoordinates>
- Interface: GenericPolygonGeometry<TCoordinates>
- Interface: GenericProjection<TSource>
- Interface: PixelCoordinates
- Interface: ReactParent
- Interface: TiltRange
- Interface: Vec2
- Interface: VuefyModuleFn
- Interface: WorldCoordinates
- Interface: WorldOptions
- Interface: ZoomRange
- Module: <internal>
Note
Using the clusterer helps to display a large number of markers on the map.
When the scale of the map is increased, individual markers are combined into a cluster;
when the map is scaled down, the cluster breaks up into individual markers.
Example 1: Creating a Map and adding a Clusterer to the Map
We declare a variable for the map, load the mappable library, extract the necessary classes.
window.map = null;
async function main() {
await mappable.ready;
const {MMap, MMapDefaultSchemeLayer, MMapMarker, MMapLayer, MMapFeatureDataSource} = mappable;
//...
}
We load the package with the clusterer, extract the classes for creating clusterer objects and the clustering method.
const {MMapClusterer, clusterByGrid} = await mappable.import('@mappable-world/mappable-clusterer@0.0.1');
Create and add to the map a layer with a default schema, data sources, a layer of markers.
map = new MMap(document.getElementById('app'), {location: {center: [37.62, 55.62], zoom: 10}});
map
.addChild(new MMapDefaultSchemeLayer())
.addChild(new MMapFeatureDataSource({id: 'my-source'}))
.addChild(new MMapLayer({source: 'my-source', type: 'markers', zIndex: 1800}));
You can set any markup for the marker and for the cluster.
const contentPin = document.createElement('div');
contentPin.innerHTML = '<img src="./pin.svg" />';
We declare the function for rendering ordinary markers, we will submit it to the clusterer settings.
Note that the function must return any Entity element. In the example, this is mappable.MMapMarker.
const marker = (feature) =>
new mappable.MMapMarker(
{
coordinates: feature.geometry.coordinates,
source: 'my-source'
},
contentPin.cloneNode(true)
);
As for ordinary markers, we declare a cluster rendering function that also returns an Entity element.
const cluster = (coordinates, features) =>
new mappable.MMapMarker(
{
coordinates,
source: 'my-source'
},
circle(features.length).cloneNode(true)
);
function circle(count) {
const circle = document.createElement('div');
circle.classList.add('circle');
circle.innerHTML = `
<div class="circle-content">
<span class="circle-text">${count}</span>
</div>
`;
return circle;
}
Let's declare an array with marker coordinates, then create an array of features with the appropriate interface. We will pass it to the clusterer settings.
const coordinates = [
[37.64, 55.76],
[37.63, 55.7],
[37.43, 55.69],
[37.47, 55.68],
[38.53, 58.6],
[37.59, 55.71],
[37.5, 55.63],
[37.52, 55.57],
[37.52, 58.57],
[40.52, 58.57]
];
const points = coordinates.map((lnglat, i) => ({
type: 'Feature',
id: i,
geometry: {coordinates: lnglat},
properties: {name: 'Point of issue of orders'}
}));
We create a clusterer object and add it to the map object.
As parameters, we pass the clustering method, an array of features, the functions for rendering markers and clusters.
For the clustering method, we will pass the size of the grid division in pixels.
const clusterer = new MMapClusterer({
method: clusterByGrid({gridSize: 64}),
features: points,
marker,
cluster
});
map.addChild(clusterer);
}
Example 2. Using a Clusterer with React JS
We declare a variable for the map, load the mappable library, extract the necessary classes.
window.map = null;
main();
async function main() {
await mappable.ready;
const mappableReact = await mappable.import('@mappable-world/mappable-reactify');
const reactify = mappableReact.reactify.bindTo(React, ReactDOM);
const {
MMap,
MMapDefaultSchemeLayer,
MMapLayer,
MMapFeatureDataSource,
MMapMarker
} = reactify.module(mappable);
We connect the package with the clusterer, extract the classes for creating clusterer objects and the clustering method.
const {MMapClusterer, clusterByGrid} = reactify.module(await mappable.import('@mappable-world/mappable-clusterer@0.0.1'));
We extract the necessary hooks. Let's declare an array with marker coordinates, then create an array of features with the appropriate interface.
We will pass it to the clusterer settings.
const {useCallback, useMemo} = React;
const coordinates = [
[37.64, 55.76],
[37.63, 55.7],
[37.43, 55.69],
[37.47, 55.68],
[38.53, 58.6],
[37.59, 55.71],
[37.5, 55.63],
[37.52, 55.57],
[37.52, 58.57],
[40.52, 58.57]
];
const points = coordinates.map((lnglat, i) => ({
type: 'Feature',
id: i,
geometry: {coordinates: lnglat},
properties: {name: 'Point of issue of orders'}
}));
We declare a render function. For the clustering method, we pass and store the size of one grid division in pixels.
function App() {
const gridSizedMethod = useMemo(() => clusterByGrid({ gridSize: 64 }), []);
// ...
}
We declare a function for rendering ordinary markers. Note that the function must return any Entity element. In the example, this is mappable.MMapMarker.
const marker = useCallback(
(feature) => (
<MMapMarker coordinates={feature.geometry.coordinates} source={'my-source'}>
<img src={'./pin.svg'} />
</MMapMarker>
),
[]
);
We declare a cluster rendering function that also returns an Entity element. We will transfer the marker and cluster rendering functions to the clusterer settings.
const cluster = useCallback(
(coordinates, features) => (
<MMapMarker coordinates={coordinates} source={'my-source'}>
<div className="circle">
<div className="circle-content">
<span className="circle-text">{features.length}</span>
</div>
</div>
</MMapMarker>
),
[]
);
We return JSX, in which we render the components of the map, the default layer, data sources, the layer for markers and the clusterer.
In the clusterer props, we pass the previously declared functions for rendering markers and clusters, the clustering method, and an array of features.
return <React.Fragment>
<MMap location={LOCATION} ref={x => map = x}>
<MMapDefaultSchemeLayer />
<MMapFeatureDataSource id="my-source"/>
<MMapLayer source="my-source" type="markers" zIndex={1800}/>
<MMapClusterer
marker={marker}
cluster={cluster}
method={gridSizedMethod}
features={points}
/>
</MMap>
</React.Fragment>;
// ...
ReactDOM.render(<App />, document.getElementById("app"));
}
Class: MMapClusterer
Display clustered features on a map.
Example
const clusterer = new MMapClusterer({
method: clusterByGrid({gridSize: 64}),
features: POINTS,
marker: (feature) => new MMapMarker({
coordinates: feature.geometry.coordinates,
source: 'my-source'
}
cluster: (coordinates, cluster) => new MMapMarker({
coordinates,
source: 'my-source'
}
});
map.addChild(new MMapDefaultSchemeLayer())
.addChild(new MMapFeatureDataSource({id: 'my-source'}))
.addChild(new MMapLayer({source: 'my-source', type: 'markers'}))
.addChild(clusterer);
Constructors
constructor
new MMapClusterer(props
)
Parameters
Name | Type |
---|---|
props |
MMapClustererProps |
Overrides
Properties
[optionsKeyVuefy]
static [optionsKeyVuefy]: CustomVuefyOptions<MMapClusterer, MMapClustererProps>
[overrideKeyReactify]
static [overrideKeyReactify]: CustomReactify<MMapClusterer, ForwardRefExoticComponent<{
cluster: (`coordinates`: LngLat, `features`: Feature[]) => ReactElement<any, string | JSXElementConstructor<any>>;
features: Feature[];
key?: null | Key;
marker: (`feature`: Feature) => ReactElement<any, string | JSXElementConstructor<any>>;
maxZoom?: number;
method: IClusterMethod;
onRender?: (`clusters`: ClustererObject[]) => false | void;
ref?: Ref<MMapEntity<{
cluster: (`coordinates`: LngLat, `features`: Feature[]) => ReactElement<any, string | JSXElementConstructor<any>>;
features: Feature[];
marker: (`feature`: Feature) => ReactElement<any, string | JSXElementConstructor<any>>;
maxZoom?: number;
method: IClusterMethod;
onRender?: (`clusters`: ClustererObject[]) => false | void;
tickTimeout?: number
}, {}>>;
tickTimeout?: number
}>>
[overrideKeyVuefy]
static [overrideKeyVuefy]: CustomVuefyFn<MMapClusterer, MMapClustererProps>
defaultProps
static defaultProps: Readonly<{
tickTimeout: 200
}>
Accessors
parent
get
parent(): null
| MMapComplexEntity
<unknown
, {}>
Get parent entity.
Returns
null
| MMapComplexEntity
<unknown
, {}>
Inherited from
mappable.MMapComplexEntity.parent
root
get
root(): null
| MMap
Get root entity.
Returns
null
| MMap
Inherited from
mappable.MMapComplexEntity.root
Methods
update
update(changedProps
): void
Method for updating props of Entity.
Parameters
Name | Type | Description |
---|---|---|
changedProps |
Partial <MMapClustererProps > |
New props values. |
Returns
void
Inherited from
Class: Config
Constructors
constructor
new Config()
Properties
description
readonly description: string
Methods
setApikeys
setApikeys(apikeys
): void
Parameters
Name | Type |
---|---|
apikeys |
Apikeys |
Returns
void
setExperiments
setExperiments(experiments
): void
Parameters
Name | Type |
---|---|
experiments |
Record <string , boolean > |
Returns
void
Class: Context<_T>
Type parameters
Name |
---|
_T |
Constructors
constructor
new Context<_T
>(name
)
Type parameters
Name |
---|
_T |
Parameters
Name | Type |
---|---|
name |
string |
Properties
name
readonly name: string
Class: GenericComplexEntity<Props, DefaultProps, Root>
Entity that aggregates multiple Entities but looks basic from the outside.
Example
type MMapSomeComplexEntityProps = {
name?: string;
};
const defaultProps = {
name: 'entity'
};
class MMapSomeComplexEntity extends GenericComplexEntity<MMapSomeComplexEntityProps, typeof defaultProps> {
static defaultProps = defaultProps;
private _someEntity?: MMapSomeEntity; // MMapSomeEntity extends GenericEntity
protected _onAttach(): void {
this._someEntity = new MMapSomeEntity();
this.addChild(this._someEntity); // add someEntity as children
// ...
}
// ...
}
Type parameters
Name | Type | Description |
---|---|---|
Props |
Props |
Type of input props of the Entity. |
DefaultProps |
extends Object = {} |
Type of default input props of the Entity. |
Root |
extends GenericRootEntity <unknown > = GenericRootEntity <unknown > |
Root Entity Class. |
Constructors
constructor
new GenericComplexEntity<Props
, DefaultProps
, Root
>(props
, options?
)
Type parameters
Name | Type |
---|---|
Props |
Props |
DefaultProps |
extends Object = {} |
Root |
extends GenericRootEntity <unknown , {}, Root > = GenericRootEntity <unknown , {}> |
Parameters
Name | Type | Description |
---|---|---|
props |
Props |
The value of input props. |
options? |
ComplexOptions <Root > |
Optional options object. |
Overrides
new GenericComplexEntity<Props
, DefaultProps
, Root
>(props
, children?
, options?
)
Type parameters
Name | Type |
---|---|
Props |
Props |
DefaultProps |
extends Object = {} |
Root |
extends GenericRootEntity <unknown , {}, Root > = GenericRootEntity <unknown , {}> |
Parameters
Name | Type |
---|---|
props |
Props |
children? |
GenericEntity <unknown , {}, Root >[] |
options? |
Omit <ComplexOptions <Root >, "children" > |
Overrides
GenericEntity<Props, DefaultProps, Root>.constructor
Accessors
parent
get
parent(): null
| GenericComplexEntity
<unknown
, {}, GenericRootEntity
<unknown
, {}>>
Get parent entity.
Returns
null
| GenericComplexEntity
<unknown
, {}, GenericRootEntity
<unknown
, {}>>
Inherited from
GenericEntity.parent
root
get
root(): null
| Root
Get root entity.
Returns
null
| Root
Inherited from
GenericEntity.root
Methods
update
update(changedProps
): void
Method for updating props of Entity.
Parameters
Name | Type | Description |
---|---|---|
changedProps |
Partial <Props > |
New props values. |
Returns
void
Inherited from
Class: GenericEntity<Props, DefaultProps, Root>
Entity Base Class. It has event handlers for attaching, detaching and updating props. Has a method for providing and using context.
Example
type MMapSomeEntityProps = {
name?: string;
};
const defaultProps = {
name: 'entity'
};
class MMapSomeEntity extends GenericEntity<MMapSomeEntityProps, typeof defaultProps> {
static defaultProps = defaultProps;
public isAttached: boolean;
constructor(props: MMapSomeEntityProps) {
super(props);
this.isAttached = false
// Additional actions can be taken in the constructor of a class.
}
protected _onAttach(): void {
this.isAttached = true;
// Additional actions can be taken when an Entity is attached.
}
// ...
}
Type parameters
Name | Type | Description |
---|---|---|
Props |
Props |
Type of input props of the Entity. |
DefaultProps |
extends Object = {} |
Type of default input props of the Entity. |
Root |
extends GenericRootEntity <unknown > = GenericRootEntity <unknown > |
Root Entity Class. |
Constructors
constructor
new GenericEntity<Props
, DefaultProps
, Root
>(props
)
Type parameters
Name | Type |
---|---|
Props |
Props |
DefaultProps |
extends Object = {} |
Root |
extends GenericRootEntity <unknown , {}, Root > = GenericRootEntity <unknown , {}> |
Parameters
Name | Type | Description |
---|---|---|
props |
Props |
The value of input props. |
Accessors
parent
get
parent(): null
| GenericComplexEntity
<unknown
, {}, GenericRootEntity
<unknown
, {}>>
Get parent entity.
Returns
null
| GenericComplexEntity
<unknown
, {}, GenericRootEntity
<unknown
, {}>>
root
get
root(): null
| Root
Get root entity.
Returns
null
| Root
Methods
update
update(changedProps
): void
Method for updating props of Entity.
Parameters
Name | Type | Description |
---|---|---|
changedProps |
Partial <Props > |
New props values. |
Returns
void
Class: GenericGroupEntity<Props, DefaultProps, Root>
Entity that aggregates multiple Entities, and allows you to publicly add and remove entities to a subtree.
Example
type MMapSomeGroupEntityProps = {
name?: string;
};
const defaultProps = {
name: 'entity'
};
class MMapSomeGroupEntity extends GenericGroupEntity<MMapSomeGroupEntityProps, typeof defaultProps> {
static defaultProps = defaultProps;
// ...
}
const groupEntity = new MMapSomeGroupEntity()
const someEntity = new MMapSomeEntity(); // MMapSomeEntity extends GenericEntity
groupEntity.addChild(someEntity); // add someEntity in MMapSomeGroupEntity object
groupEntity.removeChild(someEntity); // remove someEntity from MMapSomeGroupEntity object
Type parameters
Name | Type | Description |
---|---|---|
Props |
Props |
Type of input props of the Entity. |
DefaultProps |
extends Object = {} |
Type of default input props of the Entity. |
Root |
extends GenericRootEntity <unknown > = GenericRootEntity <unknown > |
Root Entity Class. |
Constructors
constructor
new GenericGroupEntity<Props
, DefaultProps
, Root
>(props
, options?
)
Type parameters
Name | Type |
---|---|
Props |
Props |
DefaultProps |
extends Object = {} |
Root |
extends GenericRootEntity <unknown , {}, Root > = GenericRootEntity <unknown , {}> |
Parameters
Name | Type | Description |
---|---|---|
props |
Props |
The value of input props. |
options? |
ComplexOptions <Root > |
Optional options object. |
Inherited from
GenericComplexEntity.constructor
new GenericGroupEntity<Props
, DefaultProps
, Root
>(props
, children?
, options?
)
Type parameters
Name | Type |
---|---|
Props |
Props |
DefaultProps |
extends Object = {} |
Root |
extends GenericRootEntity <unknown , {}, Root > = GenericRootEntity <unknown , {}> |
Parameters
Name | Type |
---|---|
props |
Props |
children? |
GenericEntity <unknown , {}, Root >[] |
options? |
Omit <ComplexOptions <Root >, "children" > |
Inherited from
GenericComplexEntity.constructor
Properties
children
readonly children: readonly GenericEntity<unknown, {}, Root>[]
Overrides
GenericComplexEntity.children
Accessors
parent
get
parent(): null
| GenericComplexEntity
<unknown
, {}, GenericRootEntity
<unknown
, {}>>
Get parent entity.
Returns
null
| GenericComplexEntity
<unknown
, {}, GenericRootEntity
<unknown
, {}>>
Inherited from
GenericComplexEntity.parent
root
get
root(): null
| Root
Get root entity.
Returns
null
| Root
Inherited from
GenericComplexEntity.root
Methods
addChild
addChild(child
, index?
): GenericGroupEntity
<Props
, DefaultProps
, Root
>
Parameters
Name | Type |
---|---|
child |
GenericEntity <unknown , {}, Root > |
index? |
number |
Returns
GenericGroupEntity
<Props
, DefaultProps
, Root
>
Overrides
GenericComplexEntity.addChild
removeChild
removeChild(child
): GenericGroupEntity
<Props
, DefaultProps
, Root
>
Parameters
Name | Type |
---|---|
child |
GenericEntity <unknown , {}, Root > |
Returns
GenericGroupEntity
<Props
, DefaultProps
, Root
>
Overrides
GenericComplexEntity.removeChild
update
update(changedProps
): void
Method for updating props of Entity.
Parameters
Name | Type | Description |
---|---|---|
changedProps |
Partial <Props > |
New props values. |
Returns
void
Inherited from
Class: GenericRootEntity<Props, DefaultProps>
Entity that is root and cannot be added anywhere
Example
type MMapProps = {
name?: string;
};
class MMap extends GenericRootEntity<MMapProps, typeof defaultProps> {
// ...
}
// Now we can specify their root element for the Entity
class MMapSomeEntity extends GenericEntity<MMapSomeEntityProps, typeof defaultProps, MMap> {
static defaultProps = defaultProps;
// ...
}
Type parameters
Name | Type | Description |
---|---|---|
Props |
Props |
Type of input props of the Entity. |
DefaultProps |
extends Object = {} |
Type of default input props of the Entity. |
Constructors
constructor
new GenericRootEntity<Props
, DefaultProps
>(props
, options?
)
Type parameters
Name | Type |
---|---|
Props |
Props |
DefaultProps |
extends Object = {} |
Parameters
Name | Type | Description |
---|---|---|
props |
Props |
The value of input props. |
options? |
ComplexOptions <GenericRootEntity <unknown , {}>> |
Optional options object. |
Inherited from
GenericGroupEntity.constructor
new GenericRootEntity<Props
, DefaultProps
>(props
, children?
, options?
)
Type parameters
Name | Type |
---|---|
Props |
Props |
DefaultProps |
extends Object = {} |
Parameters
Name | Type |
---|---|
props |
Props |
children? |
GenericEntity <unknown , {}, GenericRootEntity <unknown , {}>>[] |
options? |
Omit <ComplexOptions <GenericRootEntity <unknown , {}>>, "children" > |
Inherited from
GenericGroupEntity.constructor
Properties
children
readonly children: readonly GenericEntity<unknown, {}, GenericRootEntity<unknown, {}>>[]
Inherited from
Accessors
parent
get
parent(): null
| GenericComplexEntity
<unknown
, {}, GenericRootEntity
<unknown
, {}>>
Get parent entity.
Returns
null
| GenericComplexEntity
<unknown
, {}, GenericRootEntity
<unknown
, {}>>
Inherited from
GenericGroupEntity.parent
root
get
root(): this
Get root entity.
Returns
this
Overrides
GenericGroupEntity.root
Methods
addChild
addChild(child
, index?
): GenericRootEntity
<Props
, DefaultProps
>
Parameters
Name | Type |
---|---|
child |
GenericEntity <unknown , {}, GenericRootEntity <unknown , {}>> |
index? |
number |
Returns
GenericRootEntity
<Props
, DefaultProps
>
Inherited from
destroy
Abstract
destroy(): void
Completely destroys the entity tree including the current entity
Returns
void
removeChild
removeChild(child
): GenericRootEntity
<Props
, DefaultProps
>
Parameters
Name | Type |
---|---|
child |
GenericEntity <unknown , {}, GenericRootEntity <unknown , {}>> |
Returns
GenericRootEntity
<Props
, DefaultProps
>
Inherited from
GenericGroupEntity.removeChild
update
update(changedProps
): void
Method for updating props of Entity.
Parameters
Name | Type | Description |
---|---|---|
changedProps |
Partial <Props > |
New props values. |
Returns
void
Inherited from
Class: MMap
Main API class. Create a map container.
Example
const map = new MMap(
document.getElementById('map-root'),
{location: {center: [37.622504, 55.753215], zoom: 10}}
);
// add default Mappable scheme layer
map.addChild(new MMapDefaultSchemeLayer());
// relocate map to another point with animation in 200 milliseconds
map.setLocation({center: [48.707067, 44.516975], duration: 200});
// change mode from default `auto` to `raster`
map.setMode('raster');
// get map zoom for some calculations
const zoom = map.zoom;
Constructors
constructor
new MMap(rootContainer
, props
, children?
)
Parameters
Name | Type |
---|---|
rootContainer |
HTMLElement |
props |
MMapProps |
children? |
MMapEntity <unknown , {}>[] |
Overrides
Properties
children
readonly children: MMapEntity<unknown, {}>[]
Overrides
[overrideKeyReactify]
static [overrideKeyReactify]: CustomReactify<MMap, ForwardRefExoticComponent<{
behaviors?: BehaviorType[];
camera?: MMapCameraRequest;
children?: ReactNode;
className?: string;
config?: Config;
copyrights?: boolean;
copyrightsPosition?: MMapCopyrightsPosition;
hotspotsStrategy?: "forViewport" | "forPointerPosition";
key?: null | Key;
location: MMapLocationRequest;
margin?: Margin;
mode?: MapMode;
projection?: Projection;
ref?: Ref<MMap>;
restrictMapArea?: false | LngLatBounds;
showScaleInCopyrights?: boolean;
theme?: MMapTheme;
worldOptions?: WorldOptions;
zoomRange?: ZoomRange;
zoomRounding?: ZoomRounding;
zoomStrategy?: ZoomStrategy
}>>
defaultProps
static defaultProps: Readonly<{
behaviors: string[];
camera: {
azimuth: number;
tilt: number
};
className: "";
config: Config;
copyrights: true;
copyrightsPosition: "bottom right";
hotspotsStrategy: "forViewport" | "forPointerPosition";
margin: undefined | Margin;
mode: "auto";
projection: Projection;
restrictMapArea: false;
showScaleInCopyrights: false;
theme: "light";
worldOptions: {
cycledX: boolean;
cycledY: boolean
};
zoomRange: ZoomRange;
zoomRounding: "auto";
zoomStrategy: "zoomToPointer"
}>
Accessors
azimuth
get
azimuth(): number
Returns
number
behaviors
get
behaviors(): readonly BehaviorType
[]
getter for MMapProps.behaviors prop
Returns
readonly BehaviorType
[]
bounds
get
bounds(): LngLatBounds
getter for MMapProps.location.bounds prop
Returns
center
get
center(): readonly [number
, number
, undefined
| number
]
getter for MMapProps.location.center prop
Returns
readonly [number
, number
, undefined
| number
]
config
get
config(): Readonly
<Config
>
getter for MMapProps.config prop
Returns
container
get
container(): HTMLElement
Main map container
Returns
parent
get
parent(): null
| GenericComplexEntity
<unknown
, {}, GenericRootEntity
<unknown
, {}>>
Get parent entity.
Returns
null
| GenericComplexEntity
<unknown
, {}, GenericRootEntity
<unknown
, {}>>
Inherited from
GenericRootEntity.parent
projection
get
projection(): Projection
getter for MMapProps.projection prop
Returns
restrictMapArea
get
restrictMapArea(): Readonly
<false
| LngLatBounds
>
getter for MMapProps.restrictMapArea prop
Returns
Readonly
<false
| LngLatBounds
>
root
get
root(): this
Get root entity.
Returns
this
Inherited from
GenericRootEntity.root
size
get
size(): PixelCoordinates
getter for map size
Returns
theme
get
theme(): "dark"
| "light"
getter for MMapProps.theme prop
Returns
"dark"
| "light"
tilt
get
tilt(): number
Returns
number
tiltRange
get
tiltRange(): Readonly
<TiltRange
>
Returns
zoom
get
zoom(): number
getter for MMapProps.location.zoom prop
Returns
number
zoomRange
get
zoomRange(): Readonly
<ZoomRange
>
getter for MMapProps.zoomRange prop
Returns
Methods
addChild
addChild(child
, index?
): MMap
Parameters
Name | Type |
---|---|
child |
MMapEntity <unknown , {}> |
index? |
number |
Returns
Overrides
destroy
destroy(): void
Destroy map and remove it from user DOM-element
Returns
void
Overrides
removeChild
removeChild(child
): MMap
Parameters
Name | Type |
---|---|
child |
MMapEntity <unknown , {}> |
Returns
Overrides
setBehaviors
setBehaviors(behaviors
): void
setter for MMapProps.behaviors prop
Parameters
Name | Type |
---|---|
behaviors |
BehaviorType [] |
Returns
void
setCamera
setCamera(camera
): void
setter for MMapProps.camera prop
Parameters
Name | Type |
---|---|
camera |
MMapCameraRequest |
Returns
void
setConfig
setConfig(config
): void
setter for MMapProps.config prop
Parameters
Name | Type |
---|---|
config |
Config |
Returns
void
setLocation
setLocation(location
): void
setter for MMapProps.location prop
Parameters
Name | Type |
---|---|
location |
MMapLocationRequest |
Returns
void
setMargin
setMargin(margin
): void
setter for MMapProps.margin prop
Parameters
Name | Type |
---|---|
margin |
Margin |
Returns
void
setMode
setMode(mode
): void
setter for MMapProps.mode prop
Parameters
Name | Type |
---|---|
mode |
MapMode |
Returns
void
setProjection
setProjection(projection
): void
setter for MMapProps.projection prop
Parameters
Name | Type |
---|---|
projection |
Projection |
Returns
void
setRestrictMapArea
setRestrictMapArea(restrictMapArea
): void
setter for MMapProps.config prop
Parameters
Name | Type |
---|---|
restrictMapArea |
LngLatBounds |
Returns
void
setZoomRange
setZoomRange(zoomRange
): void
setter for MMapProps.zoomRange prop
Parameters
Name | Type |
---|---|
zoomRange |
ZoomRange |
Returns
void
setZoomRounding
setZoomRounding(zoomRounding
): void
setter for MMapProps.zoomRounding prop
Parameters
Name | Type |
---|---|
zoomRounding |
ZoomRounding |
Returns
void
update
update(changedProps
): void
Method for updating props of Entity.
Parameters
Name | Type | Description |
---|---|---|
changedProps |
Partial <MMapProps > |
New props values. |
Returns
void
Inherited from
Class: MMapComplexEntity<Props, DefaultProps>
Entity that aggregates multiple Entities but looks basic from the outside.
Type Param
Root Entity Class.
Example
type MMapSomeComplexEntityProps = {
name?: string;
};
const defaultProps = {
name: 'entity'
};
class MMapSomeComplexEntity extends MMapComplexEntity<MMapSomeComplexEntityProps, typeof defaultProps> {
static defaultProps = defaultProps;
private _someEntity?: MMapSomeEntity; // MMapSomeEntity extends GenericEntity
protected _onAttach(): void {
this._someEntity = new MMapSomeEntity();
this.addChild(this._someEntity); // add someEntity as children
// ...
}
// ...
}
Type parameters
Name | Type | Description |
---|---|---|
Props |
Props |
Type of input props of the Entity. |
DefaultProps |
extends Object = {} |
Type of default input props of the Entity. |
Implements
MMapEntity
<Props
,DefaultProps
>
Constructors
constructor
new MMapComplexEntity<Props
, DefaultProps
>(props
, options?
)
Type parameters
Name | Type |
---|---|
Props |
Props |
DefaultProps |
extends Object = {} |
Parameters
Name | Type | Description |
---|---|---|
props |
Props |
The value of input props. |
options? |
ComplexOptions <MMap > |
Optional options object. |
Inherited from
GenericComplexEntity.constructor
new MMapComplexEntity<Props
, DefaultProps
>(props
, children?
, options?
)
Type parameters
Name | Type |
---|---|
Props |
Props |
DefaultProps |
extends Object = {} |
Parameters
Name | Type |
---|---|
props |
Props |
children? |
GenericEntity <unknown , {}, MMap >[] |
options? |
Omit <ComplexOptions <MMap >, "children" > |
Inherited from
GenericComplexEntity.constructor
Accessors
parent
get
parent(): null
| MMapComplexEntity
<unknown
, {}>
Get parent entity.
Returns
null
| MMapComplexEntity
<unknown
, {}>
Implementation of
MMapEntity.parent
Overrides
GenericComplexEntity.parent
root
get
root(): null
| MMap
Get root entity.
Returns
null
| MMap
Implementation of
MMapEntity.root
Overrides
GenericComplexEntity.root
Methods
update
update(changedProps
): void
Method for updating props of Entity.
Parameters
Name | Type | Description |
---|---|---|
changedProps |
Partial <Props > |
New props values. |
Returns
void
Implementation of
Inherited from
Class: MMapEntity<Props, DefaultProps>
Entity Base Class. It has event handlers for attaching, detaching and updating props. Has a method for providing and using context.
Example
type MMapSomeEntityProps = {
name?: string;
};
const defaultProps = {
name: 'entity'
};
class MMapSomeEntity extends MMapEntity<MMapSomeEntityProps, typeof defaultProps> {
static defaultProps = defaultProps;
public isAttached: boolean;
constructor(props: MMapSomeEntityProps) {
super(props);
this.isAttached = false
// Additional actions can be taken in the constructor of a class.
}
protected _onAttach(): void {
this.isAttached = true;
// Additional actions can be taken when an Entity is attached.
}
// ...
}
Type parameters
Name | Type | Description |
---|---|---|
Props |
Props |
Type of input props of the Entity. |
DefaultProps |
extends Object = {} |
Type of default input props of the Entity. |
Implemented by
Constructors
constructor
new MMapEntity<Props
, DefaultProps
>(props
)
Type parameters
Name | Type |
---|---|
Props |
Props |
DefaultProps |
extends Object = {} |
Parameters
Name | Type | Description |
---|---|---|
props |
Props |
The value of input props. |
Inherited from
Accessors
parent
get
parent(): null
| MMapComplexEntity
<unknown
, {}>
Get parent entity.
Returns
null
| MMapComplexEntity
<unknown
, {}>
Overrides
GenericEntity.parent
root
get
root(): null
| MMap
Get root entity.
Returns
null
| MMap
Overrides
GenericEntity.root
Methods
update
update(changedProps
): void
Method for updating props of Entity.
Parameters
Name | Type | Description |
---|---|---|
changedProps |
Partial <Props > |
New props values. |
Returns
void
Inherited from
Interface: IClusterMethod
Interface of method class
Methods
render
render(props
): ClustererObject
[]
Parameters
Name | Type |
---|---|
props |
RenderProps |
Returns
Interface: Apikeys
Properties
router
optional router: string
search
optional search: string
suggest
optional suggest: string
Interface: ComplexOptions<Root>
Type parameters
Name | Type |
---|---|
Root |
extends GenericRootEntity <unknown > = GenericRootEntity <unknown > |
Properties
children
optional children: GenericEntity<unknown, {}, Root>[]
container
optional container: boolean
Interface: GenericFeature<TCoordinates>
Type parameters
Name |
---|
TCoordinates |
Properties
geometry
geometry: GenericGeometry<TCoordinates>
id
id: string
properties
optional properties: Record<string, unknown>
type
type: "Feature"
Interface: GenericLineStringGeometry<TCoordinates>
Type parameters
Name |
---|
TCoordinates |
Properties
coordinates
coordinates: TCoordinates[]
type
type: "LineString"
Interface: GenericMultiLineStringGeometry<TCoordinates>
Type parameters
Name |
---|
TCoordinates |
Properties
coordinates
coordinates: TCoordinates[][]
type
type: "MultiLineString"
Interface: GenericMultiPolygonGeometry<TCoordinates>
Type parameters
Name |
---|
TCoordinates |
Properties
coordinates
coordinates: TCoordinates[][][]
Array of polygons. See GenericPolygonGeometry.
type
type: "MultiPolygon"
Interface: GenericPointFeature<TCoordinates>
Type parameters
Name |
---|
TCoordinates |
Properties
geometry
geometry: GenericPointGeometry<TCoordinates>
Overrides
id
id: string
Inherited from
properties
optional properties: Record<string, unknown>
Inherited from
type
type: "Feature"
Inherited from
Interface: GenericPointGeometry<TCoordinates>
Type parameters
Name |
---|
TCoordinates |
Properties
coordinates
coordinates: TCoordinates
type
type: "Point"
Interface: GenericPolygonGeometry<TCoordinates>
Type parameters
Name |
---|
TCoordinates |
Properties
coordinates
coordinates: TCoordinates[][]
Polygon's rings.
Remarks
Inner rings may extend beyond outer ring.
GeoJSON doesn't allow this, but there's a lot of data like this in this JS API.
type
type: "Polygon"
Interface: GenericProjection<TSource>
Type parameters
Name |
---|
TSource |
Properties
type
optional readonly type: string
Projection identity type. It may be:
- EPSG-code (e.g. EPSG:3857)
- any other string to identify (e.g. 'cartesian')
Methods
fromWorldCoordinates
fromWorldCoordinates(coordinates
): TSource
Parameters
Name | Type |
---|---|
coordinates |
WorldCoordinates |
Returns
TSource
toWorldCoordinates
toWorldCoordinates(point
): WorldCoordinates
Parameters
Name | Type |
---|---|
point |
TSource |
Returns
Interface: PixelCoordinates
Global pixel coordinates. World size depends on zoom.
Left top is (0; 0).
Right bottom is (2**(zoom + 8); 2**(zoom + 8)).
Properties
type
optional readonly type: "pixel"
x
x: number
Inherited from
y
y: number
Inherited from
Interface: ReactParent
Properties
entityRef
entityRef: RefInstance<GenericEntity<unknown, {}, GenericRootEntity<unknown, {}>>>
Methods
positionChild
positionChild(entity
): number
Parameters
Name | Type |
---|---|
entity |
RefInstance <GenericEntity <unknown , {}, GenericRootEntity <unknown , {}>>> |
Returns
number
requestReposition
requestReposition(): void
Returns
void
Interface: TiltRange
Properties
expansion
readonly expansion: number
Behavior tilt expansion in radians. E.g. you can tilt map with fingers a little bit more than max
.
max
readonly max: number
Maximum tilt in radians.
min
readonly min: number
Minimum tilt in radians.
Interface: Vec2
Properties
x
x: number
y
y: number
Interface: VuefyModuleFn
Callable
VuefyModuleFn
VuefyModuleFn<TModule
>(module
, props?
): VuefiedModule
<TModule
>
Type parameters
Name | Type |
---|---|
TModule |
extends BaseModule = BaseModule |
Parameters
Name | Type |
---|---|
module |
TModule |
props? |
VuefyPropsModule <TModule > |
Returns
VuefiedModule
<TModule
>
Interface: WorldCoordinates
Coordinates in [-1 ... +1].
Left bottom is (-1; -1).
Right top is (+1; +1).
Center is (0; 0).
Properties
type
optional readonly type: "world"
x
x: number
Inherited from
y
y: number
Inherited from
z
optional z: number
Interface: WorldOptions
Properties
cycledX
readonly cycledX: boolean
Interface: ZoomRange
Properties
max
max: number
min
min: number
Type Aliases
ClustererObject
ClustererObject: Object
Represents object on a map (either cluster or feature)
Type declaration
Name | Type |
---|---|
clusterId |
string |
features |
Feature [] |
lnglat |
LngLat |
world |
WorldCoordinates |
ClustersCollection
ClustersCollection: Map<string, Cluster>
EntitiesMap
EntitiesMap: Record<string, MMapEntity<unknown> | undefined>
Represents map of entities with its id
Feature
Feature: GenericPointFeature<LngLat>
Feature to clusterize on a map
MMapClustererProps
MMapClustererProps: Object
MMapClusterer props
Type declaration
Name | Type | Description |
---|---|---|
cluster |
(coordinates : LngLat , features : Feature []) => MMapEntity <unknown > |
Function to create marker for cluster |
features |
Feature [] |
Features |
marker |
(feature : Feature ) => MMapEntity <unknown > |
Function to create marker for point |
maxZoom? |
number |
Maximum zoom for clusterisation. If map zoom is bigger, markers will be displayed as is. |
method |
IClusterMethod |
Clusterisation method |
onRender? |
(clusters : ClustererObject []) => void | false |
Return false, if you want to override the render |
tickTimeout? |
number |
The amount of time that may be passed before the render method can be called again |
RenderProps
RenderProps: Object
Props for rendering
Type declaration
Name | Type |
---|---|
features |
Feature [] |
map |
MMap |
Functions
clusterByGrid
clusterByGrid(«destructured»
): IClusterMethod
Parameters
Name | Type |
---|---|
«destructured» |
Object |
› gridSize |
number |
Returns
Module: <internal>
Type Aliases
BaseModule
BaseModule: Record<string | symbol, unknown>
BehaviorType
BehaviorType: "drag" | "pinchZoom" | "scrollZoom" | "dblClick" | "magnifier" | "oneFingerZoom" | "mouseRotate" | "mouseTilt" | "pinchRotate" | "panTilt"
Cluster
Cluster: Object
Cluster that contains cluster or feature and its sum of coordinates
Type declaration
Name | Type |
---|---|
features |
Feature [] |
objects |
ClustererObject [] |
sumX |
number |
sumY |
number |
ContextWatcherFn
ContextWatcherFn: () => void
Type declaration
(): void
Returns
void
CustomReactify
CustomReactify<TEntity,
TResult\>: (`ctor`: EntityConstructor<TEntity>, `params`: {
React: typeof TReact;
ReactDOM: typeof TReactDOM;
ReactParent: typeof ReactParent;
reactify: {
context: <TContext>(`context?`: TContext) => TReact.Context<unknown>;
module: ReactifyModule;
entity: <T>(...`args`: [ctor: T, displayName?: string]) => T extends Overrided<T, TResult> ? TResult : ForwardRefExoticComponent<PropsWithoutRef<PropsWithChildren<EntityProps<InstanceType<T>>>> & RefAttributes<undefined | InstanceType<T>>>
}
}) => TResult
Type parameters
Name | Type |
---|---|
TEntity |
extends GenericEntity <unknown > |
TResult |
TResult |
Type declaration
(ctor
, params
): TResult
Parameters
Name | Type |
---|---|
ctor |
EntityConstructor <TEntity > |
params |
Object |
params.React |
typeof TReact |
params.ReactDOM |
typeof TReactDOM |
params.ReactParent |
typeof ReactParent |
params.reactify |
Object |
params.reactify.context |
<TContext>(context? : TContext ) => TReact.Context <unknown > |
params.reactify.module |
ReactifyModule |
params.reactify.entity |
<T>(...args : [ctor: T, displayName?: string]) => T extends Overrided <T , TResult > ? TResult : ForwardRefExoticComponent <PropsWithoutRef <PropsWithChildren <EntityProps <InstanceType <T >>>> & RefAttributes <undefined | InstanceType <T >>> |
Returns
TResult
CustomVuefyFn
CustomVuefyFn<TEntity,
TExternalProps\>: (`ctor`: EntityConstructor<TEntity>, `props`: VuefyPropsObject<TExternalProps>, `params`: {
Vue: typeof TVue;
vuefy: {
context: VuefyContextFn;
entity: VuefyEntityFn;
module: VuefyModuleFn
}
}) => TVue.Component<TExternalProps>
Type parameters
Name | Type |
---|---|
TEntity |
extends DefaultEntity |
TExternalProps |
EntityProps <TEntity > |
Type declaration
(ctor
, props
, params
): TVue.Component
<TExternalProps
>
Parameters
Name | Type |
---|---|
ctor |
EntityConstructor <TEntity > |
props |
VuefyPropsObject <TExternalProps > |
params |
Object |
params.Vue |
typeof TVue |
params.vuefy |
Object |
params.vuefy.context |
VuefyContextFn |
params.vuefy.entity |
VuefyEntityFn |
params.vuefy.module |
VuefyModuleFn |
Returns
TVue.Component
<TExternalProps
>
CustomVuefyOptions
CustomVuefyOptions<TEntity,
TExternalProps\>: Object
Type parameters
Name | Type |
---|---|
TEntity |
extends DefaultEntity |
TExternalProps |
EntityProps <TEntity > |
Type declaration
Name | Type |
---|---|
props |
VuefyPropsObject <TExternalProps > | VuefyPropsArray <TExternalProps > |
DefaultContext
DefaultContext: Context<unknown>
DefaultCtor
DefaultCtor: EntityConstructor<DefaultEntity>
DefaultEntity
DefaultEntity: GenericEntity<unknown>
DefaultProps
DefaultProps: typeof defaultProps
DefaultProps
DefaultProps: typeof defaultProps
EasingBezierPreset
EasingBezierPreset: Object
Type declaration
Name | Type |
---|---|
p1 |
Vec2 |
p2 |
Vec2 |
EasingFunction
EasingFunction: (`x`: number) => number
Type declaration
(x
): number
Parameters
Name | Type |
---|---|
x |
number |
Returns
number
EasingFunctionDescription
EasingFunctionDescription: EasingPresetName | EasingBezierPreset | EasingFunction
EasingPresetName
EasingPresetName: "linear" | "ease" | "ease-in" | "ease-out" | "ease-in-out"
EntityConstructor
EntityConstructor<TEntity\>: (...`args`: any[]) => TEntity
Type parameters
Name | Type |
---|---|
TEntity |
extends GenericEntity <unknown > |
Type declaration
(...args
)
Parameters
Name | Type |
---|---|
...args |
any [] |
EntityProps
EntityProps<T\>: T extends GenericEntity<infer P> ? P : never
Type parameters
Name | Type |
---|---|
T |
extends GenericEntity <unknown > |
GenericBounds
GenericBounds<T\>: [T, T]
Generic for rectangle bounded by bottom-left and top-right coordinates
Type parameters
Name |
---|
T |
GenericGeometry
GenericGeometry<TCoordinates\>: GenericPolygonGeometry<TCoordinates> | GenericMultiPolygonGeometry<TCoordinates> | GenericLineStringGeometry<TCoordinates> | GenericMultiLineStringGeometry<TCoordinates> | GenericPointGeometry<TCoordinates>
Type parameters
Name |
---|
TCoordinates |
LngLat
LngLat: [lon: number, lat: number, alt?: number]
Tuple with geodesic coordinates in longitude latitude order.
GeoJSON also uses this order https://tools.ietf.org/html/rfc7946#appendix-A.1
LngLatBounds
LngLatBounds: GenericBounds<LngLat>
Rectangle bounded by top-left and bottom-right coordinates
MMapBoundsLocation
MMapBoundsLocation: Object
Sets map bounds.
Type declaration
Name | Type |
---|---|
bounds |
LngLatBounds |
MMapCamera
MMapCamera: Object
Observer camera position
Type declaration
Name | Type | Description |
---|---|---|
azimuth? |
number |
Map rotation in radians. Can take values from -Math.PI to Math.PI |
tilt? |
number |
Map tilt in radians. Can take values from 0 to 50 degrees (degrees * (Math.PI / 180)) |
MMapCameraRequest
MMapCameraRequest: MMapCamera & {
duration?: number;
easing?: EasingFunctionDescription
}
MMapCenterLocation
MMapCenterLocation: Object
Sets map center.
Type declaration
Name | Type |
---|---|
center |
LngLat |
MMapCenterZoomLocation
MMapCenterZoomLocation: MMapCenterLocation & MMapZoomLocation
Sets map center and zoom. Combination of MMapCenterLocation and MMapZoomLocation
MMapCopyrightsPosition
MMapCopyrightsPosition: "top left" | "top right" | "bottom left" | "bottom right"
MMapLocationRequest
MMapLocationRequest: MMapBoundsLocation | MMapCenterLocation | MMapZoomLocation | MMapCenterZoomLocation & {
duration?: number;
easing?: EasingFunctionDescription
}
Describes how to change current map location. Change can be instantenious or animated if duration property is set.
MMapProps
MMapProps: Object
MMap props
Type declaration
Name | Type | Description |
---|---|---|
behaviors? |
BehaviorType [] |
Active behaviors |
camera? |
MMapCameraRequest |
Initial camera or request to change camera with duration |
className? |
string |
Map container css class name |
config? |
Config |
Other configs |
copyrightsPosition? |
MMapCopyrightsPosition |
Position of copyright on the page. Default is 'bottom right' |
hotspotsStrategy? |
"forViewport" | "forPointerPosition" |
Strategy for fetching hotspots, for whole viewport or for tiles that pointer is hovering at |
location |
MMapLocationRequest |
Initial location or request to change location with duration |
margin? |
Margin |
Map margins |
mode? |
MapMode |
Map mode, 'auto' (default. Show raster tiles while vector tiles are loading), 'raster' or 'vector' (without raster preloading). |
projection? |
Projection |
Projection used in map |
restrictMapArea? |
LngLatBounds | false |
Sets the map view area so that the user cannot move outside of this area. |
showScaleInCopyrights? |
boolean |
Show the map scale next to copyright |
theme? |
MMapTheme |
Theme applied to the scheme |
worldOptions? |
WorldOptions |
Whether to repeat the world in X and Y |
zoomRange? |
ZoomRange |
Restrict min and max map zoom |
zoomRounding? |
ZoomRounding |
Set rounding for zoom. If auto is selected, zoom will be snap for raster and smooth for vector MapMode . Default is auto . |
zoomStrategy? |
ZoomStrategy |
Zoom strategy describes if map center is bound to the zoom point or not |
MMapTheme
MMapTheme: "light" | "dark"
Sets map theme
MMapZoomLocation
MMapZoomLocation: Object
Sets map zoom.
Type declaration
Name | Type |
---|---|
zoom |
number |
MapMode
MapMode: "raster" | "vector" | "auto"
Margin
Margin: [number, number, number, number]
Map margins in pixels. Order is top, right, bottom, left.
Overrided
Overrided<TCtor,
TReactResult\>: Object
Type parameters
Name | Type |
---|---|
TCtor |
extends EntityConstructor <GenericEntity <unknown >> |
TReactResult |
TReactResult |
Type declaration
Name | Type |
---|---|
[overrideKeyReactify] |
CustomReactify <InstanceType <TCtor >, TReactResult > |
Projection
Projection: GenericProjection<LngLat>
PropsFromCtor
PropsFromCtor<TCtor\>: EntityProps<InstanceType<TCtor>>
Type parameters
Name | Type |
---|---|
TCtor |
extends DefaultCtor |
RefInstance
RefInstance<TEntity\>: React.MutableRefObject<TEntity | undefined>
Type parameters
Name | Type |
---|---|
TEntity |
extends GenericEntity <unknown > |
VuefiedModule
VuefiedModule<TModule\>: { [Property in keyof TModule]: TModule[Property] extends DefaultCtor ? ReturnType<VuefyEntityFnGen<TModule[Property]\>\> : TModule[Property] extends typeof Context ? ReturnType<VuefyContextFn\> : TModule[Property] }
Type parameters
Name | Type |
---|---|
TModule |
extends BaseModule |
VuefyContextFn
VuefyContextFn: <TContext>(`context?`: TContext) => symbol
Type declaration
<TContext
>(context?
): symbol
Type parameters
Name | Type |
---|---|
TContext |
extends DefaultContext |
Parameters
Name | Type |
---|---|
context? |
TContext |
Returns
symbol
VuefyEntityFn
VuefyEntityFn: <TCtor, TProps>(...`args`: Parameters<VuefyEntityFnGen<TCtor, TProps>>) => ReturnType<VuefyEntityFnGen<TCtor, TProps>>
Type declaration
<TCtor
, TProps
>(...args
): ReturnType
<VuefyEntityFnGen
<TCtor
, TProps
>>
Type parameters
Name | Type |
---|---|
TCtor |
extends DefaultCtor |
TProps |
PropsFromCtor <TCtor > |
Parameters
Name | Type |
---|---|
...args |
Parameters <VuefyEntityFnGen <TCtor , TProps >> |
Returns
ReturnType
<VuefyEntityFnGen
<TCtor
, TProps
>>
VuefyEntityFnGen
VuefyEntityFnGen<TCtor,
TProps\>: (`ctor`: TCtor, `props?`: VuefyPropsObject<TProps> | VuefyPropsArray<TProps>, `displayName?`: string) => TVue.Component<TProps>
Type parameters
Name | Type |
---|---|
TCtor |
extends DefaultCtor |
TProps |
PropsFromCtor <TCtor > |
Type declaration
(ctor
, props?
, displayName?
): TVue.Component
<TProps
>
Parameters
Name | Type |
---|---|
ctor |
TCtor |
props? |
VuefyPropsObject <TProps > | VuefyPropsArray <TProps > |
displayName? |
string |
Returns
TVue.Component
<TProps
>
VuefyPropsArray
VuefyPropsArray<RawProps\>: keyof RawProps[]
Type parameters
Name |
---|
RawProps |
VuefyPropsModule
VuefyPropsModule<TModule\>: { [Key in keyof TModule]: TModule[Key] extends GenericEntity<infer Props\> ? VuefyPropsObject<Props\> \| VuefyPropsArray<Props\> : unknown }
Type parameters
Name | Type |
---|---|
TModule |
extends BaseModule |
VuefyPropsObject
VuefyPropsObject<RawProps\>: { [K in keyof RawProps]-?: TVue.PropType<RawProps[K]\> \| TVue.Prop<RawProps[K]\> }
Type parameters
Name |
---|
RawProps |
WithDefaults
WithDefaults<Props,
DefaultProps\>: Props & { [K in keyof DefaultProps]: K extends keyof Props ? NonNullable<Props[K]\> : never }
Type parameters
Name | Type |
---|---|
Props |
Props |
DefaultProps |
extends Partial <Props > |
ZoomRounding
ZoomRounding: "snap" | "smooth" | "auto"
Set rounding for zoom.
If auto
is selected, zoom will be snap
for raster
and smooth
for vector
MapMode
.
Default is auto
.
ZoomStrategy
ZoomStrategy: "zoomToCenter" | "zoomToPointer"
Variables
ReactParent
ReactParent: React.Context<[ReactParent] | undefined>
ReactParent
ReactParent: Context<undefined | [ReactParent]>
defaultProps
const defaultProps: Readonly<{
tickTimeout: 200
}>
defaultProps
const defaultProps: Readonly<{
behaviors: string[];
camera: {
azimuth: number;
tilt: number
};
className: "";
config: Config;
copyrights: true;
copyrightsPosition: "bottom right";
hotspotsStrategy: "forViewport" | "forPointerPosition";
margin: Margin | undefined;
mode: "auto";
projection: Projection;
restrictMapArea: false;
showScaleInCopyrights: false;
theme: "light";
worldOptions: {
cycledX: boolean;
cycledY: boolean
};
zoomRange: ZoomRange;
zoomRounding: "auto";
zoomStrategy: "zoomToPointer"
}>