Google map select


Hi, I need a map with ionic charge, so a serious view:

There should be an input selector with 3 unique options, each option has a direction I need to load into the map whenever they are changed.

.controller('rutasRecomendadasCtrl', ['$scope','$ionicPlatform', '$location',
function($scope, $ionicPlatform, $location) {
$scope.whoiswhere = [];
$scope.basel = { lat: 47.55633987116614, lon: 7.576619513223015 };
$ionicPlatform.ready(function() { navigator.geolocation.getCurrentPosition(function(position) {
    var c = position.coords;
    $scope.gotoLocation(c.latitude, c.longitude);
    },function(e) { console.log("Error retrieving position " + e.code + " " + e.message) });
    $scope.gotoLocation = function (lat, lon) {
      if ($ != lat || $scope.lon != lon) {
          $scope.basel = { lat: lat, lon: lon };
          if (!$scope.$$phase) $scope.$apply("basel");

    // some points of interest to show on the map
    // to be user as markers, objects should have "lat", "lon", and "name" properties
    $scope.whoiswhere = [
        { "name": "My Marker", "lat": $, "lon": $scope.basel.lon },

This is the form

<script id="rutas_recomendadas.html" type="text/ng-template">
  <ion-view title="Rutas recomendadas" left-buttons="leftButtons">
          <div class="list list-inset">
        <label class="item item-input">
          <input type="text" placeholder="Nombres">
        <label class="item item-input">
          <input type="text" placeholder="Apellidos">
        <label class="item item-input item-select">
          <div class="input-label">
            <option selected> Masculino</option>
        <button class="button button-block button-positive">
      <app-map style="height:200px;margin:12px;box-shadow:0 3px 25px black;"center="basel"zoom="15"markers="whoiswhere"> 

This code will give you the coordinates to the map, but I need to create 3 static choices. As I can do?