Klasa MarkerElement
google.maps.maps3d.MarkerElement
class
extends HTMLElement
implements MarkerElementOptions
library "maps3d"
Pokazuje pozycję na mapie 3D. Pamiętaj, że aby wyświetlać MarkerElement, musisz ustawić position.
<gmp-marker altitude-mode="value-name" anchor-left="string" anchor-top="string" autofits-camera collision-behavior="value-name" collision-priority="number" position="lat,lng" title="string"> </gmp-marker>
const {MarkerElement} = await google.maps.importLibrary("maps3d");
Zespół | |
|---|---|
MarkerElement |
MarkerElement([options])Parametry:
Tworzy MarkerElement z określonymi opcjami. |
Właściwości | |
|---|---|
altitudeMode
attr: altitude-mode |
Domyślnie:
AltitudeMode.CLAMP_TO_GROUNDOkreśla sposób interpretowania wysokości nad poziomem morza.
Atrybut HTML: altitude-mode="value-name" |
anchorLeft
attr: anchor-left |
Typ danych wejściowych:
string optionalTyp danych wyjściowych: stringDomyślnie: -50%
Wartość długości i procentu w CSS, która służy do przesunięcia punktu zakotwiczenia od lewego górnego rogu znacznika. Jest to przydatne, gdy używasz elementu wizualnego, który ma punkt zakotwiczenia inny niż typowy dolny środkowy punkt domyślnego znacznika.
Atrybut HTML: anchor-left="string" |
anchorTop
attr: anchor-top |
Typ danych wejściowych:
string optionalTyp danych wyjściowych: stringDomyślnie: –100%
Wartość długości i procentu w CSS, która służy do przesunięcia punktu zakotwiczenia od lewego górnego rogu znacznika. Jest to przydatne, gdy używasz elementu wizualnego, który ma punkt zakotwiczenia inny niż typowy dolny środkowy punkt domyślnego znacznika.
Atrybut HTML: anchor-top="string" |
attr: autofits-camera |
Typ:
boolean optionalDomyślnie:
falseJeśli podasz tę wartość, określony znacznik będzie widoczny w obszarze widoku mapy wraz z innymi elementami, które zostały wybrane.
Atrybut HTML: autofits-camera |
collisionBehavior
attr: collision-behavior |
Domyślnie:
CollisionBehavior.REQUIREDWyliczenie określające, jak element MarkerElement powinien się zachowywać, gdy koliduje z innym elementem
MarkerElement, Marker3DElement lub z etykietami mapy podstawowej.Atrybut HTML: collision-behavior="value-name" |
collisionPriority
attr: collision-priority |
Typ danych wejściowych:
number optionalTyp danych wyjściowych: number optionalLiczba, która pomaga określić względny priorytet znaczników
CollisionBehavior.OPTIONAL_AND_HIDES_LOWER_PRIORITY (w tym Marker3DElement). Wyższa wartość collisionPriority oznacza wyższy priorytet.Atrybut HTML: collision-priority="number" |
position
attr: position |
Typ danych wejściowych:
LatLngLiteral|LatLngAltitude|LatLngAltitudeLiteral optionalTyp danych wyjściowych: LatLngAltitude optionalLokalizacja końcówki znacznika. Wysokość jest ignorowana w niektórych trybach, dlatego jest opcjonalna.
Atrybut HTML:
|
title
attr: title |
Typ:
stringTekst po najechaniu kursorem. Jeśli podasz tekst ułatwień dostępu (np. do użycia z czytnikami ekranu), zostanie on dodany do elementu
MarkerElement z podaną wartością.Atrybut HTML: title="string" |
Przedziały | |
|---|---|
default |
Wszystkie elementy niestandardowe dodane bezpośrednio do MarkerElement zostaną umieszczone w gniazdach. |
Właściwości CSS | |
|---|---|
z-index |
Kolejność nakładania elementów tego znacznika. Więcej informacji znajdziesz w z-index dokumentacji. Nakładające się znaczniki o większym indeksie Z zakrywają te o mniejszym indeksie. Domyślnie znaczniki są wyświetlane zgodnie z ich pozycją w DOM, przy czym znaczniki dodane później w DOM pojawiają się przed znacznikami dodanymi wcześniej. |
Metody | |
|---|---|
Dziedziczone:
addEventListener,
removeEventListener
|
MarkerElementOptions interfejs
Interfejs
google.maps.maps3d.MarkerElementOptions
Obiekt MarkerElementOptions służący do definiowania właściwości, które można ustawić w MarkerElement.
Właściwości | |
|---|---|
altitudeMode
opcjonalne |
Typ:
AltitudeMode optionalZobacz MarkerElement.altitudeMode. |
anchorLeft
opcjonalne |
Typ:
string optionalZobacz MarkerElement.anchorLeft. |
anchorTop
opcjonalne |
Typ:
string optionalZobacz MarkerElement.anchorTop. |
opcjonalne |
Typ:
boolean optionalZobacz . |
collisionBehavior
opcjonalne |
Typ:
CollisionBehavior optionalZobacz MarkerElement.collisionBehavior. |
collisionPriority
opcjonalne |
Typ:
number optionalZobacz MarkerElement.collisionPriority. |
position
opcjonalne |
Typ:
LatLngLiteral|LatLngAltitude|LatLngAltitudeLiteral optionalZobacz MarkerElement.position. |
title
opcjonalne |
Typ:
string optionalZobacz MarkerElement.title. |
Klasa MarkerInteractiveElement
google.maps.maps3d.MarkerInteractiveElement
class
extends MarkerElement
implements MarkerInteractiveElementOptions
library "maps3d"
Pokazuje pozycję na mapie 3D. Pamiętaj, że aby wyświetlać MarkerInteractiveElement, musisz ustawić position. W przeciwieństwie do MarkerElement MarkerInteractiveElement otrzymuje zdarzenie gmp-click.
<gmp-marker-interactive gmp-popover-target-element="popover-id"> </gmp-marker-interactive>
const {MarkerInteractiveElement} = await google.maps.importLibrary("maps3d");
Zespół | |
|---|---|
MarkerInteractiveElement |
MarkerInteractiveElement([options])Parametry:
Tworzy MarkerInteractiveElement z określonymi opcjami. |
Właściwości | |
|---|---|
gmpPopoverTargetElement
attr: gmp-popover-target-element |
Po ustawieniu element wyskakujący będzie otwierany po kliknięciu tego znacznika.
Atrybut HTML: gmp-popover-target-element="popover-id" |
Dziedziczone:
altitudeMode (atrybut: altitude-mode),
anchorLeft (atrybut: anchor-left),
anchorTop (atrybut: anchor-top),
(atrybut: autofits-camera),
collisionBehavior (atrybut: collision-behavior),
collisionPriority (atrybut: collision-priority),
position (atrybut: position),
title (atrybut: title)
| |
Przedziały | |
|---|---|
Dziedziczone:
default
|
Właściwości CSS | |
|---|---|
Dziedziczone:
z-index
|
Metody | |
|---|---|
Dziedziczone:
addEventListener,
removeEventListener
|
Wydarzenia | |
|---|---|
gmp-click |
function(clickEvent)Argumenty:
To zdarzenie jest wywoływane po kliknięciu elementu MarkerInteractiveElement. |
MarkerInteractiveElementOptions interface
google.maps.maps3d.MarkerInteractiveElementOptions
interface
extends MarkerElementOptions
Obiekt MarkerInteractiveElementOptions służący do definiowania właściwości, które można ustawić w MarkerInteractiveElement.
Właściwości | |
|---|---|
gmpPopoverTargetElement
opcjonalne |
Typ:
PopoverElement optional |
Dziedziczone:
altitudeMode,
anchorLeft,
anchorTop,
,
collisionBehavior,
collisionPriority,
position,
title
| |
Klasa Marker3DElement
google.maps.maps3d.Marker3DElement
class
extends HTMLElement
implements Marker3DElementOptions
library "maps3d"
Pokazuje pozycję na mapie 3D. Pamiętaj, że aby wyświetlać Marker3DElement, musisz ustawić position.
<gmp-marker-3d altitude-mode="value-name" autofits-camera collision-behavior="value-name" collision-priority="number" draws-when-occluded extruded label="string" position="lat,lng" size-preserved z-index="number"> </gmp-marker-3d>
const {Marker3DElement} = await google.maps.importLibrary("maps3d");
Zespół | |
|---|---|
Marker3DElement |
Marker3DElement([options])Parametry:
Tworzy Marker3DElement z określonymi opcjami. |
Właściwości | |
|---|---|
altitudeMode
attr: altitude-mode |
Domyślnie:
AltitudeMode.CLAMP_TO_GROUNDOkreśla sposób interpretowania wysokości nad poziomem morza.
Atrybut HTML: altitude-mode="value-name" |
attr: autofits-camera |
Typ danych wejściowych:
boolean optionalTyp danych wyjściowych: booleanDomyślnie:
falseJeśli podasz tę wartość, określony znacznik będzie widoczny w obszarze widoku mapy wraz z innymi elementami, które zostały wybrane.
Atrybut HTML: autofits-camera |
collisionBehavior
attr: collision-behavior |
Domyślnie:
CollisionBehavior.REQUIREDWyliczenie określające, jak element Marker3DElement powinien się zachowywać, gdy koliduje z innym elementem Marker3DElement lub z etykietami mapy podstawowej.
Atrybut HTML: collision-behavior="value-name" |
collisionPriority
attr: collision-priority |
Typ danych wejściowych:
number optionalTyp danych wyjściowych: number optionalPriorytet kolizji używany do wykrywania kolizji.
Atrybut HTML: collision-priority="number" |
drawsWhenOccluded
attr: draws-when-occluded |
Typ danych wejściowych:
boolean optionalTyp danych wyjściowych: booleanDomyślnie:
falseOkreśla, czy ten znacznik powinien być rysowany, gdy jest zasłonięty. Znacznik może być zasłonięty przez geometrię mapy (np. budynki).
Atrybut HTML: draws-when-occluded |
extruded
attr: extruded |
Typ danych wejściowych:
boolean optionalTyp danych wyjściowych: booleanDomyślnie:
falseOkreśla, czy znacznik ma być połączony z ziemią. Aby wyciągnąć znacznik,
altitudeMode musi mieć wartość RELATIVE_TO_GROUND lub ABSOLUTE.Atrybut HTML: extruded |
label
attr: label |
Typ danych wejściowych:
string optionalTyp danych wyjściowych: string optionalTekst, który ma być wyświetlany przez ten znacznik.
Atrybut HTML: label="string" |
position
attr: position |
Typ danych wejściowych:
LatLngLiteral|LatLngAltitude|LatLngAltitudeLiteral optionalTyp danych wyjściowych: LatLngAltitude optionalLokalizacja końcówki znacznika. Wysokość jest ignorowana w niektórych trybach, dlatego jest opcjonalna.
Atrybut HTML:
|
sizePreserved
attr: size-preserved |
Typ danych wejściowych:
boolean optionalTyp danych wyjściowych: booleanDomyślnie:
falseOkreśla, czy ten znacznik powinien zachować swój rozmiar niezależnie od odległości od kamery. Domyślnie znacznik jest skalowany na podstawie odległości od kamery lub nachylenia.
Atrybut HTML: size-preserved |
zIndex
attr: z-index |
Typ danych wejściowych:
number optionalTyp danych wyjściowych: number optionalWartość zIndex w porównaniu z innymi znacznikami.
Atrybut HTML: z-index="number" |
Przedziały | |
|---|---|
default |
Wszystkie elementy niestandardowe dodane bezpośrednio do elementu Marker3DElement zostaną umieszczone w odpowiednich miejscach, ale do rysowania znaczników będą używane tylko elementy typu HTMLImageElement, SVGElement i PinElement. Inne elementy zostaną zignorowane. Elementy HTMLImageElement i SVGElement muszą być opakowane w element <template> przed przypisaniem do domyślnego boksu elementu Marker3DElement. Obrazy i pliki SVG są obecnie rasteryzowane przed renderowaniem w scenie 3D, więc niestandardowy kod HTML umieszczony w plikach SVG lub klasy CSS dodane do obrazów nie zostaną zastosowane i mogą nie być odzwierciedlane, gdy znaczniki są wyświetlane na ekranie. |
Metody | |
|---|---|
Dziedziczone:
addEventListener,
removeEventListener
|
Marker3DElementOptions interface
Interfejs
google.maps.maps3d.Marker3DElementOptions
Obiekt Marker3DElementOptions służący do definiowania właściwości, które można ustawić w Marker3DElement.
Właściwości | |
|---|---|
altitudeMode
opcjonalne |
Typ:
AltitudeMode optionalZobacz Marker3DElement.altitudeMode. |
opcjonalne |
Typ:
boolean optionalZobacz . |
collisionBehavior
opcjonalne |
Typ:
CollisionBehavior optional |
collisionPriority
opcjonalne |
Typ:
number optional |
drawsWhenOccluded
opcjonalne |
Typ:
boolean optional |
extruded
opcjonalne |
Typ:
boolean optionalZobacz Marker3DElement.extruded. |
label
opcjonalne |
Typ:
string optionalZobacz Marker3DElement.label. |
position
opcjonalne |
Typ:
LatLngLiteral|LatLngAltitude|LatLngAltitudeLiteral optionalZobacz Marker3DElement.position. |
sizePreserved
opcjonalne |
Typ:
boolean optionalZobacz Marker3DElement.sizePreserved. |
zIndex
opcjonalne |
Typ:
number optionalZobacz Marker3DElement.zIndex. |
Marker3DInteractiveElement class
google.maps.maps3d.Marker3DInteractiveElement
class
extends Marker3DElement
implements Marker3DInteractiveElementOptions
library "maps3d"
Pokazuje pozycję na mapie 3D. Pamiętaj, że aby wyświetlać Marker3DInteractiveElement, musisz ustawić position. W przeciwieństwie do Marker3DElement Marker3DInteractiveElement otrzymuje zdarzenie gmp-click.
<gmp-marker-3d-interactive gmp-popover-target-element="popover-id" title="string"> </gmp-marker-3d-interactive>
const {Marker3DInteractiveElement} = await google.maps.importLibrary("maps3d");
Zespół | |
|---|---|
Marker3DInteractiveElement |
Marker3DInteractiveElement([options])Parametry:
Tworzy Marker3DInteractiveElement z określonymi opcjami. |
Właściwości | |
|---|---|
gmpPopoverTargetElement
attr: gmp-popover-target-element |
Po ustawieniu element wyskakujący będzie otwierany po kliknięciu tego znacznika.
Atrybut HTML: gmp-popover-target-element="popover-id" |
title
attr: title |
Typ:
stringTekst po najechaniu kursorem. Jeśli podasz tekst ułatwień dostępu (np. do użycia z czytnikami ekranu), zostanie on dodany do elementu
Marker3DInteractiveElement z podaną wartością.Atrybut HTML: title="string" |
Dziedziczone:
altitudeMode (atrybut: altitude-mode),
(atrybut: autofits-camera),
collisionBehavior (atrybut: collision-behavior),
collisionPriority (atrybut: collision-priority),
drawsWhenOccluded (atrybut: draws-when-occluded),
extruded (atrybut: extruded),
label (atrybut: label),
position (atrybut: position),
sizePreserved (atrybut: size-preserved),
zIndex (atrybut: z-index)
| |
Przedziały | |
|---|---|
default |
Wszystkie elementy niestandardowe dodane bezpośrednio do elementu Marker3DInteractiveElement zostaną umieszczone w odpowiednich miejscach, ale do rysowania znaczników będą używane tylko elementy typu PinElement. Inne elementy zostaną zignorowane. |
Metody | |
|---|---|
Dziedziczone:
addEventListener,
removeEventListener
|
Wydarzenia | |
|---|---|
gmp-click |
function(clickEvent)Argumenty:
To zdarzenie jest wywoływane po kliknięciu elementu Marker3DInteractiveElement. |
Marker3DInteractiveElementOptions interface
google.maps.maps3d.Marker3DInteractiveElementOptions
interface
extends Marker3DElementOptions
Obiekt Marker3DInteractiveElementOptions służący do definiowania właściwości, które można ustawić w Marker3DInteractiveElement.
Właściwości | |
|---|---|
gmpPopoverTargetElement
opcjonalne |
Typ:
PopoverElement optional |
title
opcjonalne |
Typ:
string optionalZobacz Marker3DInteractiveElement.title. |
Dziedziczone:
altitudeMode,
,
collisionBehavior,
collisionPriority,
drawsWhenOccluded,
extruded,
label,
position,
sizePreserved,
zIndex
| |
Klasa Model3DElement
google.maps.maps3d.Model3DElement
class
extends HTMLElement
implements Model3DElementOptions
library "maps3d"
Model 3D, który umożliwia renderowanie modeli gLTF. Pamiętaj, że aby wyświetlać Model3DElement, musisz ustawić position i src.
Podstawowe właściwości gLTF PBR powinny być obsługiwane. Obecnie nie są obsługiwane żadne rozszerzenia ani właściwości rozszerzeń.
<gmp-model-3d altitude-mode="value-name" orientation="heading,tilt,roll" position="lat,lng" scale="number" src="url"> </gmp-model-3d>
const {Model3DElement} = await google.maps.importLibrary("maps3d");
Zespół | |
|---|---|
Model3DElement |
Model3DElement([options])Parametry:
Tworzy Model3DElement z określonymi opcjami. |
Właściwości | |
|---|---|
altitudeMode
attr: altitude-mode |
Domyślnie:
AltitudeMode.CLAMP_TO_GROUNDOkreśla sposób interpretowania wysokości w pozycji.
Atrybut HTML: altitude-mode="value-name" |
orientation
attr: orientation |
Typ danych wejściowych:
Orientation3D|Orientation3DLiteral optionalTyp danych wyjściowych: Orientation3D optionalOpisuje obrót układu współrzędnych modelu 3D w celu umieszczenia go na mapie 3D.
Obrót jest stosowany do modelu w następującej kolejności: przechył, nachylenie, a następnie kierunek. Atrybut HTML: orientation="heading,tilt,roll" |
position
attr: position |
Typ danych wejściowych:
LatLngLiteral|LatLngAltitude|LatLngAltitudeLiteral optionalTyp danych wyjściowych: LatLngAltitude optionalUstawia pozycję elementu
Model3DElement. Wysokość jest ignorowana w niektórych trybach, dlatego jest opcjonalna.Atrybut HTML:
|
scale
attr: scale |
Typ danych wejściowych:
number|Vector3D|Vector3DLiteral optionalTyp danych wyjściowych: Vector3D optionalDomyślnie:
1Skaluje model wzdłuż osi X, Y i Z w przestrzeni współrzędnych modelu.
Atrybut HTML:
|
src
attr: src |
Określa adres URL modelu 3D. Obecnie obsługiwane są tylko modele w formacie
.glb. Wszystkie względne adresy URL HTTP zostaną przekształcone w odpowiadające im bezwzględne adresy URL. Pamiętaj, że jeśli pliki modelu .glb przechowujesz w innej witrynie lub na innym serwerze niż główna aplikacja, musisz skonfigurować prawidłowe nagłówki HTTP CORS. Umożliwia to aplikacji bezpieczny dostęp do plików modelu z innej domeny.Atrybut HTML: src="url" |
Metody | |
|---|---|
Dziedziczone:
addEventListener,
removeEventListener
|
Interfejs Model3DElementOptions
Interfejs
google.maps.maps3d.Model3DElementOptions
Obiekt Model3DElementOptions służący do definiowania właściwości, które można ustawić w obiekcie Model3DElement.
Właściwości | |
|---|---|
altitudeMode
opcjonalne |
Typ:
AltitudeMode optionalZobacz Model3DElement.altitudeMode. |
orientation
opcjonalne |
Typ:
Orientation3D|Orientation3DLiteral optionalZobacz Model3DElement.orientation. |
position
opcjonalne |
Typ:
LatLngLiteral|LatLngAltitude|LatLngAltitudeLiteral optionalZobacz Model3DElement.position. |
scale
opcjonalne |
Typ:
number|Vector3D|Vector3DLiteral optionalZobacz Model3DElement.scale. |
src
opcjonalne |
Typ:
string|URL optionalZobacz Model3DElement.src. |
Klasa Model3DInteractiveElement
google.maps.maps3d.Model3DInteractiveElement
class
extends Model3DElement
implements Model3DInteractiveElementOptions
library "maps3d"
Model 3D, który umożliwia renderowanie modeli gLTF. Pamiętaj, że aby wyświetlać Model3DElement, musisz ustawić position i src.
Podstawowe właściwości gLTF PBR powinny być obsługiwane. Obecnie nie są obsługiwane żadne rozszerzenia ani właściwości rozszerzeń.
W odróżnieniu od Model3DElement, Model3DInteractiveElement otrzymuje zdarzenie gmp-click.
<gmp-model-3d-interactive></gmp-model-3d-interactive>
const {Model3DInteractiveElement} = await google.maps.importLibrary("maps3d");
Zespół | |
|---|---|
Model3DInteractiveElement |
Model3DInteractiveElement([options])Parametry:
Tworzy Model3DInteractiveElement z określonymi opcjami. |
Właściwości | |
|---|---|
Dziedziczone:
altitudeMode (atrybut: altitude-mode),
orientation (atrybut: orientation),
position (atrybut: position),
scale (atrybut: scale),
src (atrybut: src)
|
Metody | |
|---|---|
Dziedziczone:
addEventListener,
removeEventListener
|
Wydarzenia | |
|---|---|
gmp-click |
function(clickEvent)Argumenty:
To zdarzenie jest wywoływane po kliknięciu elementu Model3DInteractiveElement. |
Interfejs Model3DInteractiveElementOptions
google.maps.maps3d.Model3DInteractiveElementOptions
interface
extends Model3DElementOptions
Obiekt Model3DInteractiveElementOptions służący do definiowania właściwości, które można ustawić w obiekcie Model3DInteractiveElement.
Właściwości | |
|---|---|
Dziedziczone:
altitudeMode,
orientation,
position,
scale,
src
|
Polyline3DElement
google.maps.maps3d.Polyline3DElement
class
extends HTMLElement
implements Polyline3DElementOptions
library "maps3d"
Linia łamana 3D to liniowa nakładka połączonych segmentów linii na mapie 3D.
<gmp-polyline-3d altitude-mode="value-name" autofits-camera draws-occluded-segments extruded geodesic outer-color="string" outer-width="number" path="lat1,lng1,altitude1 lat2,lng2,altitude2 lat3,lng3,altitude3 ..." stroke-color="string" stroke-width="number" z-index="number"> </gmp-polyline-3d>
const {Polyline3DElement} = await google.maps.importLibrary("maps3d");
Zespół | |
|---|---|
Polyline3DElement |
Polyline3DElement([options])Parametry:
Tworzy Polyline3DElement z określonymi opcjami. |
Właściwości | |
|---|---|
altitudeMode
attr: altitude-mode |
Domyślnie:
AltitudeMode.CLAMP_TO_GROUNDOkreśla sposób interpretowania komponentów wysokości we współrzędnych.
Atrybut HTML: altitude-mode="value-name" |
attr: autofits-camera |
Typ danych wejściowych:
boolean optionalTyp danych wyjściowych: booleanDomyślnie:
falseJeśli podasz tę wartość, określona linia łamana będzie widoczna w widocznym obszarze mapy wraz z innymi elementami, które wyraziły zgodę.
Atrybut HTML: autofits-camera |
drawsOccludedSegments
attr: draws-occluded-segments |
Typ danych wejściowych:
boolean optionalTyp danych wyjściowych: booleanDomyślnie:
falseOkreśla, czy części linii łamanej, które mogą być zasłonięte, są rysowane. Polilinie mogą być zasłonięte przez geometrię mapy (np. budynki).
Atrybut HTML: draws-occluded-segments |
extruded
attr: extruded |
Typ danych wejściowych:
boolean optionalTyp danych wyjściowych: booleanDomyślnie:
falseOkreśla, czy połączyć polilinię z podłożem. Aby wyciągnąć linię łamaną,
altitudeMode musi mieć wartość RELATIVE_TO_GROUND lub ABSOLUTE.Atrybut HTML: extruded |
geodesic
attr: geodesic |
Typ danych wejściowych:
boolean optionalTyp danych wyjściowych: booleanDomyślnie:
falseGdy parametr ma wartość
true, krawędzie linii łamanej są interpretowane jako geodezyjne i będą podążać za krzywizną Ziemi. Jeśli wartość to false, krawędzie linii łamanej są renderowane jako linie proste w przestrzeni ekranu.Atrybut HTML: geodesic |
outerColor
attr: outer-color |
Typ danych wejściowych:
string optionalTyp danych wyjściowych: string optionalKolor zewnętrzny. Obsługiwane są wszystkie kolory CSS3.
Atrybut HTML: outer-color="string" |
outerWidth
attr: outer-width |
Typ danych wejściowych:
number optionalTyp danych wyjściowych: number optionalSzerokość zewnętrzna wynosi od
0.0 do 1.0. Jest to procentowa wartość strokeWidth.Atrybut HTML: outer-width="number" |
path
attr: path |
Typ danych wejściowych:
Iterable<LatLngAltitude|LatLngAltitudeLiteral|LatLngLiteral> optionalTyp danych wyjściowych: Array<LatLngAltitude> optionalUporządkowana sekwencja współrzędnych linii łamanej. Wysokość jest ignorowana w niektórych trybach, dlatego jest opcjonalna.
Atrybut HTML: path="lat1,lng1,altitude1 lat2,lng2,altitude2 lat3,lng3,altitude3 ..." |
strokeColor
attr: stroke-color |
Typ danych wejściowych:
string optionalTyp danych wyjściowych: string optionalKolor konturu. Obsługiwane są wszystkie kolory CSS3.
Atrybut HTML: stroke-color="string" |
strokeWidth
attr: stroke-width |
Typ danych wejściowych:
number optionalTyp danych wyjściowych: number optionalSzerokość obrysu w pikselach.
Atrybut HTML: stroke-width="number" |
zIndex
attr: z-index |
Typ danych wejściowych:
number optionalTyp danych wyjściowych: number optionalWartość zIndex w porównaniu z innymi wielokątami.
Atrybut HTML: z-index="number" |
|
Typ:
Iterable<LatLngAltitude|LatLngAltitudeLiteral|LatLngLiteral> optionalUporządkowana sekwencja współrzędnych linii łamanej. Wysokość jest ignorowana w niektórych trybach, dlatego jest opcjonalna. |
Metody | |
|---|---|
Dziedziczone:
addEventListener,
removeEventListener
|
Polyline3DElementOptions interface
Interfejs
google.maps.maps3d.Polyline3DElementOptions
Obiekt Polyline3DElementOptions służący do definiowania właściwości, które można ustawić w obiekcie Polyline3DElement.
Klasa Polyline3DInteractiveElement
google.maps.maps3d.Polyline3DInteractiveElement
class
extends Polyline3DElement
implements Polyline3DInteractiveElementOptions
library "maps3d"
Linia łamana 3D to liniowa nakładka połączonych segmentów linii na mapie 3D. W przeciwieństwie do Polyline3DElement Polyline3DInteractiveElement otrzymuje zdarzenie gmp-click.
<gmp-polyline-3d-interactive></gmp-polyline-3d-interactive>
const {Polyline3DInteractiveElement} = await google.maps.importLibrary("maps3d");
Zespół | |
|---|---|
Polyline3DInteractiveElement |
Polyline3DInteractiveElement([options])Parametry:
Tworzy Polyline3DInteractiveElement z określonymi opcjami. |
Właściwości | |
|---|---|
Dziedziczone:
altitudeMode (atrybut: altitude-mode),
(atrybut: autofits-camera),
drawsOccludedSegments (atrybut: draws-occluded-segments),
extruded (atrybut: extruded),
geodesic (atrybut: geodesic),
outerColor (atrybut: outer-color),
outerWidth (atrybut: outer-width),
path (atrybut: path),
strokeColor (atrybut: stroke-color),
strokeWidth (atrybut: stroke-width),
zIndex (atrybut: z-index),
|
Metody | |
|---|---|
Dziedziczone:
addEventListener,
removeEventListener
|
Wydarzenia | |
|---|---|
gmp-click |
function(clickEvent)Argumenty:
To zdarzenie jest wywoływane po kliknięciu elementu Polyline3DInteractiveElement. |
Interfejs Polyline3DInteractiveElementOptions
google.maps.maps3d.Polyline3DInteractiveElementOptions
interface
extends Polyline3DElementOptions
Obiekt Polyline3DInteractiveElementOptions służący do definiowania właściwości, które można ustawić w obiekcie Polyline3DInteractiveElement.
Właściwości | |
|---|---|
Dziedziczone:
altitudeMode,
,
coordinates,
drawsOccludedSegments,
extruded,
geodesic,
outerColor,
outerWidth,
path,
strokeColor,
strokeWidth,
zIndex
|
Klasa Polygon3DElement
google.maps.maps3d.Polygon3DElement
class
extends HTMLElement
implements Polygon3DElementOptions
library "maps3d"
Wielokąt 3D (podobnie jak linia łamana 3D) definiuje serię połączonych współrzędnych w uporządkowanej sekwencji. Dodatkowo wielokąty tworzą zamkniętą pętlę i definiują wypełniony region.
<gmp-polygon-3d autofits-camera draws-occluded-segments extruded fill-color="string" geodesic path="lat1,lng1,altitude1 lat2,lng2,altitude2 lat3,lng3,altitude3 ..." stroke-color="string" stroke-width="number" z-index="number"> </gmp-polygon-3d>
const {Polygon3DElement} = await google.maps.importLibrary("maps3d");
Zespół | |
|---|---|
Polygon3DElement |
Polygon3DElement([options])Parametry:
Tworzy Polygon3DElement z określonymi opcjami. |
Właściwości | |
|---|---|
altitudeMode |
Domyślnie:
AltitudeMode.CLAMP_TO_GROUNDOkreśla sposób interpretowania komponentów wysokości we współrzędnych. |
attr: autofits-camera |
Typ danych wejściowych:
boolean optionalTyp danych wyjściowych: booleanDomyślnie:
falseJeśli podasz wielokąt, będzie on widoczny w widocznym obszarze mapy wraz z innymi elementami, które wyraziły zgodę.
Atrybut HTML: autofits-camera |
drawsOccludedSegments
attr: draws-occluded-segments |
Typ danych wejściowych:
boolean optionalTyp danych wyjściowych: booleanDomyślnie:
falseOkreśla, czy części wielokąta, które mogą być zasłonięte, są rysowane. Wielokąty mogą być zasłonięte przez geometrię mapy (np. budynki).
Atrybut HTML: draws-occluded-segments |
extruded
attr: extruded |
Typ danych wejściowych:
boolean optionalTyp danych wyjściowych: booleanDomyślnie:
falseOkreśla, czy połączyć wielokąt z gruntem. Aby wyciągnąć wielokąt,
altitudeMode musi mieć wartość RELATIVE_TO_GROUND lub ABSOLUTE.Atrybut HTML: extruded |
fillColor
attr: fill-color |
Typ danych wejściowych:
string optionalTyp danych wyjściowych: string optionalKolor wypełnienia. Obsługiwane są wszystkie kolory CSS3.
Atrybut HTML: fill-color="string" |
geodesic
attr: geodesic |
Typ danych wejściowych:
boolean optionalTyp danych wyjściowych: booleanDomyślnie:
falseGdy parametr ma wartość
true, krawędzie wielokąta są interpretowane jako geodezyjne i będą podążać za krzywizną Ziemi. Gdy wartość wynosi false, krawędzie wielokąta są renderowane jako linie proste w przestrzeni ekranu.Atrybut HTML: geodesic |
innerPaths |
Typ danych wejściowych:
Iterable<Iterable<LatLngAltitude|LatLngAltitudeLiteral|LatLngLiteral>> optionalTyp danych wyjściowych: Array<Array<LatLngAltitude>> optionalUporządkowana sekwencja współrzędnych, która wyznacza zamkniętą pętlę. W przeciwieństwie do linii łamanych wielokąt może składać się z co najmniej jednej ścieżki, która tworzy wiele wycięć wewnątrz wielokąta. |
path
attr: path |
Typ danych wejściowych:
Iterable<LatLngAltitude|LatLngAltitudeLiteral|LatLngLiteral> optionalTyp danych wyjściowych: Array<LatLngAltitude> optionalUporządkowana sekwencja współrzędnych, która wyznacza zamkniętą pętlę. Wysokość jest ignorowana w niektórych trybach, dlatego jest opcjonalna.
Atrybut HTML: path="lat1,lng1,altitude1 lat2,lng2,altitude2 lat3,lng3,altitude3 ..." |
strokeColor
attr: stroke-color |
Typ danych wejściowych:
string optionalTyp danych wyjściowych: string optionalKolor konturu. Obsługiwane są wszystkie kolory CSS3.
Atrybut HTML: stroke-color="string" |
strokeWidth
attr: stroke-width |
Typ danych wejściowych:
number optionalTyp danych wyjściowych: number optionalSzerokość obrysu w pikselach.
Atrybut HTML: stroke-width="number" |
zIndex
attr: z-index |
Typ danych wejściowych:
number optionalTyp danych wyjściowych: number optionalWartość zIndex w porównaniu z innymi wielokątami.
Atrybut HTML: z-index="number" |
|
Typ:
Iterable<LatLngAltitude|LatLngAltitudeLiteral|LatLngLiteral> optionalUporządkowana sekwencja współrzędnych, która wyznacza zamkniętą pętlę. Wysokość jest ignorowana w niektórych trybach, dlatego jest opcjonalna. |
|
Typ:
Iterable<Iterable<LatLngAltitude|LatLngAltitudeLiteral|LatLngLiteral>> optionalUporządkowana sekwencja współrzędnych, która wyznacza zamkniętą pętlę. W przeciwieństwie do linii łamanych wielokąt może składać się z co najmniej jednej ścieżki, która tworzy wiele wycięć wewnątrz wielokąta. |
Metody | |
|---|---|
Dziedziczone:
addEventListener,
removeEventListener
|
Interfejs Polygon3DElementOptions
Interfejs
google.maps.maps3d.Polygon3DElementOptions
Obiekt Polygon3DElementOptions służący do definiowania właściwości, które można ustawić w Polygon3DElement.
Klasa Polygon3DInteractiveElement
google.maps.maps3d.Polygon3DInteractiveElement
class
extends Polygon3DElement
implements Polygon3DInteractiveElementOptions
library "maps3d"
Wielokąt 3D (podobnie jak linia łamana 3D) definiuje serię połączonych współrzędnych w uporządkowanej sekwencji. Dodatkowo wielokąty tworzą zamkniętą pętlę i definiują wypełniony region. W przeciwieństwie do Polygon3DElement Polygon3DInteractiveElement otrzymuje zdarzenie gmp-click.
<gmp-polygon-3d-interactive></gmp-polygon-3d-interactive>
const {Polygon3DInteractiveElement} = await google.maps.importLibrary("maps3d");
Zespół | |
|---|---|
Polygon3DInteractiveElement |
Polygon3DInteractiveElement([options])Parametry:
Tworzy Polygon3DInteractiveElement z określonymi opcjami. |
Właściwości | |
|---|---|
Dziedziczone:
altitudeMode,
(atrybut: autofits-camera),
drawsOccludedSegments (atrybut: draws-occluded-segments),
extruded (atrybut: extruded),
fillColor (atrybut: fill-color),
geodesic (atrybut: geodesic),
innerPaths,
path (atrybut: path),
strokeColor (atrybut: stroke-color),
strokeWidth (atrybut: stroke-width),
zIndex (atrybut: z-index),
,
|
Metody | |
|---|---|
Dziedziczone:
addEventListener,
removeEventListener
|
Wydarzenia | |
|---|---|
gmp-click |
function(clickEvent)Argumenty:
To zdarzenie jest wywoływane po kliknięciu elementu Polygon3DInteractiveElement. |
Polygon3DInteractiveElementOptions interface
google.maps.maps3d.Polygon3DInteractiveElementOptions
interface
extends Polygon3DElementOptions
Obiekt Polygon3DInteractiveElementOptions służący do definiowania właściwości, które można ustawić w przypadku elementu Polygon3DInteractiveElement.
Właściwości | |
|---|---|
Dziedziczone:
altitudeMode,
,
drawsOccludedSegments,
extruded,
fillColor,
geodesic,
innerCoordinates,
innerPaths,
outerCoordinates,
path,
strokeColor,
strokeWidth,
zIndex
|
Klasa FlattenerElement
google.maps.maps3d.FlattenerElement
class
extends HTMLElement
implements FlattenerElementOptions
library "maps3d"
Element wyrównujący służy do wyrównywania określonego obszaru na mapie.
<gmp-flattener path="lat1,lng1,altitude1 lat2,lng2,altitude2 lat3,lng3,altitude3 ..."> </gmp-flattener>
const {FlattenerElement} = await google.maps.importLibrary("maps3d");
Zespół | |
|---|---|
FlattenerElement |
FlattenerElement([options])Parametry:
|
Właściwości | |
|---|---|
innerPaths |
Typ danych wejściowych:
Iterable<Iterable<LatLngAltitude|LatLngAltitudeLiteral|LatLngLiteral>> optionalTyp danych wyjściowych: Array<Array<LatLngAltitude>> optionalUporządkowana sekwencja współrzędnych, która wyznacza zamkniętą pętlę. Te ścieżki definiują otwory wykluczenia w głównej ścieżce wielokąta, czyli w strefie spłaszczania. Obszary w obrębie ścieżki innerPath są wyłączone ze spłaszczania. |
path
attr: path |
Typ danych wejściowych:
Iterable<LatLngAltitude|LatLngAltitudeLiteral|LatLngLiteral> optionalTyp danych wyjściowych: Array<LatLngAltitude> optionalUporządkowana sekwencja współrzędnych, która wyznacza zamkniętą pętlę. Ta pętla definiuje strefę spłaszczania.
Atrybut HTML: path="lat1,lng1,altitude1 lat2,lng2,altitude2 lat3,lng3,altitude3 ..." |
Metody | |
|---|---|
Dziedziczone:
addEventListener,
removeEventListener
|
Interfejs FlattenerElementOptions
Interfejs
google.maps.maps3d.FlattenerElementOptions
Obiekt FlattenerElementOptions służący do definiowania właściwości, które można ustawić w obiekcie FlattenerElement.
Właściwości | |
|---|---|
innerPaths
opcjonalne |
Typ:
Iterable<Iterable<LatLngAltitude|LatLngAltitudeLiteral|LatLngLiteral>> optionalZobacz FlattenerElement.innerPaths. |
path
opcjonalne |
Typ:
Iterable<LatLngAltitude|LatLngAltitudeLiteral|LatLngLiteral> optionalZobacz FlattenerElement.path. |
Klasa PopoverElement
google.maps.maps3d.PopoverElement
class
extends HTMLElement
implements PopoverElementOptions
library "maps3d"
Niestandardowy element HTML, który renderuje wyskakujące okienko. Wygląda jak dymek i często jest połączone ze znacznikiem.
<gmp-popover auto-pan-disabled light-dismiss-disabled open position-anchor="lat,lng"> </gmp-popover>
const {PopoverElement} = await google.maps.importLibrary("maps3d");
Zespół | |
|---|---|
PopoverElement |
PopoverElement([options])Parametry:
|
Właściwości | |
|---|---|
altitudeMode |
Domyślnie:
AltitudeMode.CLAMP_TO_GROUNDOkreśla sposób interpretowania wysokości nad poziomem morza. |
autoPanDisabled
attr: auto-pan-disabled |
Typ danych wejściowych:
boolean optionalTyp danych wyjściowych: booleanDomyślnie:
falseJeśli ma wartość „true”, wyłącza przesuwanie mapy, aby po otwarciu wyskakujące okienko było w pełni widoczne.
Atrybut HTML: auto-pan-disabled |
lightDismissDisabled
attr: light-dismiss-disabled |
Typ danych wejściowych:
boolean optionalTyp danych wyjściowych: booleanDomyślnie:
falseOkreśla, czy ten element popover powinien być „lekko odrzucony”. Działanie „lekkiego odrzucenia” jest podobne do ustawienia atrybutu
popover="auto", który jest częścią interfejsu Popover API przeglądarki.Atrybut HTML: light-dismiss-disabled |
open
attr: open |
Typ danych wejściowych:
boolean optionalTyp danych wyjściowych: booleanDomyślnie:
falseOkreśla, czy to wyskakujące okienko powinno być otwarte.
Atrybut HTML: open |
positionAnchor
attr: position-anchor |
Typ danych wejściowych:
LatLngLiteral|LatLngAltitudeLiteral|Marker3DInteractiveElement|MarkerInteractiveElement|string optionalTyp danych wyjściowych: LatLngAltitude|Marker3DInteractiveElement|MarkerInteractiveElement optionalPozycja, na której ma się wyświetlać to wyskakujące okienko. Jeśli okienko jest zakotwiczone w interaktywnym znaczniku, zostanie użyta pozycja znacznika.
Atrybut HTML:
|
Przedziały | |
|---|---|
default |
Umieszcza zawartość w głównej sekcji wyskakującego okienka. |
header |
Umieszcza zawartość w sekcji nagłówka wyskakującego okienka. |
Właściwości CSS | |
|---|---|
--gmp-popover-max-width |
Maksymalna szerokość wyskakującego okienka, niezależnie od szerokości treści. |
--gmp-popover-min-width |
Minimalna szerokość wyskakującego okienka, niezależnie od szerokości treści. Jeśli używasz tej właściwości, zdecydowanie zalecamy ustawienie jej wartości na mniejszą niż szerokość mapy (w pikselach). |
--gmp-popover-pixel-offset-x |
Przesunięcie na osi X (w pikselach) końcówki wyskakującego okienka względem punktu na mapie, do którego współrzędnych geograficznych jest ono zakotwiczone. |
--gmp-popover-pixel-offset-y |
Przesunięcie na osi Y (w pikselach) końcówki wyskakującego okienka względem punktu na mapie, w którego współrzędnych geograficznych jest zakotwiczone okienko. |
background-color |
Kolor tła wyskakującego okienka. Więcej informacji znajdziesz w background-color dokumentacji. Pamiętaj, że ta właściwość ma też wpływ na domyślne wyskakujące okienko miejsca. Aby uniknąć stylizowania domyślnego wyskakującego okienka miejsca, użyj ukierunkowanych klas CSS lub stylów wbudowanych w niestandardowych wyskakujących okienkach. |
border-radius |
Promień obramowania wyskakującego okienka. Więcej informacji znajdziesz w border-radius dokumentacji. Pamiętaj, że ta właściwość ma też wpływ na domyślne wyskakujące okienko miejsca. Aby uniknąć stylizowania domyślnego wyskakującego okienka miejsca, użyj ukierunkowanych klas CSS lub stylów wbudowanych w niestandardowych wyskakujących okienkach. |
box-shadow |
Cień ramki wyskakującego okienka. Więcej informacji znajdziesz w box-shadow dokumentacji. Pamiętaj, że ta właściwość ma też wpływ na domyślne wyskakujące okienko miejsca. Aby uniknąć stylizowania domyślnego wyskakującego okienka miejsca, użyj ukierunkowanych klas CSS lub stylów wbudowanych w niestandardowych wyskakujących okienkach. |
color-scheme |
Wskazuje, w jakim schemacie kolorów może być renderowane to wyskakujące okienko. Więcej informacji znajdziesz w color-scheme dokumentacji. Jeśli nie zostanie określony, domyślnie używane są preferencje schematu kolorów użytkownika. |
padding |
Odstęp wyskakującego okienka. Więcej informacji znajdziesz w padding dokumentacji. Pamiętaj, że ta właściwość ma też wpływ na domyślne wyskakujące okienko miejsca. Aby uniknąć stylizowania domyślnego wyskakującego okienka miejsca, użyj ukierunkowanych klas CSS lub stylów wbudowanych w niestandardowych wyskakujących okienkach. |
Metody | |
|---|---|
Dziedziczone:
addEventListener,
removeEventListener
|
Interfejs PopoverElementOptions
Interfejs
google.maps.maps3d.PopoverElementOptions
Obiekt PopoverElementOptions służący do definiowania właściwości, które można ustawić w obiekcie PopoverElement.
Właściwości | |
|---|---|
altitudeMode
opcjonalne |
Typ:
AltitudeMode optionalZobacz PopoverElement.altitudeMode. |
autoPanDisabled
opcjonalne |
Typ:
boolean optionalZobacz PopoverElement.autoPanDisabled. |
lightDismissDisabled
opcjonalne |
Typ:
boolean optional |
open
opcjonalne |
Typ:
boolean optionalZobacz PopoverElement.open. |
positionAnchor
opcjonalne |
Typ:
LatLngLiteral|LatLngAltitudeLiteral|string|Marker3DInteractiveElement|MarkerInteractiveElement optionalZobacz PopoverElement.positionAnchor. |
Stałe AltitudeMode
google.maps.maps3d.AltitudeMode
stałe
biblioteka "maps3d"
Określa sposób interpretowania komponentów wysokości we współrzędnych.
Te stałe mogą być też używane jako ciągi znaków. W języku TypeScript literały ciągów znaków są definiowane przez typ AltitudeModeString.
const {AltitudeMode} = await google.maps.importLibrary("maps3d");
Stałe | |
|---|---|
ABSOLUTE |
Umożliwia wyrażanie obiektów względem średniego poziomu morza. Oznacza to również, że jeśli poziom szczegółowości terenu pod obiektem ulegnie zmianie, jego bezwzględna pozycja pozostanie taka sama. |
CLAMP_TO_GROUND |
Umożliwia wyrażanie obiektów umieszczonych na ziemi. Pozostaną na poziomie gruntu, podążając za ukształtowaniem terenu, niezależnie od podanej wysokości. Jeśli obiekt znajduje się nad dużym zbiornikiem wodnym, zostanie umieszczony na poziomie morza. |
RELATIVE_TO_GROUND |
Umożliwia wyrażanie obiektów względem powierzchni gruntu. Jeśli poziom szczegółowości terenu ulegnie zmianie, pozycja obiektu względem podłoża pozostanie niezmieniona. Nad wodą wysokość będzie interpretowana jako wartość w metrach nad poziomem morza. |
RELATIVE_TO_MESH |
Umożliwia wyrażanie obiektów względem najwyższego punktu gruntu, budynku lub powierzchni wody. Nad wodą będzie to powierzchnia wody, a nad terenem – powierzchnia budynku (jeśli występuje) lub powierzchnia gruntu (jeśli nie ma budynków). |
Klasa CirclePathElement
google.maps.maps3d.CirclePathElement
class
extends HTMLElement
implements CirclePathElementOptions
library "maps3d"
Nakładka z okręgiem 3D na mapie 3D.
<gmp-circle-path center="lat,lng,altitude" radius="number"> </gmp-circle-path>
const {CirclePathElement} = await google.maps.importLibrary("maps3d");
Zespół | |
|---|---|
CirclePathElement |
CirclePathElement([options])Parametry:
Tworzy CirclePathElement z określonymi opcjami. |
Właściwości | |
|---|---|
center
attr: center |
Typ danych wejściowych:
LatLngAltitude|LatLngAltitudeLiteral|LatLngLiteral optionalTyp danych wyjściowych: LatLngAltitude optionalśrodek okręgu,
Atrybut HTML: center="lat,lng,altitude" |
radius
attr: radius |
Typ danych wejściowych:
number optionalTyp danych wyjściowych: number optionalPromień okręgu w metrach.
Atrybut HTML: radius="number" |
Metody | |
|---|---|
Dziedziczone:
addEventListener,
removeEventListener
|
CirclePathElementOptions interface
Interfejs
google.maps.maps3d.CirclePathElementOptions
Obiekt CirclePathElementOptions służący do definiowania właściwości, które można ustawić w obiekcie CirclePathElement.
Właściwości | |
|---|---|
center
opcjonalne |
Typ:
LatLngAltitude|LatLngAltitudeLiteral|LatLngLiteral optionalZobacz CirclePathElement.center. |
radius
opcjonalne |
Typ:
number optionalZobacz CirclePathElement.radius. |