jQuery生成小的世界地图插件SmallWorld.js

查看演示立即下载

插件描述：SmallWorld.js使用GeoJSON和HTML Canvas生成地图。这是一个需要绘制简单地图预览，快速有效地没有沉重的客户端库。

默认的

只有通过GeoJSON源。默认情况下,地图是为中心(0,0)。地图将从DOM元素初始化它继承其大小。如果你使用相同的GeoJSON,你也可以设置为默认的数据源。

$('.map').smallworld({
    geojson: data
});
// OR…
Smallworld.defaults.geojson = data;
$('.map').smallworld();

中心与放大

地图可以集中在任何地理坐标,以及放大。默认缩放级别设置为0。

$('.map').smallworld({
    zoom: 1,
    center: [37.757719928168605, -122.43760000000003]
});

颜色

地图绘制,改变任何的颜色很容易。

$('.map').smallworld({
    center: [45, 0],
    waterColor: '#021019',
    landColor: '#08304b'
});

标记

您可以轻松地删除标记在地图的中心,或其他任何地方通过额外的坐标。标记也可以有一个自定义大小和颜色。

$('.map').smallworld({
    marker: true,
    markerColor: '#fa29df'
});

$('.map').smallworld({
    center: [45, 180],
    marker: [37.757719928168605, -122.43760000000003],
    markerSize: 8
});

$('.map').smallworld({
    center: [45, -50],
    markers: [
        [37.757719928168605, -122.43760000000003],
        [51.528868434293145, -0.10159864999991441],
        [40.705960705452846, -73.9780035]
    ],
    markerSize: 8
});

使用JQUERY/ZEPTO

使用jQuery或smallworld.js,初始化它与DOM元素和选项。

var el = document.querySelector('.map');
var map = new Smallworld(el, options);

特别申明：
本站所有资源都是由网友投稿发布，或转载各大下载站，请自行检测软件的完整性！
本站所有资源仅供学习与参考，请勿用于商业用途，否则产生的一切后果将由您自己承担！
如有侵权请联系我们删除下架，联系方式：lei1294551502@163.com

上一个特效： jquery拖曳显示或隐藏图像插件coveringBad.js
下一个特效： jQuery计算器输入插件jCalculator