为每组坐标绘制具有不同样式的openLayers图层

// 创建地图容器
var mapContainer = document.getElementById("map");

// 初始化地图对象
var map = new ol.Map({
  target: mapContainer,
  layers: [],
  view: new ol.View({
    center: [0, 0],
    zoom: 10
  })
});

// 创建矢量图层
var vectorLayer = new ol.layer.Vector({
  source: new ol.source.Vector(),
  style: function(feature) {
    // 根据要素的属性设置样式
    var style = new ol.style.Style({
      image: new ol.style.Circle({
        radius: 5,
        fill: new ol.style.Fill({
          color: feature.get('color')
        }),
        stroke: new ol.style.Stroke({
          color: '#fff',
          width: 2
        })
      })
    });
    return style;
  }
});

// 添加图层到地图
map.addLayer(vectorLayer);

// 添加坐标点
var coordinates = [
  [0, 0],
  [10, 10],
  [20, 20]
];

coordinates.forEach(function(coord, index) {
  var feature = new ol.Feature({
    geometry: new ol.geom.Point(coord),
    color: index === 0 ? 'red' : 'blue' // 根据索引设置不同的颜色
  });
  vectorLayer.getSource().addFeature(feature);
});

// 渲染地图
map.render();