Я только начинаю с react-vega и боюсь, что мне может не хватать чего-то очень простого. Он отлично работает, когда у меня есть встроенные данные, но при передаче данных компоненту я получаю совсем другое поведение.

Так что это работает именно так, как я ожидал:

 function App() { const spec = { "$schema": "https://vega.github.io/schema/vega-lite/v4.json", "data": { "values": [ {"ElapsedTime": 0.0017, "RPM": 11700}, {"ElapsedTime": 0.005, "RPM": 11940}, {"ElapsedTime": 0.0083, "RPM": 12000} ] }, "mark": "line", "encoding": { "x": {"field": "ElapsedTime", "type": "quantitative"}, "y": {"field": "RPM", "type": "quantitative"} } }; return ( {amp}lt;Vega spec={spec} /{amp}gt; ); } 

Дать следующий результат:

верный

Я ожидаю, что следующее даст точно такой же результат:

 function App() { const spec = { "$schema": "https://vega.github.io/schema/vega-lite/v4.json", "data": {"name": "table"}, "mark": "line", "encoding": { "x": {"field": "ElapsedTime", "type": "quantitative"}, "y": {"field": "RPM", "type": "quantitative"} } }; const data = { "table": [ {"ElapsedTime": 0.0017, "RPM": 11700}, {"ElapsedTime": 0.005, "RPM": 11940}, {"ElapsedTime": 0.0083, "RPM": 12000} ] } return ( {amp}lt;Vega spec={spec} data={data} /{amp}gt; ); } 

Но он генерирует это вместо этого:

некорректный

(обратите внимание на отсутствующие легенды и усеченные метки оси). Кроме того, в консоли выдается следующее предупреждение:

 WARN – "Infinite extent for field "ElapsedTime": [Infinity, -Infinity]" WARN – "Infinite extent for field "RPM": [Infinity, -Infinity]" 

Я упускаю что-то очень простое, я уверен, но я не могу понять, что.