Vega-Lite — ошибка в масштабах окружностей и линий

#visualization #scale #vega-lite

#визуализация #масштаб #vega-lite

Вопрос:

Я пытаюсь использовать Vega-Lite для построения графика, похожего на график, где узлы соединены с другими узлами ребрами. Узлы различаются по размеру в зависимости от переменной, в то время как ширина ребер также варьируется. Информация для узлов хранится в другом наборе данных, чем информация для ребер.

Проблема в том, что как только я пытаюсь построить все вместе («узлы» «ребра»), Vega-Lite отмечает размер узлов очень маленьким (почти не видимым). Если я не использую «размер» для своего графика ребер, все получается нормально.

Вот пример того, что я делаю (обратите внимание, что нотация немного отличается от родной Vega-Lite, потому что я программирую на Julia):

 v1 = @vlplot(
    mark={:circle,opacity=1},
    x={μ[:,1],type="quantitative",axis=nothing},
    y={μ[:,2],type="quantitative",axis=nothing},
    width=600,
    height=400,
    size={μ_n,legend=nothing,type="q"})
v2 = @vlplot(
    mark={"type"=:circle,color="red",opacity=1},
    x={ν[:,1],type="quantitative",axis=nothing},
    y={ν[:,2],type="quantitative",axis=nothing},
    width=600,
    height=400,
    size={ν_m,legend=nothing,type="q"})
  

введите описание изображения здесь

Затем, когда я создаю визуализацию для ребер и строю все вместе:

 v3 = @vlplot(
    mark={"type"=:line,color="black",clip=false},
    data = df,
    encoding={
    x={"edges_x:q",axis=nothing},
    y={"edges_y:q",axis=nothing},
    opacity={"ew:q",legend=nothing},
    size={"ew:q",scale={range=[0,2]},legend=nothing},
    detail={"pe:o"}},
    width=600,
    height=400
)
@vlplot(view={stroke=nothing}) v3 v2 v1
  

введите описание изображения здесь

Есть идеи о том, почему это происходит и как это исправить?
(Обратите внимание, что атрибут «scale» не является причиной. Даже если я удалю ее, проблема не исчезнет).

Ответ №1:

При визуализации составных диаграмм Vega-Lite по умолчанию использует общие масштабы (см. https://vega.github.io/vega-lite/docs/resolve.html ): похоже, что когда ваш size масштаб распределяется между линейным и круговым графиками, это приводит к плохим результатам.

Я не знаком с VegaLite.jl синтаксисом, но спецификация JSON, которую вы хотите использовать на диаграмме верхнего уровня, такова:

  "resolve": {"scale": {"size": "independent"}}