太阳标记位置在任何缩放级别渲染外主视图 [英] Sun marker position render outside main view at any zoom level

问题描述

由于Leaflet.Realtime，我有一个30分钟更新的Sun制造商，但是这里太阳渲染在主视图之外，（你必须向右滚动才能看到太阳）。

我确实尝试过 worldCopyJump：true，等等：

  var lat = data.solar_lat; 
 var lng =（data.solar_lon  -  360）; 
  

但我坚持这个愚蠢的事情，完整的例子与传单操场下面：

更新的游乐场仅显示主要视图：

资料来源： http://www.freeworldmaps.net/world/america-centric/

如果你想匹配那个视图（美洲中心），你例如，只要原始数据比格林威治子午线更东，就可以简单地包装你的经度。

  function wrapAroundAmericas（latlng）{
 var lng = latlng.lng; 
 
返回L.latLng（
 latlng.lat，
 lng> 0？lng  -  360：lng 
）; 
} 
  

演示： https://playground-leaflet.rhcloud.com/faru/1/edit?html,js,output

i have a Sun maker with a 30min update thanks to Leaflet.Realtime, but here the Sun render outside the main view, (you have to scroll right to see the Sun).

i did try worldCopyJump: true, and things like:

var lat = data.solar_lat;
var lng = (data.solar_lon - 360);

but i am stuck on this silly thing, full example with the leaflet playground bellow:

https://playground-leaflet.rhcloud.com/haco/edit?html,js,output

any help to make the Sun shine on earth "main view" ?

解决方案

I guess it all depends on what you call "main view".

The data source you are using correctly reports the vertical projection of the Sun on Earth as coordinates within [-90; 90] degrees latitude and [-180; 180] degrees longitude, as most standards expect.

It is currently at:

"solar_lat":-22.41390593196, "solar_lon":106.2319043175

(i.e. somewhere off West Australia)

This "main view" is centered around the [0, 0] position (somewhere off West / Central Africa), in particular around the Greenwich meridian (somewhere close to London), i.e. with Europe in the center of the "main" map.

Updated playground showing only that "main" view: https://playground-leaflet.rhcloud.com/hefu/1/edit?html,js,output

If you have grown up in the US, you may be more familiar with Americas being shown in the center of the map, with Australia on its left hand side and Europe on the right.

Source: http://www.freeworldmaps.net/world/america-centric/

If you want to match that view (Americas in the center), you could simply wrap your longitude whenever the original data is more East than the Greenwich meridian for example.

function wrapAroundAmericas(latlng) {
  var lng = latlng.lng;

  return L.latLng(
    latlng.lat,
    lng > 0 ? lng - 360 : lng
  );
}

Demo: https://playground-leaflet.rhcloud.com/faru/1/edit?html,js,output

这篇关于太阳标记位置在任何缩放级别渲染外主视图的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！