Hello,

is there a way to have shape fills that are more complex than rgb-values, for example a diagonal hatch fill?

my knowledge on the map control and svgis limited. my current approach is to create a pattern via jquery when the map is created:

        jQuery("map svg defs").html(''
            + '<pattern id="diagonalHatch" width="10" height="10" patternTransform="rotate(45 0 0)" patternUnits="userSpaceOnUse">'
            + '  <line x1="0" y1="0" x2="0" y2="10" style="stroke:red; stroke-opacity:0.4; stroke-width:8" />'
            + '</pattern>';

then i use the def as fill for shapes when they are created:

    shape.fill("url(#diagonalHatch)");

this works fine, but i want to have opacity or color depend on other parameters, which would result in many defs.

Do you have any suggestions?

New user here - I am trying to set up a SharePoint site (2010/2013 on prem) and insert the Kendo UI map control with the geoJSON data to create a clickable world map.  I have follow the example and uploaded all the corresponding files.

I can get the regular map to display, but the geoJSON map is just blank, with the zoom/pan controls visible. I know there were other threads saying to be sure that you added json to the MIME types, but that appears to already be there in IIS on my SharePoint server.

Here is what I am seeing (attached).

Any other thoughts/suggestions?  Is there any particular issue with using this control in SharePoint?

Thanks

I have a kendoMap with dataSource transport read which loads the locations for the markers. Because it loads thousands of coordinates I would need a progress bar on the map to let the user know that the map is loading. Is this possible? I'm using Bing type map.

$("#map").kendoMap({
            center: centerCoordinates,
            zoom: zoomLevel,
            layerDefaults: {
                bing: {
                    culture: "hu-HU"
                }
            },
            layers: [
                {
                    type: "bing",
                    imagerySet: "road",
                    key:"XXXXXXXXXXXXX"
                },
                {
                    dataSource: {
                        transport: {
                            read: {
                                url: url,
                                type: 'GET',
                                contentType: "application/json; charset=utf-8",
                                dataType: 'json',
                                data: json
                            }
                        }
                    },
                    type: "marker",
                    locationField: "LatLng",
                    titleField: "Name",
                    shape: "pin"
                }],
            markerActivate: function(e) {
                e.marker.element.addClass(e.marker.dataItem.Color);
            },
            markerClick: function (e) {
                //some more code exists here...
            },
            zoomEnd: zoomEndControl,
            pan: panControl,
            panEnd: panEndControl
        });

     Hi,

I can use kendo map as an image viewer?

In other words, i can produce my own custom tile provider that create the images flux from a static image? 

marc.

So I'm trying this software out as an alternative to Google GeoCharts. I'm ultimately going to be creating an interactive choropleth, but right now I'm just seeing if this will work in Angular 6. I did the npm install, and then in my component I import * as kendo from "@telerik/kendo-intl". (Note that it would be great if you guys supported something other than AngularJS.) 

OnInit I'm calling the function below, but all I get is an error that 'Property 'kendoMap' does not exist on type 'JQuery<HTMLElement>'.

Do I need to actually download the Kendo for jQuery and include everything in my project for this to work? I assumed the npm install would have what I needed.

Anyway, appreciate the help.

createMap() {
    $("#map").kendoMap({
      center: [30.268107, -97.744821],
      zoom: 3,
      layers: [
        {
          type: "tile",
          urlTemplate:
            "http://#= subdomain #.tile.openstreetmap.org/#= zoom #/#= x #/#= y #.png",
          subdomains: ["a", "b", "c"],
          attribution:
            "&copy; <a href='http://osm.org/copyright'>OpenStreetMap contributors</a>"
        }
      ],
      markers: [
        {
          location: [30.268107, -97.744821],
          shape: "pinTarget",
          tooltip: {
            content: "Austin, TX"
          }
        }
      ]
    });
  }

Hi,

What is the most efficient way to update the map layer datasource? For this map I use a url I'd like updated (because a get parameter changes).

I read this: http://d585tldpucybw.cloudfront.net/forums/change-marker-layer%27s-data-source

But it's outdated, currently there is no more _initDataSource() and the setDataSource() did find its way to the layer object but I can't get it to work:

don't find an example for it.

 also, I tried:

 Also tried this:

Error: this.dataSource.unbind is not a function

So my question: Is there an efficient way to do this so the map is reloaded on layer url update?

thanks,

Arno
       
​

https://dojo.telerik.com/@alexy99/EKomOrIh

I'm trying to follow below document to link markers with Paths, but every layer is ignoring my paths. No error messages.

https://docs.telerik.com/kendo-ui/controls/diagrams-and-maps/map/how-to/link-marker-to-location

Thanks,

Alex