The fourth feature is about placing markers on the map for the selected addresses. To implement this feature, we will:
Update the
address
model to hold the markerCreate a method to place a marker on the map
Create a method to remove an existing marker
Register subscribers to trigger removal of the existing markers when an address changes
Update the module to add a marker to the map
Let's get started by updating the address
model. Open the MapsApplication
module and locate the
AddressModel
variable. Add an observable to this model to hold the marker:
/* generic model for address */
var AddressModel = function() {
this.marker = ko.observable();
this.location = ko.observable();
this.streetNumber = ko.observable();
this.streetName = ko.observable();
this.city = ko.observable();
this.state = ko.observable();
this.postCode = ko.observable();
this.country = ko.observable();
};
Next, we will create a method that will create and place the marker on the map. This...