tool tip is not showing on the mouse-hover on the custom icon-image on google map marker.

2 posts, 0 answers
  1. Saroj
    Saroj avatar
    1 posts
    Member since:
    Dec 2013

    Posted 09 Jan 2014 Link to this post

    I am developing an application, where i have requirement of plotting markers on the google map, and I need to use my Own Marker image. On this marker image, i have placed dynamic data to be displayed.  But the problem is that, kendo tooltip doesn't work until the mouse arrow doesn't touch the dynamic content ((shown on the center of "circular" image, which is a marker on the google map).

    Source code is:
    var imagePath1 = //dynamic path
    var markers = new MarkerWithLabel({
                position: point,
                icon: imagePath1,
                map: map,
                draggable: false,
                labelContent: image_count,
                labelAnchor: new google.maps.Point(10, 30),
                labelClass: "labels", // the CSS class for the label
                labelInBackground: false,
                title : contentVal,

    var tooltip = $("#map_canvas").kendoTooltip({
                            filter: ".labels",  // this is CSS class, which causes the tool tip to be shown on the mouse-hover of dynamic numeric content.
                            width: 250,
                            position: "top",

  2. Alexander Popov
    Alexander Popov avatar
    1411 posts

    Posted 10 Jan 2014 Link to this post

    Hello Saroj,

    That behavior is expected, since the Tooltip is configured to show when element with class "label" are hovered. I would recommend you to change the Tooltip filter to ".k-marker" or try using the built-in markers.tooltip option.

    Alexander Popov
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
Back to Top