-
Notifications
You must be signed in to change notification settings - Fork 13
Idx Map Widget
Davis edited this page Apr 21, 2021
·
2 revisions
We recommend appending `data-` to any Stratus HTML data attributes to be most compatible with all browsers. e.g.: ng-model='model' could be written as data-ng-model='model'. For shorthand and readability sake, we will omit appending this from data attributes in this informational.
All widgets are actively under heavy development and options/usages are subject to possible changes.
<stratus-idx-map
height="500px"
width="100%"
></stratus-idx-map>
<stratus-idx-map
list-id="idx_property_list_9"
full-height-minus-elements='["#header-container", ".sf-toolbarreset"]'
google-maps-key="XxXxXxXxXxXx"
></stratus-idx-map>
Parameter | Type | Default | Description |
---|---|---|---|
list-id | string | Id of Idx List widget to attach to and render the available collection from. The counterpart List widget's `element-id` must be defined and the same as this `list-id` (See Property List). Multiple Map widgets may attach to the same List widget but, this Map widget may only display a single collection at this time. | |
google-maps-key | string |
Client will need to provide a Google Maps Api key with Javascript access. Without a provided key, the map will default into 'Development Mode' and be known to the user that it's just for testing right now.
See Google Documentation |
|
map-type | string | 'roadmap' |
Set type of tiles displayed on the Map.
Options: 'roadmap', 'hybrid', 'satellite', 'terrain' |
height | string |
Set a height for the displayed map. Suggested to pixel sizes such as `500px`.
If not set, map relies on default css auto loaded. |
|
width | string |
Set a width for the displayed map. Suggested to sizes such as `100%`.
If not set, map relies on default css auto loaded. |
|
full-height | boolean | false | Set the map to retain 100% height of parent element (window/document by default) |
full-height-minus-elements | string[] | Set the map to retain 100% height of parent element (window/document by default). Also removes from itself the height of specified surrounding elements to maintain a proper. E.g.: `["#header-container",]` to have a 100% page height map minus the height of a header and toolbar. | |
reference-parent | string | 'document' | For use with automatic sizing, what element should be referred to when process the full-height of a page. Possible options being `document`, `window`, and any document query selector, e.g. `#body-container` |
zoom | number | 18 | Set the zoom level that the Map starts at. |
zoom-control | boolean | true | Set to display the Zoom controls on the map. |
scrollwheel | boolean | false | Set if the user can adjust the Map zoom level via the mouse scrollwheel. |
marker-click-scroll | boolean | false | Upon clicking a marker, attempt to scroll to the listing on the page. |
marker-click-highlight | boolean | false | Upon clicking a marker, attempt to highlight the lighting on the page momentarily. |
marker-price | boolean | false | Enables Property Prices to be shown on the page atop markers. |
marker-icon | string | Set a default marker icon, providing a url path to the image. | |
marker-icon-hover | string |
Set a default marker icon on mouse hover-over, providing a url path to the image. By default there is none.
This is currently buggy if the mouse is moving too fast. |
|
marker-icon-label-origin-x | number | When supplying a custom icon with a label, sets a position of position of the text, starting left on the x axis | |
marker-icon-label-origin-y | number | When supplying a custom icon with a label, sets a position of position of the text, starting top on the y axis | |
template | string | 'map' |
The file name in which is loaded for the view of the widget. The name will automatically be appended with '.component.min.html'. The default is 'map.component.html'.
TODO: Will need to allow setting a custom path of views outside the library directory. |