旧OpenLayers OSM地图代码修复与升级方案求助

一、修复现有旧版OpenLayers的三个错误 #

1. 解决polyfill.min.js加载失败 #

你已移除polyfill相关链接，若页面仍有残留引用，检查所有<script>标签，彻底删除指向该文件的代码行即可。

2. 修复PHP语法错误Unexpected token ';' #

你提供的循环代码本身语法无问题，报错大概率来自上下文语法疏漏：

• 检查循环前的代码是否存在未闭合的括号、引号，或遗漏分号
• 确认$result_poi已通过mysqli_query正确初始化，无查询失败情况
• 提前声明$rows变量（如$rows = [];），避免未定义变量导致的隐性语法问题

3. 修复init is not defined错误 #

该错误是因为页面onload事件绑定了未定义的init()函数：

• 若无需保留init逻辑，直接删除<body>标签中的onload="init()"属性
• 若需保留函数，确保init定义在全局作用域，且代码加载顺序优先于onload执行（比如将<script>放在<body>末尾，或改用DOMContentLoaded事件替代onload）

二、保留旧版OpenLayers的修复方案 #

旧代码突然失效，大概率是服务器ol目录文件损坏或OSM瓦片源访问异常：

1. 重新下载对应旧版本（如v2.x，匹配new OpenLayers.Map()语法）的压缩包，覆盖服务器ol目录下的ol.js、ol.css文件
2. 替换OSM瓦片源为稳定地址，避免官方源访问问题：

// 原代码
map.addLayer(new OpenLayers.Layer.OSM());
// 替换为
map.addLayer(new OpenLayers.Layer.OSM("OpenStreetMap", "https://tile.openstreetmap.org/${z}/${x}/${y}.png"));

三、无痛升级到OpenLayers v10（无需配置环境） #

OpenLayers v10采用ES模块，直接解压文件会因依赖缺失报错，推荐使用预构建UMD版本：

1. 下载v10的预构建ol.js和ol.css文件，替换服务器ol目录中的文件；或直接使用CDN加载，无需管理本地文件：

<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/ol@10.0.0/ol.css">
<script src="https://cdn.jsdelivr.net/npm/ol@10.0.0/dist/ol.js"></script>

2. 适配v10的极简代码示例（无需重写核心业务逻辑，仅调整地图初始化语法）：

<!DOCTYPE HTML>
<title>OpenLayers v10 Simplest Example</title>
<link rel="stylesheet" href="ol/ol.css">
<div id="demoMap" style="height:250px"></div>
<script src="ol/ol.js"></script>
<script>
  const map = new ol.Map({
    target: 'demoMap',
    layers: [
      new ol.layer.Tile({
        source: new ol.source.OSM()
      })
    ],
    view: new ol.View({
      center: ol.proj.fromLonLat([0, 0]),
      zoom: 2
    })
  });
</script>

内容的提问来源于stack exchange，提问作者Martin Liungman