Skip to main content

Show your Current Location in Google Maps using ASP.NET C# website and Google Maps API

By




















Descriptions:

  • Add this script tag inside <Head> section "
  • <script type="text/javascript"
  • src="https://maps.googleapis.com/maps/api/js?key=AIzaSyByJmQq7PkPaznZUFsH7AesFNUz82U8iOc&sensor=false">
    •
  • </script>"
    •
  • Inside this Script add your own Key value  [
    • key=AIzaSyByJmQq7PkPaznZUFsH7AesFNUz82U8iOc]  from Google Code https://code.google.com/apis/console/
  • 1. Getting User Location function in Javascript coding
       function success(position) {
        var latitude = position.coords.latitude;
        var longitude = position.coords.longitude;
        var city = position.coords.locality;
        var myLatlng = new google.maps.LatLng(latitude, longitude);
        var myOptions = {
            center: myLatlng,
            zoom: 12,
            mapTypeId: google.maps.MapTypeId.SATELLITE
        };
       
       2. Setting Marker in Google Maps

      var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
        var marker = new google.maps.Marker({
            position: myLatlng,
            title: "lat: " + latitude + " long: " + longitude
        });
        marker.setMap(map);
        var infowindow = new google.maps.InfoWindow({ content: "<b>User Address</b><br/> Latitude:" + latitude + "<br /> Longitude:" + longitude + "" });
        infowindow.open(map, marker);

      3. Geolocation to get Location , and calling the Javascript function

    if (navigator.geolocation) {
        navigator.geolocation.getCurrentPosition(success);
    } else {
        alert("Geo Location is not supported on your current browser!");
    }

   4. Load Google Maps inside map_canvas Div ID in Body Section of ASPX page
  

<div id="map_canvas" style="width: 800px; height: 400px">
</div>



Default.aspx Page

Comments

Post a Comment

Share this to your friends

Popular posts from this blog

Java Swing MySql JDBC: insert data into database

By
Program import javax.swing.*; import java.awt.*; import java.awt.event.*; import java.sql.*; public class insertswing implements ActionListener {   JFrame fr;JPanel po;   JLabel l1,l2,main;   JTextField tf1,tf2;   GridBagConstraints gbc;   GridBagLayout go;   JButton ok,exit; public insertswing(){ fr=new JFrame("New User Data "); Font f=new Font("Verdana",Font.BOLD,24); po=new JPanel(); fr.getContentPane().add(po); fr.setVisible(true); fr.setSize(1024,768); fr.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE); po.setBackground(Color.WHITE); go=new GridBagLayout(); gbc=new GridBagConstraints(); po.setLayout(go); main=new JLabel("Enter User Details "); main.setFont(f); l1=new JLabel("Name  :");tf1=new JTextField(20); l2=new JLabel("User Name  :");tf2=new JTextField(20); ok=new JButton("Accept"); exit=new JButton("Exit"); gbc.anchor=GridBagConstraints.NORTH;gbc.gridx=5;gbc.gridy=0; go.s...
Post a Comment
Read more

Guidewire Policy - Spin Up Spin Off Transactions

By
Guidewire PolicyCenter - Spin Up and Spin Off Policy Job Transactions In Guidewire PolicyCenter, "spin up" and "spin off" refer to specific actions you can take with policy job transactions. These terms are related to how new policy transactions (such as renewals, endorsements, or cancellations) are created or modified. Here's an explanation of each: 1. Spin Up: "Spin up" refers to the process of creating a new policy job from an existing policy or transaction. When you "spin up" a policy job, you're essentially initiating a new transaction based on an existing policy. This new transaction could be a renewal, an endorsement, or any other type of policy change. For example: - Renewal : When a policy's term is about to expire, you might "spin up" a renewal job to create a new policy term based on the existing one. The new job will carry forward much of the existing policy's data but may allow for updates or cha...
Post a Comment
Read more

JSP and Servlet Form Submission without page refresh show results on the same page using Jquery AJAX

By
Code Snippet HTML Form  <form id='ajaxform' name='ajaxform' action='ajaxformexample' method='post'>  First Name: <input type='text' id='firstname' name='firstname' size='30' required/><br/>  Last Name: <input type='text' id='lastname' name='lastname' size='30'required/><br/>  Email:  <input type='email' id='emailid' name='emailid' size='30'required/><br/>  Password:  <input type='password' id='pwd' name='pwd' size='30'required/><br/>  <input type='Submit'/>   <div id='content'> </div> </form> the above HTML Form uses post method and url servlet redirect to " ajaxformexample " Javascript Code  var form = $('#ajaxform'); // id of form tag  form.submit(function () {  $.ajax({  ...
46 comments
Read more