demand-web-components v1.19.5
a
Demand-Web-Components
A component that displays Here Maps, using Stencil.
Getting Started
npm i demand-web-components
Setup after installation depends on which framework you are using. See link below: https://stenciljs.com/docs/overview
Testing
In browser:
In one terminal run npm start
In another run npm run storybook
Then in the browser open localhost:3000
Unit tests
npm run test
Sample Usage (embedding)
Get an api key, app id and app code from: https://developer.here.com/products/maps
<hm-map-component class="map"
api_key="MY_API_KEY_NY_HERE_MAPS_API"
app_id="MY_APP_ID_NY_HERE_MAPS_API"
app_code="MY_APP_CODE_NY_HERE_MAPS_API"
></hm-map-component>
API:
Inputs
api_key:
Type string
, Mandatory. This is used for the HERE MAPS API for JavaScript.
app_id:
Type string
, Mandatory. This is used for the HERE Location Services.
app_code:
Type string
, Mandatory. This is used for the HERE Location Services.
markers:
Type Marker
, Optional. See below for more details.
routes:
Type Route
, Optional. See below for more details.
zoom:
Type 'PICKUP' | 'DESTINATION' | 'CONFIRMED_PICKUP' | 'ALL'
, Optional.
zoom_level:
Type number
, between 1 and 20. Optional.
locale:
Type 'de-DE' | 'en-GB' | 'en-US' | 'es-ES' | 'fi-FI' | 'fr-FR' | 'it-IT' | 'nl-NL' | 'pl-PL' | 'pt-BR' | 'pt-PT' | 'ru-RU' | 'tr-TR' | 'zh-CN'
, Optional.
map_style:
Type object
, Optional. See below for more details.
center:
Type Point ({lat: number, lng: number})
, Optional. See below for more details.
Types:
Marker
type:
Type 'PICKUP' | 'DESTINATION'
, Mandatory.
location:
Type Location
, Mandatory. See below for more details.
tooltip_text:
Type string
, Optional. Will show a bubble info.
tooltip_icon:
Type 'PICKUP' | 'DESTINATION' | 'TAXI' | 'HIGH_SPEED_TRAIN' | 'INTERCITY_TRAIN' | 'INTER_REGIONAL_TRAIN' | 'CITY_TRAIN' | 'BUS' | 'FERRY' | 'SUBWAY' | 'LIGHT_RAIL' | 'PRIVATE_BUS' | 'INCLINED' | 'AERIAL' | 'BUS_RAPID' | 'MONORAIL' | 'WALK' | 'BIKE'
, Optional.
Route
type:
Type 'TAXI' | 'HIGH_SPEED_TRAIN' | 'INTERCITY_TRAIN' | 'INTER_REGIONAL_TRAIN' | 'CITY_TRAIN' | 'BUS' | 'FERRY' | 'SUBWAY' | 'LIGHT_RAIL' | 'PRIVATE_BUS' | 'INCLINED' | 'AERIAL' | 'BUS_RAPID' | 'MONORAIL' | 'WALK' | 'BIKE'
, Optional.
legs:
Type RouteLeg[]
, Mandatory. The list of legs for the route.
faded:
Type boolean
, Optional. If true, will draw the route in gray, and hide the bubble info.
click_callback:
Type: function
, Optional. Will be called on route line click.
RouteLeg:
start:
Type Location
, Mandatory. See below for more details.
end:
Type Location
, Mandatory. See below for more details.
tooltip_text:
Type string
, Optional. Will show a bubble info.
tooltip_position:
Type 'START' | 'MIDDLE' | 'END'
, Optional.
color:
Type string
, Optional. Will display the leg polyline in this color.
Location
point:
Type Point ({lat: number, lng: number})
, Mandatory.
free_text:
Type string
, Optional. Will display the address as a text.
Polygon
vertices:
Type Point [] ([{lat: number, lng: number}])
, Mandatory.
style:
Type object
, Optional. Will define polygon look-and-feel. If not provided default values will be used.
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago