Vegalite 日线图摆动

Posted 2023-02-16

【中文标题】Vegalite 日线图摆动

【英文标题】：Vegalite daily line chart wobble

【发布时间】：2017-08-26 17:04:16

【问题描述】：

我遇到了 vegalite 的问题，即当线条应该是直的并且日期不等间距时，图表会显示“摇摆不定的线条”。

任何人都可以验证这是一个错误，还是我在规范中犯了错误？ .

我发现当你增加数据点的数量时，这个问题会变得更加严重。

要复制此问题，请将以下规范粘贴到 vega lite editor：

  "description": "",
  "data": 
    "values": [
      
        "date": "2017-01-23",
        "value": 100
      ,
      
        "date": "2017-01-24",
        "value": 200
      ,
      
        "date": "2017-01-25",
        "value": 300
      ,
      
        "date": "2017-01-26",
        "value": 400
      ,
      
        "date": "2017-01-27",
        "value": 500
      ,
      
        "date": "2017-01-28",
        "value": 600
      ,
      
        "date": "2017-01-29",
        "value": 700
      ,
      
        "date": "2017-01-30",
        "value": 800
      ,
      
        "date": "2017-01-31",
        "value": 900
      ,
      
        "date": "2017-02-01",
        "value": 1000
      ,
      
        "date": "2017-02-02",
        "value": 1100
      ,
      
        "date": "2017-02-03",
        "value": 1200
      ,
      
        "date": "2017-02-04",
        "value": 1300
      ,
      
        "date": "2017-02-05",
        "value": 1400
      ,
      
        "date": "2017-02-06",
        "value": 1500
      ,
      
        "date": "2017-02-07",
        "value": 1600
      
    ]
  ,
  "mark": "line",
  "encoding": 
    "x": 
      "field": "date",
      "type": "temporal"
    ,
    "y": 
      "field": "value"
    
  ,
  "config": [],
  "embed": 
    "renderer": "canvas",
    "actions": 
      "export": false,
      "source": false,
      "editor": false
    
  

编辑：后续 - 在 Altair 中进行实验，似乎与日期方面无关。以下两个代码块都会遇到同样的问题：

import pandas as pd
import numpy as np
from altair import *

s1 = pd.date_range(start="2017-01-23", end="2020-02-07")
s2  = np.arange(1,len(s1)+1)*100
df = pd.DataFrame("date":s1, "value":s2)

Chart(df).mark_line(
).encode(
    x='date',
    y='value'
)

和

import pandas as pd
import numpy as np
from altair import *

s1 = np.arange(1,1000,1)
s2  = np.arange(1,len(s1)+1)*100
df = pd.DataFrame("x":s1, "value":s2)

Chart(df).mark_line(
).encode(
    x='x',
    y='value'
)

相反，以下产生了一个平滑的图（pandas 和 matplotlib）：

%matplotlib inline
df.plot('date', 'value')

【参考方案1】：

摆动是由于在计算与数据值相关的像素坐标期间舍入误差的影响。

查看vega-lite 生成的vega 代码，可以看到已定义scales 的"round": true 条目。将其更改为 false 可以解决我屏幕上的问题，并使 vega-lite 这样做，也可以通过添加：

"config": "scale": "round" : false,

而不是

"config": [],

vega-lite 规范中的行。

【讨论】：

非常感谢！如果有人在使用 Altair 并看到此内容，您可以使用 Chart(df).configure_scale( round=False)

将其传递给 Vega

...并且在 R vegalite 包中，您必须手动添加它，即 vl <- vegalite::vegalite() 等，一旦创建了 vl 列表，您就可以执行 vl$x$config$scale$round <- FALSE

这看起来像一个错误，我们将在 Vega-Lite 中修复它（我是 Vega-Lite 团队成员）。