QT QML - Changing Mapbox font size

问题

I'm using QT 5.12.4 with the MapboxGl plugin and I'm trying to figure out how to make the street names display in a larger font but I'm very confused about how to specify a text size. I need to change the size dynamically so using a predefined style is not going to meet the requirements.

The two confusing aspects are that Mapbox's documentation has to be translated into "MapParameters" for QML and I'm clueless as to what exactly is needed to change the text size. Between reading through the documentation and playing with the mapbox studio it seems like I need to modify the "road-label" layer. If anyone has some sample code of how to change the text size I would really appreciate it if you could share.

https://docs.mapbox.com/mapbox-gl-js/style-spec/#layout-symbol-text-size

  MapParameter 
  {
      type: "layout"

      property var layer: "road-label"
      property var textSize: 20
  }

回答1:

What you did looks correct. You need to define a MapParameter with the type layout because the text-size is a layout property in the Mapbox Style Specification. We cannot use - on QML variable names, so we camelCase it to textSize. After that you can bind textSize to anything you want.

You need to make sure that the layer road-label exists on the style at the moment the MapParameter is added.

回答2:

I solved the problem and the key was getting the JSON for the predefined style that I was using (navigation-preview-day-v2). This post showed me how to get the pre-defined sytle:

URL for Mapbox style sheet JSON

For the navigation-preview-day-v2 style, the URL would be: https://api.mapbox.com/styles/v1/mapbox/navigation-preview-day-v2?access_token=(your token here)

Run the JSON through a formatter so you can read it and find the layer(s) where the street names are rendered. In this case, there are four layers:

road-label-small
road-label-medium
road-label-large
road-label-extra-large

Here is an example of how to form the MapParameter in QML for the font size:

MapParameter
{
    type: "layout"
    property var layer: "road-label-large"
    property var textSize:
    {
       "base": 1,
       "stops":
       [
          [9, 10],
          [20, 16]
       ]
    }
}

You can also import the JSON into Mapbox Studio to review or manipulate the style. In my case I wanted to dynamically scale the font size so in my QML I added a scale factor and the resulting MapParameter is:

MapParameter
{
    type: "layout"
    property var layer: "road-label-large"
    property var textSize:
    {
       "base": 1,
       "stops":
       [
          [9, Math.floor(10 * fontScaleFactor)],
          [20, Math.floor(16 * fontScaleFactor)]
       ]
    }
}

来源：https://stackoverflow.com/questions/59446043/qt-qml-changing-mapbox-font-size

标签

qml

mapbox