ThinkGeo.com    |     Documentation    |     Premium Support

How to show cloud popup when mouse hovering on a marker

 i want to show cloud popup for a marker mouse hoveriong.how to show cloud popup when mouse hover on a mrker


and i want when i click a marker it has to show the content in a popup.how to do that one.each marker has its own data.i want to show that data in popup



Hi rajanikanth,  
  
 Please take a look at our the Sample Applications provided with the Map Suite Web Evaluation Edition. If you look in the Markers section of the samples you will find examples for how to implement both hover and click events for markers.

 in that they are showing normal popup.but i want cloud popup.when a mouse over on a marker it has to show the data in cloud popup instead of normal popup



Hi Rajanikanth,


The easist way to impliment the CloudPopup is to have your users use the Click event off of the Map as shown in the attached sample application.



ClickEventOnAMarkerPopup.zip (132 KB)

 can u show one sample example on mouse over on marker.when a mouse over on marker it has to show cloud popup



rajanikanth,  
  
 I believe the only way to have a CloudPopup object occur is on the Click event. On the Hover you can specifiy a .Popup and you can customize this using the different .Popup parameters but there is not an option for the CloudPopup to occur on Hover.

 ok thank you For your reply.so then how to show cloud popup when click on every marker with different content html.



in my page load event iam adding markers.when i click on that marker i need to show the contenthtml in a cloud popup.how to show differnt content for each marker.when i click on marker based on  that marker i need to show the data.


 


like ihav eid ,ename ,sal ,location.based on location iam adding marker in my pageload event.like ihav 10 records.so iam adding 10 markers.after when click on first marker it has to show eid=1 details for second marker it has to show eid=2 detiails.like that i need to show content in cloud popup.how to do that one




 please give me a reply for thisone its urgent...



 how to show cloud popup when click on every marker with different content html.


 


in my page load event iam adding markers.when i click on that marker i need to show the contenthtml in a cloud popup.how to show differnt content for each marker.when i click on marker based on  that marker i need to show the data.


 


like ihav eid ,ename ,sal ,location.based on location iam adding marker in my pageload event.like ihav 10 records.so iam adding 10 markers.after when click on first marker it has to show eid=1 details for second marker it has to show eid=2 detiails.like that i need to show content in cloud popup.how to do that one




rajanikanth,


You can simply setup a different ContentHtml string for each of your features. Please see the following code for guidence:



public partial class ClickEventOnAMarker : System.Web.UI.Page
    {
        private readonly string[] markerIcons = new string[] { "marker_blue.gif", "marker.gif", "marker_gold.gif", "marker_green.gif" };

        protected void Page_Load(object sender, EventArgs e)
        {
            if (!Page.IsPostBack)
            {
                Map1.MapBackground.BackgroundBrush = new GeoSolidBrush(GeoColor.FromHtml("#E5E3DF"));
                Map1.CurrentExtent = new RectangleShape(-131.22, 55.05, -54.03, 16.91);
                Map1.MapUnit = GeographyUnit.DecimalDegree;

                WorldMapKitWmsWebOverlay worldMapKitOverlay = new WorldMapKitWmsWebOverlay();
                Map1.CustomOverlays.Add(worldMapKitOverlay);

                InMemoryMarkerOverlay markerOverlay = new InMemoryMarkerOverlay("MarkerOverlay");
                markerOverlay.Columns.Add(new FeatureSourceColumn("ContentHTML"));

                //Add Lawrence Feature and CloudPopup Content
                markerOverlay.Features.Add("Lawrence", new Feature(-94.48242, 38.75977));
                StringBuilder lawrenceContentHtml = new StringBuilder();
                lawrenceContentHtml.Append("                    .Append("src='../../theme/default/samplepic/lawrencecity.jpg'/>  Lawrence is a city in Northeastern Kansas")
                    .Append("in the United States. Lawrence serves as the county seat of Douglas County, Kansas. Located 41 miles west ")
                    .Append("of Kansas City, Lawrence is situated along the banks of the Kansas (Kaw) and Wakarusa Rivers. It is considered ")
                    .Append("governmentally independent and is the principal city within the Lawrence, Kansas, Metropolitan Statistical Area, ")
                    .Append("which encompasses all of Douglas County. As of the 2000 census, the city had a population of 80,098, making it ")
                    .Append("the sixth largest city in Kansas. 2006 estimates[3] place the city's population at 89,110. A quintessential")
                    .Append("college town, Lawrence is home to The University of Kansas and Haskell Indian Nations University.
")
                    .Append("                      .Append("target='_blank'>
more about Lawrence city...</a>");
                markerOverlay.Features["Lawrence"].ColumnValues.Add("ContentHTML", lawrenceContentHtml.ToString());

                
                //Add Phoenix Feature and CloudPopup Content
                markerOverlay.Features.Add("Phoenix", new Feature(-112.02, 33.43));
                StringBuilder phoenixContentHtml = new StringBuilder();
                phoenixContentHtml.Append("  Phoenix is in Arizona");
                markerOverlay.Features["Phoenix"].ColumnValues.Add("ContentHTML", phoenixContentHtml.ToString());

                //Set Universal MarkerStyle
                markerOverlay.ZoomLevelSet.ZoomLevel01.DefaultMarkerStyle.WebImage = new WebImage("../../theme/default/img/marker_blue.gif", 21, 25);
                markerOverlay.ZoomLevelSet.ZoomLevel01.ApplyUntilZoomLevel = ApplyUntilZoomLevel.Level20;

                //Setup Event to fire everytime the MarkerOverlay is clicked
                markerOverlay.Click += new EventHandler<MarkerOverlayClickEventArgs>(markerOverlay_Click);

                Map1.CustomOverlays.Add(markerOverlay);
            }
        }

        void markerOverlay_Click(object sender, MarkerOverlayClickEventArgs e)
        {
            InMemoryMarkerOverlay markerOverlay = (InMemoryMarkerOverlay)Map1.CustomOverlays["MarkerOverlay"];

            markerOverlay.FeatureSource.Open();
            Feature feature = markerOverlay.FeatureSource.GetFeatureById(e.FeatureId, ReturningColumnsType.AllColumns);
            PointShape pointShape = (PointShape)feature.GetShape();


            CloudPopup samplePopup = new CloudPopup("SamplePopup", pointShape, feature.ColumnValues["ContentHTML"].ToString());
            samplePopup.AutoSize = true;
            samplePopup.AutoPan = true;
            samplePopup.HasCloseButton = true;
            Map1.Popups.Add(samplePopup);

        }
    }