为什么fusionMap.js插件会改变谷歌地图的起始位置？

Question

所以我一直在尝试设计自定义谷歌地图（Fusion Tables）的样式。我终于找到了这个插件'fusionMap.js'，它让我可以参考一些可以改变颜色等的选项。

除了包括 jQuery 和插件之外，我需要添加的唯一代码就是这个......

    $('#map').fusionMap({
        publishedtable: 'https://www.google.com/fusiontables/embedviz?q=select+col6+from+1lIBTAqiuRK_U3PM9_8IB0fJjiyXmdPFZR5Jh5vuw&viz=MAP&h=false&lat=51.50644271284457&lng=-0.11780194013670364&t=1&z=13&l=col6&y=2&tmplt=2&hml=ONE_COL_LAT_LNG', // Link to published map
        mapstyles: 'scripts/maps/paledown.js' // Path to map
    });

这很棒，并且可以设置地图的样式，但是当我去测试这个页面时，地图并没有从它应该的位置开始。奇怪的是，当您转到此代码中的 URL 时，它会正确显示....

https://www.google.com/fusiontables/embedviz?q=select+col6+from+1lIBTAqiuRK_U3PM9_8IB0fJjiyXmdPFZR5Jh5vuw&viz=MAP&h=false&lat=51.50644271284457&lng=-0.11780194013670364&t=1&z=13&l=col6&y=2&tmplt=2&hml=ONE_COL_LAT_LNG

...但是 jQuery 中似乎没有任何东西可以改变位置。有谁知道它为什么会移动，或者如果这不能正常工作，有没有人知道另一种方式来设置这些地图的样式？

这是一张色彩漂亮但位置错误的地图...http://thetally.efinancialnews.com/tallyassets/hedgefundmap/index.html

Answer 1

那是因为插件只适用于正坐标

来自源代码：

parseUrl: function(url){
    var lat = url.match(/lat=(\d*).(\d*)/);    // will only match positive numbers
    this.options.lat = lat[1] + '.' + lat[2];

    var lng = url.match(/lng=(\d*).(\d*)/);    // will only match positive numbers
    this.options.lng = lng[1] + '.' + lng[2];

    var styledId = url.match(/y=(\d*)/);
    this.options.styledId = parseInt(styledId[1]);

    var templateId = url.match(/tmplt=(\d*)/);
    this.options.templateId = parseInt(templateId[1]);

    var zoom = url.match(/&z=(\d*)/);
    this.options.zoom = parseInt(zoom[1]);

    var column = url.match(/col+(\d*)/);
    this.options.column = 'col'+column[1];

    var tableid = url.match(/from\+(.+)&viz/);
    this.options.tableid = tableid[1];
},

我无法在 jsfiddle 上设置示例，但为了证明我的假设，请查看以下链接，其中我已将经度值替换为零（如插件“所见”）。

https://www.google.com/fusiontables/embedviz?q=select+col6+from+1lIBTAqiuRK_U3PM9_8IB0fJjiyXmdPFZR5Jh5vuw&viz=MAP&h=false&lat=51.50644271284457&lng=0&t=1&z=13&l=col6&y=2&tmplt=2&hml=ONE_COL_LAT_LNG

要解决此问题，您必须稍微调整用于提取坐标的正则表达式。 只需在第一组中添加-?：

var lat = url.match(/lat=(-?\d*).(\d*)/);
this.options.lat = lat[1] + '.' + lat[2];

var lng = url.match(/lng=(-?\d*).(\d*)/);
this.options.lng = lng[1] + '.' + lng[2];