Javascript 如何合理化代码，以便为openlayers代码mish mash添加样式

我曾考虑将此发布到codereview.stackexchange.com，但openlayers.org的“提问”链接在这里，所以我在这里发布

我的代码成功地绘制了一张地图，在上面放置了一些SVG标记，并覆盖了一条GPX轨迹。现在，我想改变GPX轨迹的颜色，使其与地图更加区分，但所有基于谷歌示例的尝试都失败了；没有错误消息-虽然我不知道它会出现在哪里-只是所有尝试设置曲目样式的操作都会导致曲目无法显示

代码如下：

图片重命名器3-SAM_5772.JPG svgbullet{ 最大高度：22px； 最大宽度：22px； } var映射； 函数updateClipboardtext{ navigator.clipboard.writeTexttext.thenfunction{ /*剪贴板已成功设置*/ }，功能{ /*剪贴板写入失败*/ 警报“无法写入剪贴板提示：您是否通过https提供此文件？”； }; } 函数初始化_maplat、lon、zoom、trackfile{ map=新ol.map{ 目标：地图， 图层：[ 新ol.layer.Tile{ 来源：new ol.source.OSM{ 网址：https://a.tile.openstreetmap.org/{z} /{x}/{y}.png } } ], 视图：新ol.view{ 中心：LONLAT[lon，lat]的ol.proj， 缩放：缩放 } }; 映射。在“单点单击”上，函数EVT{ var坐标=evt坐标； var p=map.getView.getProjection； var cord=ol.proj.TOLONLATA坐标，p； updateClipboardcord[1]。toFixed6+'，'+cord[0]。toFixed6； }; 如果trackfile！={ gpxTrackVector=新ol.source.Vector{ url:trackfile， 格式：新建ol.format.GPX }; var gpxTrackLayer=new ol.layer.Vector{ 资料来源：gpxTrackVector， }; map.addLayergpxTrackLayer； } } 功能添加带有标记的图层、液化天然气、col、cx、cy{ var svg= var mysvg=新图像； mysvg.src='data:image/svg+xml'，+escapesvg； var vectorLayer=新ol.layer.Vector{ 来源：新ol.source.Vector{ 功能：[新ol.功能{ 几何体：新ol.geom.Pointol.proj.transform[parseFloatlng，parseFloatlat]，“EPSG:4326”，“EPSG:3857”， }] }, 风格：新的ol风格{ 图片：新ol.style.Icon{ img:mysvg， imgSize:[40,40] } }, /* *停止在同一位置完全遮挡标记。 */ 不透明度：0.6 }; map.addLayervectorLayer； }

---

例如，如果OpenLayers以默认样式显示轨迹，只要正确指定，它就应该显示任何样式

var gpxTrackLayer = new ol.layer.Vector({
    source: gpxTrackVector,
    style: new ol.style.Style({
        stroke: new ol.style.Stroke({
            color: 'black',
            width: 8
        })
    })
});

---

非常感谢，迈克，成功了！但是关于合理化我的新手代码的更广泛的问题仍然存在。