在HTML页面上使用OpenLayers/PgAdmin的简单请求

<!-- 引入OpenLayers库文件 -->
<script src="https://cdn.jsdelivr.net/npm/ol@6.5.0/dist/ol.js"></script>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/ol@6.5.0/dist/ol.css" />

<!-- 引入PgAdmin库文件 -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/pgadmin4/5.7/pgadmin.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/pgadmin4/5.7/pgadmin.css" />

<div id="map"></div>

// 创建地图
var map = new ol.Map({
  target: 'map', // 指定地图显示的容器元素ID
  layers: [
    new ol.layer.Tile({
      source: new ol.source.OSM() // 使用OpenStreetMap作为底图
    })
  ],
  view: new ol.View({
    center: ol.proj.fromLonLat([0, 0]), // 设置地图中心点
    zoom: 10 // 设置地图缩放级别
  })
});

// 创建矢量图层
var vectorLayer = new ol.layer.Vector({
  source: new ol.source.Vector({
    features: [
      new ol.Feature({
        geometry: new ol.geom.Point(ol.proj.fromLonLat([0, 0])) // 创建一个点要素
      })
    ]
  })
});

// 将矢量图层添加到地图中
map.addLayer(vectorLayer);

// 创建一个PgAdmin连接
var connection = new pgAdmin.Browser();

// 执行查询
connection.connect(function() {
  connection.query('SELECT * FROM table_name', function(result) {
    console.log(result); // 输出查询结果
  });
});