半岛外围网上直营

新年了，有出去旅行的打算吗，只是可惜，今年放假不给力，请不到足够的假期，是不是就要把旅行计划搁置呢。没有必要，今天为大家介绍一个足不出户也能玩遍世界的方法。在我们去旅行之前，需要大家做一些准备工作。

旅游必备：

• JavaScript Maps：点击这里免费拿

  第一步：制作地图

  有了JavaScript Maps，我们就开始旅行吧，先把世界各地都标出来，然后筛选。输入下面的代码制作世界地图：

  <script src="//www.ammap.com/lib/3/ammap.js" type="text/javascript"></script>
  <script src="//www.ammap.com/lib/3/maps/js/worldHigh.js" type="text/javascript"></script>
  <div id="mapdiv" style="width: 1550px; height: 450px;"></div>​
  <div style="font-size: 70%; padding: 5px; text-align: center; background-color: #666666; margin-top: 1px; color: #CDCDCD;"><a href="//www.ammap.com/visited_countries/" style="color: #CDCDCD;">​Create your own visited countries map</a>​ or check out the <a href="//www.amcharts.com/" style="color: #CDCDCD;">​JavaScript Charts</a>​.</div>​
  <script type="text/javascript">
  var map;
  AmCharts.ready(function() {
  map = new AmCharts.AmMap();
  map.pathToImages = "//www.ammap.com/lib/images/";
  map.panEventsEnabled = true;
  map.backgroundColor = "#666666";
  map.backgroundAlpha = 1;
  
  map.zoomControl.panControlEnabled = true;
  map.zoomControl.zoomControlEnabled = true;
  
  var dataProvider = {
  mapVar: AmCharts.maps.worldHigh,
  getAreasFromMap: true,
  areas: [
  { id: 'CZ', showAsSelected: true },
  { id: 'CN', showAsSelected: true }
  ]
  };
  
  map.dataProvider = dataProvider;
  
  map.areasSettings = {
  autoZoom: true,
  color: "#CDCDCD",
  colorSolid: "#5EB7DE",
  selectedColor: "#5EB7DE",
  outlineColor: "#666666",
  rollOverColor: "#88CAE7",
  rollOverOutlineColor: "#FFFFFF"
  };
  
  map.write("mapdiv");
  });
  </script>

  效果图：

  

  第二步：选择国家

  在地图上或者选项中选择国家：

  

  

  第三步：设置参数

  设置地图参数：

  

  第四步：自由行动

  先去哪里好呢？美国吧，反正小编没去过。打开JavaScript Maps，在下面输入以下代码美国地图瞬间出现，虽然不能实际到达，但是用JavaScript Maps显示出来的地图效果，一定会给你身临其境的感觉，不信，你试试看。

  <div id="mapdiv" style="width: 100%; height: 370px;">
  
  var map;
  
  AmCharts.ready(function() {
  map = new AmCharts.AmMap();
  map.pathToImages = "//www.ammap.com/lib/3/images/";
  //map.panEventsEnabled = true; // this line enables pinch-zooming and dragging on touch devices
  map.colorSteps = 10;
  map.balloon.color = "#000000";
  var dataProvider = {
  mapVar: AmCharts.maps.usaLow,
  
  areas: [
  {
  id: "US-AL",
  value: 4447100},
  {
  id: "US-AK",
  value: 626932},
  {
  id: "US-AZ",
  value: 5130632},
  {
  id: "US-AR",
  value: 2673400},
  {
  id: "US-CA",
  value: 33871648},
  {
  id: "US-CO",
  value: 4301261},
  {
  id: "US-CT",
  value: 3405565},
  {
  id: "US-DE",
  value: 783600},
  {
  id: "US-FL",
  value: 15982378},
  {
  id: "US-GA",
  value: 8186453},
  {
  id: "US-HI",
  value: 1211537},
  {
  id: "US-ID",
  value: 1293953},
  {
  id: "US-IL",
  value: 12419293},
  {
  id: "US-IN",
  value: 6080485},
  {
  id: "US-IA",
  value: 2926324},
  {
  id: "US-KS",
  value: 2688418},
  {
  id: "US-KY",
  value: 4041769},
  {
  id: "US-LA",
  value: 4468976},
  {
  id: "US-ME",
  value: 1274923},
  {
  id: "US-MD",
  value: 5296486},
  {
  id: "US-MA",
  value: 6349097},
  {
  id: "US-MI",
  value: 9938444},
  {
  id: "US-MN",
  value: 4919479},
  {
  id: "US-MS",
  value: 2844658},
  {
  id: "US-MO",
  value: 5595211},
  {
  id: "US-MT",
  value: 902195},
  {
  id: "US-NE",
  value: 1711263},
  {
  id: "US-NV",
  value: 1998257},
  {
  id: "US-NH",
  value: 1235786},
  {
  id: "US-NJ",
  value: 8414350},
  {
  id: "US-NM",
  value: 1819046},
  {
  id: "US-NY",
  value: 18976457},
  {
  id: "US-NC",
  value: 8049313},
  {
  id: "US-ND",
  value: 642200},
  {
  id: "US-OH",
  value: 11353140},
  {
  id: "US-OK",
  value: 3450654},
  {
  id: "US-OR",
  value: 3421399},
  {
  id: "US-PA",
  value: 12281054},
  {
  id: "US-RI",
  value: 1048319},
  {
  id: "US-SC",
  value: 4012012},
  {
  id: "US-SD",
  value: 754844},
  {
  id: "US-TN",
  value: 5689283},
  {
  id: "US-TX",
  value: 20851820},
  {
  id: "US-UT",
  value: 2233169},
  {
  id: "US-VT",
  value: 608827},
  {
  id: "US-VA",
  value: 7078515},
  {
  id: "US-WA",
  value: 5894121},
  {
  id: "US-WV",
  value: 1808344},
  {
  id: "US-WI",
  value: 5363675},
  {
  id: "US-WY",
  value: 493782}]
  };
  
  map.areasSettings = {
  autoZoom: true
  };
  map.dataProvider = dataProvider;
  
  var valueLegend = new AmCharts.ValueLegend();
  valueLegend.right = 10;
  valueLegend.minValue = "little";
  valueLegend.maxValue = "a lot!";
  map.valueLegend = valueLegend;
  
  map.write("mapdiv");
  });
  
  </div>

  效果图：

  

  更多地图效果：