mapbox-change-font.md

Changing the font in a mapboxgl map is really only possible by using a font in the Mapbox Studio system.

      // map.current.setLayoutProperty(
      //   "country-label",
      //   "text-size",
      //   originalSize * Number(e.target.value)
      // );
      // map.current.getLayoutProperty()
      console.log(map.current);
      const labelTypes: string[] = map.current.style._order.filter((a) =>
        a.includes("label")
      );
      console.log("labelTypes", labelTypes);
      // console.log(map.current);
      labelTypes.forEach((labelType: string) => {
        const existing = map.current?.getLayoutProperty(
          labelType,
          "text-field"
        );
        console.log("existing value for", labelType, existing);
        // map.current?.setLayoutProperty(labelType, "text-field", [
        //   "format",
        //   // ["get", "name_en"],
        //   // { "font-scale": 1.2 },
        //   // "\n",
        //   // {},
        //   ["get", "name"],
        //   {
        //     "text-font": [
        //       "literal",
        //       ["DIN Offc Pro Italic", "Arial Unicode MS Regular"],
        //     ],
        //   },
        // ]);
        map.current?.setLayoutProperty(labelType, "text-font", [
          "spirit-condensed",
          "DIN Offc Pro Italic",
          "Arial Unicode MS Regular",
        ]);
      });

This was a way to hack around it, but it does not work because the fonts are indexed from Mapbox servers on their assumption that you only use their assets. Fonts from foundaries might not allow this usage pattern.