Click here to Skip to main content
15,847,263 members
Please Sign up or sign in to vote.
1.60/5 (2 votes)
hello, in our project we need to show the markers on Google map from the database. we have already got the code in which all the markers are displayed for the the places stored in database. But our aim is somewhat different.We need marker on one place that is selected from the database.To elaborate,if we select an area from the dropdownlist that contains names of areas stored in database,then "only" marker on that place must be displayed.Further,selecting the subarea from dropdownlist2 should zoom the map and display a marker on that subarea.so how do we do that? what are the changes required to be made in this code?
Awaiting your reply.

C#
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Data;
using System.Configuration;
using System.Data.SqlClient;

namespace trial2
{
    public partial class explore : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {
            if (!IsPostBack)
            {
                DropDownList1.DataBind();

                ListItem liMainArea = new ListItem("Select", "-1");
                DropDownList1.Items.Insert(0, liMainArea);

                DropDownList2.DataBind();

                ListItem liSubArea = new ListItem("Select", "-1");
                DropDownList2.Items.Insert(0, liSubArea);

                DropDownList3.DataBind();
                ListItem liAmenities = new ListItem("Select", "-1");
                DropDownList3.Items.Insert(0, liAmenities);

 
                DropDownList2.Enabled = false;
                DropDownList3.Enabled = false;
               
            }
            string markers = GetMarkers();
            Literal1.Text = @"
     <script type='text/javascript'>
     function initialize() {
 
     var mapOptions = {
     center: new google.maps.LatLng(23.0300, 72.5800),
     zoom: 12,
     mapTypeId: google.maps.MapTypeId.ROADMAP};
 
     var myMap = new google.maps.Map(document.getElementById('googleMap'), mapOptions);"
            + markers +
            @"}
    google.maps.event.addDomListener(window, 'load', initialize);
     </script>";

            }
        protected string GetMarkers()
        {
            string markers = "";
            using (SqlConnection con = new SqlConnection(System.Configuration.ConfigurationManager.ConnectionStrings["gisConnectionString"].ConnectionString))
                {
                SqlCommand cmd = new SqlCommand("SELECT [Name], [Latitude], [Longitude] FROM [MAIN AREA]", con);
               // SqlCommand cmd1 = new SqlCommand("SELECT [Name], [Latitude], [Longitude] FROM [subarea]",con);
                con.Open();
            
                SqlDataReader reader = cmd.ExecuteReader();
                int i = 0;

                while (reader.Read())
                {
                    i++;
                    markers +=
                    @"var marker" + i.ToString() + @" = new google.maps.Marker({
              position: new google.maps.LatLng(" + reader["Latitude"].ToString() + ", " +
                    reader["Longitude"].ToString() + ")," +
                    @"map: myMap,
              title:'" + reader["Name"].ToString() + "'});";
                }
            }
            return markers;
        }

        protected void DropDownList1_SelectedIndexChanged(object sender, EventArgs e)
        {
            if (DropDownList1.SelectedIndex == 0)
            {            
                DropDownList2.Enabled = false;
                DropDownList2.DataBind();

                ListItem liSubArea = new ListItem("Select", "-1");
                DropDownList2.Items.Insert(0, liSubArea);

                DropDownList3.Enabled = false;
                DropDownList3.DataBind();

                ListItem liAmenities = new ListItem("Select", "-1");
                DropDownList3.Items.Insert(0, liAmenities);
            }
            else
            { 
                DropDownList2.Enabled = true;
                DropDownList2.DataBind();
                
                ListItem liSubArea = new ListItem("Select", "-1");
                DropDownList2.Items.Insert(0, liSubArea);

                DropDownList3.SelectedIndex = 0;
                DropDownList3.Enabled = false;
            }
        }

        protected void DropDownList2_SelectedIndexChanged(object sender, EventArgs e)
        {
            if (DropDownList2.SelectedIndex == 0)
            {             
                DropDownList3.Enabled = false;

                DropDownList3.DataBind();
                ListItem liAmenities = new ListItem("Select", "-1");
                DropDownList3.Items.Insert(0, liAmenities);
            }
            else
            {
                DropDownList3.Enabled = true;
                
                DropDownList3.DataBind();
                
                ListItem liAmenities = new ListItem("Select", "-1");
                DropDownList3.Items.Insert(0, liAmenities);
            }
        }

        protected void DropDownList3_SelectedIndexChanged(object sender, EventArgs e)
        {

        }
    }
}
Posted
v2
Comments
Afzaal Ahmad Zeeshan 29-Mar-15 21:31pm    
Inside the code, where the markers are being applied... Use the same code but different location (Latitude, Longitude) and set the markers.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)



CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900