显示不出来是什么意思

# 具体遇到的问题

# 报错信息的截图

# 相关课程内容截图
# 尝试过的解决思路和结果

# 粘贴全部相关代码，切记添加代码注释（请勿截图）

<!doctype html>
<html>

<head>
   <meta charset="utf-8">
   <title></title>
   <script type="text/javascript" src="https://webapi.amap.com/maps?v=1.4.11&key=e22196035aaa10db3b0b6eb1ab64619e&plugin=AMap.Autocomplete">
   </script>
   <style type="text/css">
      * {
         margin: 0;
         padding: 0;
         list-style: none;
      }

      #container {
         width: 100%;
         height: 100%;
         position: absolute;
         left: 0;
         top: 0;
      }

      #setZoomNode,
      #setCenterNode {
         width: 280px;
         height: 500px;
         position: absolute;
         z-index: 99;
         right: 20px;
         top: 20px;
         border: 1px solid black;
         box-shadow: 0 0 5px black;
         background: white;
      }

      #setCenterNode {
         top: 20px;
      }

      #node li {
         cursor: pointer;
      }
   </style>
</head>

<body>
   <div id="container"></div>
   <div id='setCenterNode'>
      
   </div>

   <script type="text/javascript">
      var map = new AMap.Map('container', {
         zoom: 11, //初始的地图级别
         center: [100.379391, 30.861536] //初始化地图的中心点
      });

      AMap.service(['AMap.PlaceSearch'], function () {
         new AMap.PlaceSearch({
            pageSize: 5,
            pageIndex:2,
            city: '顺义',
            citylimit: true,
            map: map, // 展示在哪个地图里
            panel: 'setCenterNode' // 放在哪个元素下
         }).search('足疗店')
      })
      // new AMap.Autocomplete({
      //    input: 'searchText'
      // })

      // new AMap.Autocomplete().search('北京', function (status, data) {
      //    console.log(data, 'sss')
      // })

      //加载插件、 Autocomplete 地图加载完毕会触发的回调函数
      // AMap.plugin('AMap.Autocomplete', function () {
      //    //   console.log(1);
      //    // node.innerHTML = ''
      //    // if (this.value === '') return
      //    //   oninput  当内容改变的时候触发的一个函数
      //    searchText.oninput = function () {
      //       // console.log(this.value)
      //       node.innerHTML = ''
      //       if (this.value == '') return
      //       new AMap.Autocomplete().search(this.value, function (status, data) {
      //          console.log(data, 'sss')
      //          // location是空时，就无法获取到location了，因此可以判断一下，如果该数据没有location属性，就不生成li标签了，我们只让属性齐全的数据对应生成li元素
      //          for (var i = 0; i < data.tips.length; i++) {
      //             var oLi = document.createElement('li')
      //             oLi.innerHTML = data.tips[i].name
      //             oLi.Q = data.tips[i].location.Q
      //             oLi.R = data.tips[i].location.R
      //             node.appendChild(oLi)
      //             oLi.onclick = function () {
      //                console.log(this.Q, this.R)
      //                map.setCenter([this.Q, this.R])
      //             }
      //          }
      //          // TODO 搜索完后在地图上显示不出来，显示白屏
      //       })
      //    }

      // });
   </script>
</body>

</html>
--------------------------------------------
const express = require('express')
const server = express()

server.listen(2378)

server.use(express.static('./'))

unbreakable_全栈 2020-12-24

源自：高德地图 4-5 地图搜索与poi结合（2）

收起

1回答

好帮手慕慕子回答被采纳获得+3积分 2020-12-25 11:27:24

同学你好，看同学截图可能是由于node服务器没有成功启动，导致无法访问。老师测试同学的代码，是可以正常显示的，如下图所示：

同学可以参考如下步骤，简单了解下如何启动node服务

1、将html文件和js文件放在同一个文件夹下，老师的文件名可能和同学的不一样，同学操作的时候换成自己的文件名即可，如下图所示：

2、找到文件所在的文件夹，在地址栏输入cmd，回车后打开命令窗口，如下图所示：

3、打开命令窗口后输入npm init 命令后回车，初始化项目，注意：package name这里必须使用英文命名，其它的不用管，直接回车就可以了。示例：

4、在命令行输入npm install express --save 回车后安装express插件，示例：

5、在命令行输入node index.js 启动服务，示例：

6、服务器启动成功之后，在浏览器中输入地址访问对应的html文件即可，示例：

由于目前还没有学习node，同学操作起来可能会比较困难，如果还是无法成功访问，同学也不用着急，暂时了解下这种方式即可，在后面阶段会详细讲解node相关的知识，到时候同学再重点学习，如下图所示：

目前阶段，可以使用之前学习过的服务器测试，直接将html文件放在wamp或者phpStudy的www文件夹下，启动服务器，然后通过localhost访问也是可以的。参考教辅链接：https://file.mukewang.com/class/assist/800/4698985/j7xv4ydq6wb/phpStudy%E7%9A%84%E5%AE%89%E8%A3%85%E4%B8%8E%E4%BD%BF%E7%94%A8.pdf

祝学习愉快~

收起回答