fix style extension handling

This commit is contained in:
vcoppe
2024-12-28 15:16:32 +01:00
parent 745c7e8470
commit d7aae81c41
6 changed files with 52 additions and 51 deletions

View File

@@ -138,13 +138,13 @@ export class GPXFile extends GPXTreeNode<Track> {
let style = this.getStyle();
let fileStyle = {};
if (style.color.length === 1) {
fileStyle['color'] = style.color[0];
fileStyle['gpx_style:color'] = style.color[0];
}
if (style.weight.length === 1) {
fileStyle['weight'] = style.weight[0];
fileStyle['gpx_style:weight'] = style.weight[0];
}
if (style.opacity.length === 1) {
fileStyle['opacity'] = style.opacity[0];
fileStyle['gpx_style:opacity'] = style.opacity[0];
}
if (Object.keys(fileStyle).length > 0) {
this.setStyle(fileStyle);
@@ -188,14 +188,14 @@ export class GPXFile extends GPXTreeNode<Track> {
getStyle(): MergedLineStyles {
return this.trk.map((track) => track.getStyle()).reduce((acc, style) => {
if (style) {
if (style.color && !acc.color.includes(style.color)) {
acc.color.push(style.color);
if (style["gpx_style:color"] && !acc.color.includes(style["gpx_style:color"])) {
acc.color.push(style["gpx_style:color"]);
}
if (style.opacity && !acc.opacity.includes(style.opacity)) {
acc.opacity.push(style.opacity);
if (style["gpx_style:opacity"] && !acc.opacity.includes(style["gpx_style:opacity"])) {
acc.opacity.push(style["gpx_style:opacity"]);
}
if (style.weight && !acc.weight.includes(style.weight)) {
acc.weight.push(style.weight);
if (style["gpx_style:weight"] && !acc.weight.includes(style["gpx_style:weight"])) {
acc.weight.push(style["gpx_style:weight"]);
}
}
return acc;
@@ -399,14 +399,14 @@ export class GPXFile extends GPXTreeNode<Track> {
if (!this._data.style) {
this._data.style = {};
}
if (style.color) {
this._data.style.color = style.color.replace('#', '');
if (style["gpx_style:color"]) {
this._data.style.color = style["gpx_style:color"].replace('#', '');
}
if (style.opacity) {
this._data.style.opacity = style.opacity;
if (style["gpx_style:opacity"]) {
this._data.style.opacity = style["gpx_style:opacity"];
}
if (style.weight) {
this._data.style.weight = style.weight;
if (style["gpx_style:weight"]) {
this._data.style.weight = style["gpx_style:weight"];
}
}
@@ -506,10 +506,10 @@ export class Track extends GPXTreeNode<TrackSegment> {
getStyle(): LineStyleExtension | undefined {
if (this.extensions && this.extensions['gpx_style:line']) {
if (this.extensions["gpx_style:line"].color) {
if (this.extensions["gpx_style:line"]["gpx_style:color"]) {
return {
...this.extensions["gpx_style:line"],
color: `#${this.extensions["gpx_style:line"].color}`
["gpx_style:color"]: `#${this.extensions["gpx_style:line"]["gpx_style:color"]}`
}
}
return this.extensions['gpx_style:line'];
@@ -521,14 +521,14 @@ export class Track extends GPXTreeNode<TrackSegment> {
return this.children.map((child) => {
let geoJSON = child.toGeoJSON();
if (this.extensions && this.extensions['gpx_style:line']) {
if (this.extensions['gpx_style:line'].color) {
geoJSON.properties['color'] = `#${this.extensions['gpx_style:line'].color}`;
if (this.extensions['gpx_style:line']["gpx_style:color"]) {
geoJSON.properties['color'] = `#${this.extensions['gpx_style:line']["gpx_style:color"]}`;
}
if (this.extensions['gpx_style:line'].opacity) {
geoJSON.properties['opacity'] = this.extensions['gpx_style:line'].opacity;
if (this.extensions['gpx_style:line']["gpx_style:opacity"]) {
geoJSON.properties['opacity'] = this.extensions['gpx_style:line']["gpx_style:opacity"];
}
if (this.extensions['gpx_style:line'].weight) {
geoJSON.properties['weight'] = this.extensions['gpx_style:line'].weight;
if (this.extensions['gpx_style:line']["gpx_style:weight"]) {
geoJSON.properties['weight'] = this.extensions['gpx_style:line']["gpx_style:weight"];
}
}
return geoJSON;
@@ -641,14 +641,14 @@ export class Track extends GPXTreeNode<TrackSegment> {
if (!this.extensions['gpx_style:line']) {
this.extensions['gpx_style:line'] = {};
}
if (style.color !== undefined && (force || this.extensions['gpx_style:line'].color === undefined)) {
this.extensions['gpx_style:line'].color = style.color.replace('#', '');
if (style["gpx_style:color"] !== undefined && (force || this.extensions['gpx_style:line']["gpx_style:color"] === undefined)) {
this.extensions['gpx_style:line']["gpx_style:color"] = style["gpx_style:color"].replace('#', '');
}
if (style.opacity !== undefined && (force || this.extensions['gpx_style:line'].opacity === undefined)) {
this.extensions['gpx_style:line'].opacity = style.opacity;
if (style["gpx_style:opacity"] !== undefined && (force || this.extensions['gpx_style:line']["gpx_style:opacity"] === undefined)) {
this.extensions['gpx_style:line']["gpx_style:opacity"] = style["gpx_style:opacity"];
}
if (style.weight !== undefined && (force || this.extensions['gpx_style:line'].weight === undefined)) {
this.extensions['gpx_style:line'].weight = style.weight;
if (style["gpx_style:weight"] !== undefined && (force || this.extensions['gpx_style:line']["gpx_style:weight"] === undefined)) {
this.extensions['gpx_style:line']["gpx_style:weight"] = style["gpx_style:weight"];
}
}

View File

@@ -34,7 +34,8 @@ export function parseGPX(gpxData: string): GPXFile {
return new Date(tagValue);
}
if (tagName === 'gpxtpx:atemp' || tagName === 'gpxtpx:hr' || tagName === 'gpxtpx:cad' || tagName === 'gpxpx:PowerInWatts' || tagName === 'opacity' || tagName === 'weight') {
if (tagName === 'gpxtpx:atemp' || tagName === 'gpxtpx:hr' || tagName === 'gpxtpx:cad' || tagName === 'gpxpx:PowerInWatts' ||
tagName === 'gpx_style:opacity' || tagName === 'gpx_style:weight') {
return parseFloat(tagValue);
}

View File

@@ -67,9 +67,9 @@ export type TrackExtensions = {
};
export type LineStyleExtension = {
color?: string;
opacity?: number;
weight?: number;
'gpx_style:color'?: string;
'gpx_style:opacity'?: number;
'gpx_style:weight'?: number;
};
export type TrackSegmentType = {

View File

@@ -16,9 +16,9 @@
<type>Cycling</type>
<extensions>
<gpx_style:line>
<color>#2d3ee9</color>
<opacity>0.5</opacity>
<weight>6</weight>
<gpx_style:color>2d3ee9</gpx_style:color>
<gpx_style:opacity>0.5</gpx_style:opacity>
<gpx_style:weight>6</gpx_style:weight>
</gpx_style:line>
</extensions>
<trkseg>