KML Map tiles are blurred within component

dave_logic
Topic Author
Offline
New Member

10 years 1 month ago #5495 by dave_logic

KML Map tiles are blurred within component was created by dave_logic

Hi,

Firstly thanks for a great Map component. Very impressive.

I am only exploring component at the moment so have quite a few questions but will restrict this post to a single query for the sake of clarity.

I have a MAP which I have over-layed onto Google Maps using MapTiler. I have created a KML and have used to overlay within your component. I have tried both the static entry in the Map Settings and creating a path with the same results.

Now when I load this KML within you component the images are blurry and also the image tiles change to a lower resolution as you scroll left and right across the map.

Here is a direct link to the KML which will load in Google Earth and will be relatively clear and crisp.

www.logic.co/maps/1875/doc.kml

Here is a link to the component loading exactly same KML however the images become blurry and change as described above.

www.logic.co/index.php/map-test

Now, rather than just query this with you I have downloaded another similar Google Maps component which supports KML overlays and that has a similar issue albeit not as bad so is this possible the way Joomla itself initiates the Map...I have no caching enabled

Regards,

David

Please Log in or Create an account to join the conversation.

Dima
Offline
Platinum Member

10 years 1 month ago #5500 by Dima

Replied by Dima on topic KML Map tiles are blurred within component

Hi.

I think you should use your own Map Type layer, rather than KML file as layer.

I mean like that
joomla.zhuk.cc/index.php/zhgooglemap-demo-feature-projection

Ie create tiles from your image for different zooms. Upload it. Create custom map type and assign it for your map.

Don't forget support my developments: post review in JED , donate , help with translation

The following user(s) said Thank You: dave_logic

Please Log in or Create an account to join the conversation.

dave_logic
Topic Author
Offline
New Member

10 years 1 month ago - 10 years 1 month ago #5501 by dave_logic

Replied by dave_logic on topic KML Map tiles are blurred within component

Hi Dima,

Thanks for the fast response. May I ask. Below is my index.html file generated by Maptiler...I assume the part I need for your component is:

Code:

var mapGetTile = function(x,y,z) { 
  return z + "/" + x + "/" + y + ".png";

Am I safe to assume that the "/" parts need to be the path to the PNGs ?

I have png tiles on my own server at www.logic.co/maps/1875-static/

Code:

<!DOCTYPE html>
<html>
  <head>
    <title>full-1875-map</title>
    <meta charset="utf-8"/>
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no"/>
    <script src="https://maps.google.com/maps/api/js?sensor=false"></script>
    <script src="https://maptilercdn.s3.amazonaws.com/klokantech.js"></script>
    <script>
var map;
var mapMinZoom = 13;
var mapMaxZoom = 20;
var mapBounds = new google.maps.LatLngBounds(
  new google.maps.LatLng(51.439525, -0.110504),
  new google.maps.LatLng(51.462578, -0.072740));
var mapGetTile = function(x,y,z) { 
  return z + "/" + x + "/" + y + ".png";
}

function init() {
  var opts = {
    streetViewControl: false,
    center: new google.maps.LatLng(0,0),
    zoom: 13
  };
  map = new google.maps.Map(document.getElementById('map'), opts);
  map.setMapTypeId(google.maps.MapTypeId.HYBRID);
  map.fitBounds(mapBounds);
  var maptiler = new klokantech.MapTilerMapType(map, mapGetTile, mapBounds, mapMinZoom, mapMaxZoom);
  var opacitycontrol = new klokantech.OpacityControl(map, maptiler);
}

    </script>
    <style>
      html, body, #map { width:100%; height:100%; margin:0; padding:0; }
    </style>
  </head>
  <body onload="init()">
    <div id="map">A map generated with <a href="http://www.maptiler.com/">MapTiler</a></div>
  </body>
</html>

Last edit: 10 years 1 month ago by dave_logic.

Please Log in or Create an account to join the conversation.

Dima
Offline
Platinum Member

10 years 1 month ago #5502 by Dima

Replied by Dima on topic KML Map tiles are blurred within component

Hi

Look at my docs
wiki.zhuk.cc/index.php?title=Zh_GoogleMap_CustomMapType
Ie you copy your tiles (z/x/y) into site, and configure custom map type
And yes, you'll get it as in your static link

Don't forget support my developments: post review in JED , donate , help with translation

The following user(s) said Thank You: dave_logic

Please Log in or Create an account to join the conversation.

dave_logic
Topic Author
Offline
New Member

10 years 1 month ago #5503 by dave_logic

Replied by dave_logic on topic KML Map tiles are blurred within component

Thanks...I have it working now...

David

Please Log in or Create an account to join the conversation.

Time to create page: 0.184 seconds