文本标记的 Vega 自定义样式

Question

所以像往常一样，我无法应用我在 Vega 文档中阅读的内容。好像少了几个部分或者不知道怎么读

问题：我有一个文本标记对应散点图中的一个点。想象一个红点，旁边写着 "Ferrari"。我想将文本设置为更大的样式和不同的颜色。

如果我转到 Vega 文档，转到标记部分，我会看到一个很有前途的属性：style 我读到：Style - - 一个字符串或字符串数组，指示要应用于标记的自定义样式的名称。样式是在配置中定义的标记属性默认值的命名集合。听起来很完美。

然后我继续在配置对象中创建以下内容：

config': {
      'axis': {
        'labelColor': '#b5bcc8',
        'labelFontSize': 15,
        'labelFont': '(quatro)',
        'titleColor': '#b5bcc8',
        'titleFontSize': 15,
        'titleFont': '(quatro)',
        'titlePadding': 20,
        'tickColor': '#b5bcc8',
        'domainColor': '#b5bcc8'
      },
      'custom': {
        'textFontSize': 22
      }
}

然后将此自定义样式应用于文本标记，如建议的那样：

{
   'name': 'product_label',
   'type': 'text',
   'from': { 'data': 'salesData' },
   'style': 'custom',
   'encode': {
      'enter': {
         'x': { 'scale': 'x', 'field': 'month', 'offset': 8 },
         'y': { 'scale': 'y', 'field': 'salesTotal', 'offset': -5 },
            'text': { 'field': 'name' },
            'fill': { 'value': 'black' }
        }
      }
  }

当然，我在这里做了很多假设，因为我没有这方面的例子。我假设 named collection 表示一个对象。我假设 textFontSize 是 Vega 的有效对象属性。但这些假设也可能是错误的。

Answer 1

好吧，和往常一样，事实证明我不会看文档。所以样式配置就在配置部分下面：

https://vega.github.io/vega/docs/config/#style

基本上，我所做的是在文档示例中创建了这个自定义样式：

'style': {
   'custom': {
     'fontSize': 16
    }
 }

...然后将其应用到我的文本标记中，如上例所示。

文本标记的 Vega 自定义样式

Vega custom style for text mark

data-visualization

vega