接到公司派下来的一个任务，让我做一个简单的地图Demo，要求是输入城市名，然后在地图上标记出该城市的位置，而且必须是在一张静态图片上标记，不可调用现有的地图成品控件。稍有常识的人都知道经纬线大部分都是有弧度的，因此在世界地图上玩定位可不是简单的xy能搞定的，但这依然难不倒我，于是我便自行收集、调试出一些接口和函数，完成了这个任务。

首先，国内大部分电子地图服务商对于国外城市的支持≈翔，因此使用谷歌地图。我把谷歌地图缩放到世界地图级别，然后采集拼凑为一张完整的世界地图（见文章底部），尺寸为1024*1024。有了世界地图我们现在来获取指定城市的经纬度，根据一番查找找出了谷歌的api【http://maps.google.cn/maps/api/geocode/json?address=地址】其中地址可以是英文，也可以是url编码后的中文。访问（GET）该地址后获得一些json数据，不出问题的话第33行的location数组就是经纬度数据。

有了经纬度，我们来获取平面坐标（xy）。通过下面的函数，即可把经纬度转为xy坐标

经度到x

function lngToPx(lng) {
  return (lng + 180) * (256 << 2) / 360 + 512;
}

纬度到y

function latToPx(lat) {
  var siny = Math.sin(lat * Math.PI / 180);
  var y = Math.log((1 + siny) / (1 - siny));
  return (128 << 2) * (1 - y / (2 * Math.PI));
}

有了xy坐标，接下来该如何标记就不用我说了吧？

世界地图：

简单地图demo实例源码、无水印世界地图：

http://download.csdn.net/detail/mokeyjay/7670685