Интерактивный график Vega-Lite / Vega с выбором

Question

Я пытаюсь создать интерактивную панель инструментов vega-lite, где у меня есть ссылка на редактор карты мира vega

Исходя из выбора страны, я пытаюсь отобразить другой график ниже (vconcat или за его пределами)

Можно ли сделать это вне этой диаграммы, не используя vconcat, или я могу сделать это только через vconcat?

Кто-нибудь пробовал что-то подобное?

Answer 1

Самый простой будет создать с vconcat,

Тем не менее, есть способ прочитать базовый сигнал Vega выбора. Затем вы можете использовать API Vega View для запуска обратного вызова, который показывает другую диаграмму на основе выбранных данных.

Answer 2

Теперь вы можете использовать наблюдаемые записные книжки для достижения желаемого.

Вы создаете свою первую диаграмму в ячейке, связываете ее со второй ячейкой, а затем экспортируете ячейки на свой веб-сайт.

Вот как начать с наблюдаемого

Вот центральная часть кода

letter_selected = Generators.observe(
  // selection_caught will (yield) a value promise with the selected letters
  function initialize_f(change_) {
    // creating an event listener (ie a function to attach to some DOM element)
    const signaled = (name, value) => change_(value);

    // attaching the event listener and naming it "test_selection"
    barChart.addSignalListener("test_selection", signaled);

    // check the doc ... https://github.com/observablehq/stdlib
    change_(barChart.signal("test_selection"));

    function dispose_f() {
      return barChart.removeSignalListener("test_selection", signaled);
    }

    return dispose_f;
  }
)