这个压缩后的报错TypeError: a.Yf is not a function我之前也碰到过，本质原因很明确：你直接把原始的GeoJSON FeatureCollection JSON对象传给了OpenLayers的VectorSource，没有转换成OpenLayers能识别的ol.Feature实例。VectorSource需要的是标准化的ol.Feature对象，而非纯JSON结构，这才导致了内部方法调用失败。

下面是可直接运行的完整示例，包含点FeatureCollection加载、地图渲染和点击弹窗展示属性的功能：

<div id="map" style="width: 100%; height: 450px;"></div>
<div id="popup" style="position: absolute; background: #fff; padding: 10px; border-radius: 6px; box-shadow: 0 2px 8px rgba(0,0,0,0.2); display: none;"></div>

<script src="https://cdn.jsdelivr.net/npm/openlayers@4.6.5/dist/ol.js"></script>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/openlayers@4.6.5/dist/ol.css">
<script>
// 初始化弹窗Overlay
const popup = new ol.Overlay({
  element: document.getElementById('popup'),
  autoPan: true,
  autoPanAnimation: { duration: 250 }
});

// 初始化地图
const map = new ol.Map({
  target: 'map',
  overlays: [popup],
  layers: [
    new ol.layer.Tile({ source: new ol.source.OSM() })
  ],
  view: new ol.View({
    center: ol.proj.fromLonLat([0, 0]),
    zoom: 2
  })
});

// 你的点FeatureCollection数据（补充了完整坐标示例）
const pointsGeoJSON = {
  "type": "FeatureCollection",
  "features": [{
    "type": "Feature",
    "properties": { 'text':'World', 'id': 'Point 1' },
    "geometry": { "type": "Point", "coordinates": [0, 0] }
  }, {
    "type": "Feature",
    "properties": { 'text':'Hello', 'id': 'Point 2' },
    "geometry": { "type": "Point", "coordinates": [15, 15] }
  }]
};

// 核心步骤：将GeoJSON转换为ol.Feature数组
const geoJsonFormat = new ol.format.GeoJSON();
const features = geoJsonFormat.readFeatures(pointsGeoJSON, {
  dataProjection: 'EPSG:4326',  // GeoJSON默认的WGS84坐标系
  featureProjection: 'EPSG:3857' // OpenLayers默认的墨卡托坐标系
});

// 创建矢量图层并添加到地图
const vectorLayer = new ol.layer.Vector({
  source: new ol.source.Vector({ features: features }),
  style: new ol.style.Style({
    image: new ol.style.Circle({
      radius: 7,
      fill: new ol.style.Fill({ color: '#ff4444' }),
      stroke: new ol.style.Stroke({ color: '#fff', width: 2 })
    })
  })
});
map.addLayer(vectorLayer);

// 监听点击事件，展示弹窗
map.on('singleclick', function(evt) {
  const clickedFeature = map.forEachFeatureAtPixel(evt.pixel, feat => feat);

  if (clickedFeature) {
    const props = clickedFeature.getProperties();
    const popupEl = popup.getElement();
    // 填充弹窗内容
    popupEl.innerHTML = `
      <h4>点属性</h4>
      <p>ID: <strong>${props.id}</strong></p>
      <p>文本: ${props.text}</p>
    `;
    // 设置弹窗位置
    popup.setPosition(evt.coordinate);
    popupEl.style.display = 'block';
  } else {
    // 未点击到点时隐藏弹窗
    popup.setPosition(undefined);
    document.getElementById('popup').style.display = 'none';
  }
});
</script>

• 必须转换GeoJSON：永远不要直接把原始JSON传给VectorSource的features参数，一定要用ol.format.GeoJSON().readFeatures()做转换，同时指定坐标系映射（避免坐标偏移）。
• 弹窗Overlay配置：确保弹窗DOM元素存在，开启autoPan可以让弹窗在地图边缘时自动平移到视野内，提升体验。
• 属性获取规范：通过feature.getProperties()获取属性，不要直接访问Feature的内部属性（避免压缩后的方法名报错）。

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