Боке это: Использование фона боке на фотографии

 с выставки импорта bokeh.io
из bokeh.models импортировать Div

div = Div (text = "" "Ваш  HTML  -поддерживаемый текст инициализируется  текстом  аргумент.В
оставшиеся аргументы div -  ширина  и  высота . В этом примере эти значения
равны  200  и  100  соответственно. "" ",
ширина = 200, высота = 100)

показать (div)
 

Дополнительную информацию можно найти в Справочнике по Div .

Раскрывающийся список

Кнопка , которая отображает раскрывающийся список взаимоисключающих элементов, когда щелкнул.

 с выставки импорта bokeh.io
из боке.модели импортируют CustomJS, Dropdown

menu = [(«Элемент 1», «элемент_1»), («Элемент 2», «элемент_2»), Нет, («Элемент 3», «элемент_3»)]

dropdown = Dropdown (label = "Кнопка раскрывающегося списка", button_type = "warning", menu = menu)
dropdown.js_on_event ("menu_item_click", CustomJS (code = "console.log ('dropdown:' + this.item, this.toString ())"))

показать (раскрывающийся список)
 

Дополнительную информацию можно найти в Справочнике по Dropdown .

FileInput

Виджет, позволяющий пользователям выбирать файл и сохранять его содержимое.

 с выставки импорта bokeh.io
из bokeh.models импортировать FileInput

file_input = FileInput ()

показать (file_input)
 

Дополнительную информацию можно найти в Справочнике по FileInput .

MultiChoice

Виджет с множественным выбором для представления нескольких доступных опций в компактном горизонтальная планировка:

 с выставки импорта bokeh.io
из bokeh.models импортировать CustomJS, MultiChoice

OPTIONS = ["foo", "bar", "baz", "quux"]

multi_choice = MultiChoice (значение = ["foo", "baz"], options = OPTIONS)
multi_choice.js_on_change ("значение", CustomJS (code = "" "
    console.log ('multi_choice: value =' + this.value, this.toString ())
"" "))

показать (multi_choice)
 

Дополнительную информацию можно найти в Справочнике по MultiChoice .

MultiSelect

Виджет с множественным выбором для отображения нескольких доступных опций в вертикальном списке:

 с выставки импорта bokeh.io
из bokeh.models импортировать CustomJS, MultiSelect

OPTIONS = [("1", "foo"), ("2", "bar"), ("3", "baz"), ("4", "quux")]

multi_select = MultiSelect (значение = ["1", "2"], options = OPTIONS)
выбор из нескольких вариантов.js_on_change ("значение", CustomJS (code = "" "
    console.log ('multi_select: value =' + this.value, this.toString ())
"" "))

показать (multi_select)
 

Дополнительную информацию можно найти в Справочнике по MultiSelect .

Пункт

Виджет для отображения блока текста в теге HTML

:

 с выставки импорта bokeh.io
из bokeh.models import Абзац

p = Абзац (text = "" "Ваш текст инициализируется аргументом" текст ".
оставшиеся аргументы абзаца - это «ширина» и «высота».В этом примере эти значения
равны 200 и 100 соответственно. "" ",
ширина = 200, высота = 100)

показать (p)
 

Дополнительную информацию можно найти в ссылке на , пункт .

Вход пароля

Текстовый ввод, скрывающий введенный текст:

 с выставки импорта bokeh.io
из bokeh.models импортировать CustomJS, PasswordInput

password_input = PasswordInput (placeholder = "введите пароль ...")
password_input.js_on_change ("значение", CustomJS (code = "" "
    консоль.log ('ввод_пароля: значение =' + this.value, this.toString ())
"" "))

показать (password_input)
 

Дополнительную информацию можно найти в Справочнике по PasswordInput .

Претекст

Виджет для отображения блока предварительно отформатированного текста в теге HTML

: 

 
 с выставки импорта bokeh.io
from bokeh.models импортировать PreText

pre = PreText (text = "" "Ваш текст инициализируется аргументом" текст ".

Остальные аргументы Paragraph - это «ширина» и «высота».В этом примере
эти значения равны 500 и 100 соответственно. "" ",
ширина = 500, высота = 100)

показать (предварительно)
 
 Дополнительную информацию можно найти в Справочнике по  PreText .
 RadioButtonGroup 
 В группе радиокнопок может быть не более одной выбранной кнопки одновременно:
 с выставки импорта bokeh.io
из bokeh.models импортировать CustomJS, RadioButtonGroup

LABELS = ["Вариант 1", "Вариант 2", "Вариант 3"]

radio_button_group = RadioButtonGroup (метки = МЕТКИ, активные = 0)
radio_button_group.js_on_click (CustomJS (code = "" "
    console.log ('radio_button_group: active =' + this.active, this.toString ())
"" "))

показать (radio_button_group)
 
 Дополнительную информацию можно найти в Справочнике по  RadioButtonGroup .
 RadioGroup 
 Радиогруппа использует стандартный внешний вид радиокнопки:
 с выставки импорта bokeh.io
из bokeh.models импортировать CustomJS, RadioGroup

LABELS = ["Вариант 1", "Вариант 2", "Вариант 3"]

radio_group = RadioGroup (метки = МЕТКИ, активные = 0)
radio_group.js_on_click (CustomJS (code = "" "
    console.log ('radio_group: active =' + this.active, this.toString ())
"" "))

показать (radio_group)
 
 Дополнительную информацию можно найти в Справочнике по  RadioGroup .
 RangeSlider 
 Ползунок диапазона боке может быть настроен со значениями  start  и  end , размером шага  ,
начальное значение   и заголовок  :
 с выставки импорта bokeh.io
из bokeh.models импортировать CustomJS, RangeSlider

range_slider = RangeSlider (начало = 0, конец = 10, значение = (1,9), шаг =.1, title = "Материал")
range_slider.js_on_change ("значение", CustomJS (code = "" "
    console.log ('range_slider: value =' + this.value, this.toString ())
"" "))

показать (range_slider)
 
 Дополнительную информацию можно найти в Справочнике по  RangeSlider .
 Выбрать 
 Виджет одиночного выбора:
 с выставки импорта bokeh.io
из bokeh.models импортируйте CustomJS, выберите

select = Select (title = "Option:", value = "foo", options = ["foo", "bar", "baz", "quux"])
Выбрать.js_on_change ("значение", CustomJS (code = "" "
    console.log ('select: value =' + this.value, this.toString ())
"" "))

показать (выбрать)
 
 Дополнительную информацию можно найти в Справочнике по  Select .
 Слайдер 
 Ползунок Bokeh можно настроить со значениями  start  и  end , размером шага  ,
начальное значение   и заголовок  :
 с выставки импорта bokeh.io
из bokeh.models импортировать CustomJS, Slider

slider = Slider (начало = 0, конец = 10, значение = 1, шаг =.1, title = "Материал")
slider.js_on_change ("значение", CustomJS (code = "" "
    console.log ('слайдер: значение =' + this.value, this.toString ())
"" "))

показать (слайдер)
 
 Дополнительную информацию можно найти в Справочнике по  Slider .
 Вертушка 
 Виджет числового счетчика:
 импортировать numpy как np

из импортного шоу bokeh.io
from bokeh.layouts импортировать столбец, строку
из bokeh.models import Spinner
из bokeh.plotting импортная фигура

x = np.random.rand (10)
y = np. random.ранд (10)

p = фигура (x_range = (0, 1), y_range = (0, 1))
points = p.scatter (x = x, y = y, size = 4)

spinner = Spinner (title = "Размер символа", низкий = 1, высокий = 40, шаг = 0,5, значение = 4, ширина = 80)
spinner.js_link ('значение', points.glyph, 'размер')

show (row (column (spinner, width = 100), p))
 
 Дополнительную информацию можно найти в Справочнике по  Spinner .
 Вкладки 
 Панели вкладок позволяют отображать несколько графиков или макетов на выбираемых вкладках:
 с выставки импорта bokeh.io
из боке.Панель импорта моделей, вкладки
из bokeh.plotting импортная фигура

p1 = цифра (ширина = 300, высота = 300)
p1.circle ([1, 2, 3, 4, 5], [6, 7, 2, 4, 5], size = 20, color = «темно-синий», альфа = 0,5)
tab1 = Панель (child = p1, title = "circle")

p2 = цифра (ширина = 300, высота = 300)
p2.line ([1, 2, 3, 4, 5], [6, 7, 2, 4, 5], line_width = 3, color = "темно-синий", альфа = 0,5)
tab2 = Panel (child = p2, title = "line")

показать (Tabs (tabs = [tab1, tab2]))
 
 Дополнительную информацию можно найти в Справочнике по вкладкам  .
 TextAreaInput 
 Виджет для сбора нескольких строк текста от пользователя:
 из боке.io импорт шоу
из bokeh.models импортировать CustomJS, TextAreaInput

text_area_input = TextAreaInput (значение = "по умолчанию", строк = 6, title = "Ярлык:")
text_area_input.js_on_change ("значение", CustomJS (code = "" "
    console.log ('text_area_input: value =' + this.value, this.toString ())
"" "))

показать (text_area_input)
 
 Дополнительную информацию можно найти в Справочнике по  TextAreaInput .
 TextInput 
 Виджет для сбора строки текста от пользователя:
 из боке.io импорт шоу
из bokeh.models импортировать CustomJS, TextInput

text_input = TextInput (значение = "по умолчанию", title = "Ярлык:")
text_input.js_on_change ("значение", CustomJS (code = "" "
    console.log ('text_input: value =' + this.value, this.toString ())
"" "))

показать (text_input)
 
 Дополнительную информацию можно найти в Справочнике по  TextInput .
 Переключить 
 Кнопка переключения удерживает состояние включения / выключения:
 с выставки импорта bokeh.io
из bokeh.models импортировать CustomJS, Toggle

toggle = Toggle (label = "Foo", button_type = "success")
переключать.js_on_click (CustomJS (code = "" "
    console.log ('toggle: active =' + this.active, this.toString ())
"" "))

показать (переключить)
 
 Дополнительную информацию можно найти в Справочнике по  Toggle .
 Запуск сервера Bokeh - Bokeh 2.4.2 Документация 
 Назначение 
 Примечание
 Для облегчения использования данного руководства рассмотрите возможность ознакомления
ознакомьтесь с некоторыми из основных концепций боке в разделе
Определение ключевых понятий.
 Сервер
 Bokeh позволяет легко создавать интерактивные веб-приложения, которые подключаются
события внешнего интерфейса для запуска кода Python.
 Bokeh создает высокоуровневые модели Python, такие как графики, диапазоны, оси и
глифы, а затем преобразует эти объекты в JSON, чтобы передать их своему клиенту.
библиотека, BokehJS. Для получения дополнительной информации о последнем см.
Содействие BokehJS.
 Эта гибкая и несвязанная конструкция дает некоторые преимущества. Например, это
легко иметь другие языки, такие как R или Scala, управлять графиками Bokeh и
визуализации в браузере.
 Однако поддержание синхронизации этих моделей между средой Python и
браузер предоставит дополнительные мощные возможности:
 реагировать на события пользовательского интерфейса и инструментов в браузере вычислениями или запросами
используя всю мощь Python
 автоматически подталкивает серверные обновления к элементам пользовательского интерфейса, таким как виджеты или
графики в браузере
 использовать периодические, тайм-аут и асинхронные обратные вызовы для управления потоковыми обновлениями
 Вот где вступает в игру сервер Bokeh:
  Основное назначение сервера Bokeh - синхронизация данных между
базовая среда Python и библиотека BokehJS, работающая в браузере.
 Вот простой пример с demo.bokeh.org, который иллюстрирует это поведение.
 Манипулирование элементами управления пользовательского интерфейса передает новые значения в серверную часть через Bokeh
сервер. Это также запускает обратные вызовы, которые обновляют графики с вводом в
в реальном времени.
 Сценарии использования 
 Рассмотрим несколько различных сценариев использования сервера Bokeh.
 Местное или индивидуальное пользование 
 Возможно, вы захотите использовать сервер Bokeh для исследовательского анализа данных, возможно
в записной книжке Jupyter или в небольшом приложении, которое вы и ваши коллеги можете запустить
локально.
 Сервер Bokeh здесь очень удобен, позволяя быстро и просто
развертывание за счет эффективного использования серверных приложений Bokeh. Для большего
подробнее см. Создание приложений с эффектом боке.
 Создание развертываемых приложений 
 Вы также можете использовать сервер Bokeh для публикации интерактивных данных.
визуализации и приложения для более широкой аудитории, например, в Интернете
или внутренняя сеть компании. Сервер Bokeh также хорошо подходит для этого использования,
но вы можете сначала проконсультироваться со следующим:
 Совместная публикация 
 В обоих сценариях  один человек  подает заявки на
сервер, либо для личного использования, либо для потребления более широкой аудиторией.
 Пока можно  несколько человек  публиковать разные приложения
на тот же сервер, , это не является хорошим вариантом использования , потому что размещенный
приложения могут выполнять произвольный код Python. Это повышает изоляцию процесса
и соображения безопасности, что делает такую ​​совместную аренду недопустимой.
 Один из способов поддержки такой среды с несколькими приложениями с несколькими
пользователи должны создать инфраструктуру, которая может запускать сервер Bokeh для каждого приложения или
хотя бы для каждого пользователя.Проект Bokeh или третье лицо может создать
общественная услуга для такого использования в будущем, но такие разработки
выходит за рамки данной документации.
 Другая возможность - иметь одно приложение, которое может получать доступ к данным и другим артефактам.
опубликовано многими разными людьми, возможно, с контролем доступа. Такого рода
сценарий  возможен с сервером Bokeh , но часто включает его интеграцию
с другими фреймворками веб-приложений.
 Создание приложений с эффектом боке 
 Безусловно, самый гибкий способ создания интерактивных визуализаций данных с
сервер Bokeh должен создавать приложения Bokeh и обслуживать их с  боке обслуживают  команды.Затем сервер Bokeh использует код приложения для
создавать сеансы и документы для всех подключающихся браузеров.
 Сервер боке (слева) использует код приложения для создания боке.
документы. Каждое новое соединение из браузера (справа) приводит к
сервер создает новый документ только для этого сеанса.
 Сервер Bokeh выполняет код приложения при каждом новом подключении и
создает новый документ Bokeh, синхронизируя его с браузером. Код приложения
также настраивает обратные вызовы, которые должны запускаться всякий раз, когда свойства, такие как виджет
ценности, изменение.
 Вы можете предоставить код приложения несколькими способами.
 Одномодульный формат 
 Рассмотрим следующий полный пример.
 # myapp.py

из случайного импорта случайный

из столбца импорта bokeh.layouts
из кнопки импорта bokeh.models
из bokeh.palettes import RdYlBu3
из боке. построение импортного рисунка, творог

# создать сюжет и стилизовать его свойства
p = фигура (x_range = (0, 100), y_range = (0, 100), toolbar_location = None)
p.border_fill_color = 'черный'
p.background_fill_color = 'черный'
п.outline_line_color = Нет
p.grid.grid_line_color = Нет

# добавить средство визуализации текста на график (пока нет данных)
r = p.text (x = [], y = [], text = [], text_color = [], text_font_size = "26px",
           text_baseline = "средний", text_align = "центр")

я = 0

ds = r.data_source

# создаем обратный вызов, который добавляет число в случайное место
def callback ():
    глобальный я

    # ЛУЧШАЯ ПРАКТИКА --- обновите .data за один шаг с новым dict
    new_data = dict ()
    новые_данные ['x'] = ds.data ['x'] + [random () * 70 + 15]
    new_data ['y'] = дс.данные ['y'] + [случайный () * 70 + 15]
    new_data ['text_color'] = ds.data ['text_color'] + [RdYlBu3 [i% 3]]
    new_data ['текст'] = ds.data ['текст'] + [str (i)]
    ds.data = new_data

    я = я + 1

# добавляем виджет кнопки и настраиваем с обратным вызовом
button = Кнопка (label = "Нажми меня")
button.on_click (обратный вызов)

# поместите кнопку и график в макет и добавьте в документ
curdoc (). add_root (столбец (кнопка, p))
 
 В приведенном выше коде не указаны какие-либо методы вывода или подключения. Это простой
скрипт, который создает и обновляет объекты.Инструмент командной строки  bokeh  позволяет
вы указываете параметры вывода после обработки ваших данных. Вы могли бы, например,
запустите  bokeh json myapp.py , чтобы получить сериализованную версию приложения в формате JSON.
Однако для запуска приложения на сервере Bokeh используйте следующую команду:
 подача боке - показать myapp.py
 
 Параметр  --show  заставит ваш браузер по умолчанию открыть новую вкладку в
адрес запущенного приложения, который в данном случае:
 http: // локальный: 5006 / myapp
 
 Если у вас только одно приложение, корень сервера будет перенаправлять на него.В противном случае вы увидите индекс всех приложений, запущенных на сервере.
корень:
 Вы можете отключить этот индекс с помощью опции  --disable-index . Точно так же вы
можно отключить перенаправление с помощью параметра  --disable-index-redirect .
 Помимо создания приложений Bokeh из отдельных файлов Python, вы можете
также создавать приложения из каталогов.
 Формат каталога 
 Вы можете создавать приложения Bokeh, создавая и заполняя каталог файловой системы
с файлами приложения.Чтобы запустить приложение в каталоге с именем  myapp ,
вы можете выполнить  bokeh serve  следующим образом:
 Этот каталог должен содержать файл  main.py , который создает документ для
обслуживаемый сервер Bokeh:
 Ниже представлена ​​структура приложения каталога, знакомая серверу Bokeh.
с:
 myapp
   |
   + ---__ init__.py
   + --- app_hooks.py
   + --- main.py
   + --- request_handler.py
   + --- статический
   + --- theme.yaml
   + --- шаблоны
        + --- index.html
 
 Некоторые файлы и подкаталоги, указанные выше, являются необязательными.
 Файл  __init__.py , который отмечает этот каталог как пакет. Ты можешь сделать
import относительно пакета, например  из. импортировать mymod  и  из .mymod import func .
 Файл  request_handler.py , который позволяет вам объявить необязательную функцию для
обрабатывать HTTP-запросы и возвращать словарь элементов, которые токен сеанса
включает, как описано в разделе "Перехватчики обработчика запросов".
 Файл  app_hooks.py , который позволяет запускать необязательные обратные вызовы в разных
этапы выполнения заявки, как описано в
Крючки жизненного цикла и
Крючки обработчика запросов.
 Подкаталог  static , который можно использовать для обслуживания статических ресурсов
связанный с этим приложением.
 Файл темы  theme.yaml , в котором вы можете объявить атрибуты по умолчанию для боке, чтобы
применяются к типам моделей.
 Подкаталог шаблонов   с индексом .html  Файл шаблона Jinja. В
каталог может содержать дополнительные шаблоны Jinja для  index.html  для ссылки
к. Шаблон должен иметь те же параметры, что и  ФАЙЛ  шаблон. Для получения дополнительной информации см.
Настройка шаблона Jinja приложения.
 При запуске  main.py  сервер Bokeh гарантирует, что стандартный  __file__ Атрибут модуля  работает должным образом. Итак, вы можете включить
файлы данных или пользовательские пользовательские модели в вашем каталоге, как вам нравится.
 Bokeh также добавляет каталог приложения  sys.path  для облегчения импорта
модулей Python в каталоге приложения. Однако если  __init__.py  находится в каталоге, вы можете использовать приложение как пакет, а также сделать стандартный
пакетный импорт.
 Вот пример более развитого дерева каталогов:
 myapp
   |
   + ---__ init__.py
   |
   + --- app_hooks.py
   + --- данные
   | + --- things.csv
   |
   + --- helpers.py
   + --- main.ру
   | --- модели
   | + --- custom.js
   |
   + --- request_handler.py
   + --- статический
   | + --- css
   | | + --- special.css
   | |
   | + --- изображения
   | | + --- foo.png
   | | + --- bar.png
   | |
   | + --- js
   | + --- special.js
   |
   | --- шаблоны
   | + --- index.html
   |
   + --- theme.yaml
 
 В этом случае ваш код может быть похож на следующий:
 из os.path import dirname, присоединиться
из .helpers import load_data

load_data (join (dirname (__ file__), 'data', 'things.csv '))
 
 Код для загрузки реализации JavaScript для пользовательской модели из  models / custom.js  тоже похож.
 Настройка шаблона Jinja приложения 
 В разделе формата каталога упоминается, что вы
может переопределить шаблон Jinja по умолчанию, который сервер Bokeh использует для
генерировать ориентированный на пользователя HTML.
 Это позволяет использовать CSS и JavaScript для настройки внешнего вида приложения.
в браузере.
 Подробнее о том, как работает шаблон Jinja, см.
Проектная документация Jinja.
 Вложение фигур в шаблон 
 Чтобы ссылаться на фигуру Боке в шаблонном коде, вам необходимо указать ее имя   атрибут и добавьте фигуру в корень текущего документа в основном потоке
ваше приложение Bokeh, то есть  main.py .
 из bokeh.plotting import curdoc

# шаблоны могут ссылаться на настроенное значение имени
plot = figure (name = "bokeh_jinja_figure")

curdoc (). add_root (сюжет)
 
 Затем вы можете использовать это имя в соответствующем шаблоне Jinja для ссылки на
рисунок через  корни  параметр шаблона следующим образом:
 {% расширяет базу%}

{% содержимого блока%}

    {{вставлять (корни.bokeh_jinja_figure)}}

{% endblock%}
 
 Определение пользовательских переменных 
 Вы можете передать пользовательские переменные в шаблон с помощью  curdoc (). Template_variables  словарь следующим образом:
 # установить новую одиночную пару ключ / значение
curdoc (). template_variables ["user_id"] = user_id

# или обновить сразу несколько пар
curdoc (). template_variables.update (first_name = "Мэри", last_name = "Jones")
 
 Затем вы можете ссылаться на переменные в соответствующем шаблоне Jinja.
 {% расширяет базу%}

{% содержимого блока%}

    
 Здравствуйте, {{user_id}}, он же "{{last_name}}, {{first_name}}"! 

{% endblock%}
 
 Доступ к HTTP-запросам 
 При создании сеанса для приложения Bokeh создает контекст сеанса
доступно как  curdoc (). session_context . Самая полезная функция
контекст сеанса должен сделать объект HTTP-запроса Tornado доступным для
приложение как  session_context.запрос . HTTP-запросы недоступны
напрямую из-за несовместимости с  --num-procs . Вместо этого только  arguments  Атрибут доступен полностью и только подмножество файлов cookie   и  заголовки , разрешенные  --include-headers ,  --exclude-headers ,  - доступны параметры --include-cookies  и  --exclude-cookies .
Попытка получить доступ к любому другому атрибуту в запросе   приводит к ошибке.
 Вы можете включить дополнительные атрибуты запроса, как описано в
Крючки обработчика запросов.
 Следующий код обращается к запросу  аргументов , чтобы предоставить значение для
переменная  N , которая может, например, управлять количеством точек графика.
 # request.arguments - это указатель, который отображает имена аргументов в списки строк,
# например, строка запроса? N = 10 дает {'N': [b'10 ']}

args = curdoc (). session_context.request.arguments

пытаться:
  N = int (аргументы.получить ('N') [0])
Кроме:
  N = 200
 
 Предупреждение
 Объект запроса упрощает проверку значений, таких как  аргументов .
Однако вызов любого из методов Tornado, например  finish ()  или
запись непосредственно в запрос . соединение  не поддерживается и приводит к
неопределенное поведение.
 Крюки обработчика запросов 
 Для предоставления дополнительной информации, когда полные HTTP-запросы Tornado не могут быть
доступно, вы можете определить собственный обработчик.
 Для этого создайте приложение в формате каталога и
включить в каталог файл с именем  request_handler.py . Этот файл должен
включить функцию  process_request .
 def process_request (запрос):
    '' 'Если присутствует, эта функция выполняется при поступлении HTTP-запроса.' ''
    возвращение {}
 
 Затем процесс передает HTTP-запросы Tornado обработчику, который возвращает
словарь для  curdoc (). session_context.token_payload . Это позволяет вам работать
по некоторым из проблем  --num-procs  и предоставьте дополнительную информацию.
 Обратные вызовы и события 
 Прежде чем переходить к обратным вызовам и событиям, особенно в контексте
Сервер Bokeh, стоит обсудить различные варианты использования обратных вызовов в
Общее.
 Обратные вызовы JavaScript в браузере 
 Независимо от того, используете ли вы сервер Bokeh или нет, вы можете создавать обратные вызовы, которые
выполнить в браузере с помощью  CustomJS  и других методов. Для большего
информацию и примеры см. в разделе «Обратные вызовы JavaScript».
  CustomJS  callbacks  никогда  не выполняет код Python, даже если вы конвертируете
Обратный вызов Python в JavaScript. CustomJS Обратные вызовы  выполняются только внутри
интерпретатор JavaScript браузера, что означает, что они могут взаимодействовать только с
Данные и функции JavaScript, например модели BokehJS.
 Обратные вызовы Python с взаимодействиями Jupyter 
 При работе с записными книжками Jupyter вы можете использовать интерактивные элементы Jupyter, чтобы быстро
создавать простые формы графического интерфейса. Обновления виджетов графического интерфейса запускают обратные вызовы Python, которые
выполнить в ядре Python Jupyter. Часто бывает полезно иметь эти
обратные вызовы вызывают  push_notebook ()  для отправки обновлений на отображаемый
сюжеты.Для получения дополнительной информации см.
Интеракторы Jupyter.
 Обновление по темам 
 Вы можете выполнять блокирующие вычисления в отдельных потоках. Однако вы  должны  запланировать обновления документов с помощью обратного вызова следующего тика. Этот обратный вызов выполняется
как можно скорее с помощью следующей итерации цикла событий Tornado и
автоматически устанавливает необходимые блокировки для безопасного обновления состояния документа.
 Помните, прямые обновления состояния документа, исходящие из другого потока,
с помощью других методов документа или настройки свойств модели Bokeh,
риск повреждения данных и протокола.
 Чтобы разрешить всем потокам доступ к одному и тому же документу, сохраните локальную копию  творог () . Пример ниже иллюстрирует этот процесс.
 из functools import partial
из случайного импорта случайный
из потокового импорта Thread
время импорта

из bokeh.models импортировать ColumnDataSource
from bokeh.plotting import curdoc, figure

от генерации импорта торнадо

# изменять только из обратного вызова сеанса Bokeh
источник = ColumnDataSource (данные = dict (x = [0], y = [0]))

# Это важно! Сохраните curdoc (), чтобы убедиться, что все потоки
# см. тот же документ.doc = curdoc ()

@ gen.coroutine
def update (x, y):
    source.stream (dict (x = [x], y = [y]))

def blocking_task ():
    в то время как True:
        # выполнить блокирующее вычисление
        time.sleep (0,1)
        х, у = случайный (), случайный ()

        # но обновить документ с помощью обратного вызова
        doc.add_next_tick_callback (частичное (обновление, x = x, y = y))

p = фигура (x_range = [0, 1], y_range = [0,1])
l = p.circle (x = 'x', y = 'y', source = источник)

doc.add_root (p)

thread = поток (цель = блокирующая_задача)
thread.start ()
 
 Чтобы увидеть этот пример в действии, сохраните приведенный выше код в файл Python для
Например,  testapp.py , а затем выполните следующую команду:
 bokeh serve --show testapp.py
 
 Предупреждение
 В настоящее время нет блокировки для добавления обратных вызовов следующего тика в
документы. У боке должна быть более тонкая блокировка для обратного вызова
методы в будущем, но сейчас лучше, чтобы каждый поток не добавлял
более одного обратного вызова к документу.
 Обновление из разблокированных обратных вызовов 
 Обычно обратные вызовы сеанса Bokeh рекурсивно блокируют документ, пока все
начатая ими будущая работа завершена.Однако вы можете захотеть водить
блокирование вычислений от обратных вызовов с использованием Tornado  ThreadPoolExecutor  в асинхронном обратном вызове. Для этого необходимо использовать  without_document_lock ()  декоратор для подавления нормального
поведение блокировки.
 Как и в приведенном выше примере потока,  все действия, обновляющие состояние документа
должен пройти через обратный вызов следующего тика .
 В следующем примере демонстрируется приложение, которое управляет блокировкой.
вычисление из одного разблокированного обратного вызова сеанса Bokeh.Поддается блокировке
функция, которая выполняется в исполнителе пула потоков, а затем обновляется следующим
отметьте обратный вызов. Пример также обновляет состояние просто из стандартного заблокированного
обратный вызов сеанса с другой частотой обновления.
 из functools import partial
время импорта

из concurrent.futures импортировать ThreadPoolExecutor
от генерации импорта торнадо

из импорта bokeh.document without_document_lock
из bokeh.models импортировать ColumnDataSource
from bokeh.plotting import curdoc, figure

источник = ColumnDataSource (data = dict (x = [0], y = [0], color = ["blue"]))

я = 0

doc = curdoc ()

исполнитель = ThreadPoolExecutor (max_workers = 2)

def blocking_task (i):
    время.сон (1)
    вернуться я

# разблокированный обратный вызов использует этот заблокированный обратный вызов для безопасного обновления
@ gen.coroutine
def lock_update (i):
    source.stream (dict (x = [source.data ['x'] [- 1] +1], y = [i], color = ["blue"]))

# этот разблокированный обратный вызов не помешает другим обратным вызовам сеанса
# выполняется во время работы
@ gen.coroutine
@without_document_lock
def unlocked_task ():
    глобальный я
    я + = 1
    res = yield executor.submit (blocking_task, i)
    doc.add_next_tick_callback (частичное (locked_update, i = res))

@gen.сопрограмма
def update ():
    source.stream (dict (x = [source.data ['x'] [- 1] +1], y = [i], color = ["красный"]))

p = цифра (x_range = [0, 100], y_range = [0,20])
l = p.circle (x = 'x', y = 'y', color = 'color', source = источник)

doc.add_periodic_callback (unlocked_task, 1000)
doc.add_periodic_callback (обновление, 200)
doc.add_root (p)
 
 Как и раньше, вы можете запустить этот пример, сохранив файл Python и запустив
 Боке  служат на нем .
 Крюки жизненного цикла 
 Вы можете захотеть выполнить код в определенных точках времени выполнения сервера или сеанса.Например, если вы используете сервер Bokeh с сервером Django, вам необходимо
вызовите  django.setup ()  для каждого сервера Bokeh, чтобы правильно инициализировать Django для
использование в коде приложения Bokeh.
 Bokeh позволяет это сделать с помощью набора  крючков жизненного цикла . Чтобы использовать эти крючки,
создайте свое приложение в
формат каталога и включить
назначенный файл с именем  app_hooks.py  в каталоге. В этом файле вы можете
включать любую или все из следующих условно названных функций:
 def on_server_loaded (server_context):
    # Если присутствует, эта функция выполняется при запуске сервера.проходить

def on_server_unloaded (server_context):
    # Если присутствует, эта функция выполняется при завершении работы сервера.
    проходить

def on_session_created (контекст_сессии):
    # Если присутствует, эта функция выполняется, когда сервер создает сеанс.
    проходить

def on_session_destroyed (session_context):
    # Если присутствует, эта функция выполняется, когда сервер закрывает сеанс.
    проходить
 
 Вы также можете определить хуки жизненного цикла  on_session_destroyed  непосредственно на  Обслуживается документ .Это упрощает очистку после закрытия пользователем
сеанс, выполнив такие действия, как отключение соединения с базой данных без
необходимость связать отдельный файл. Чтобы объявить такой обратный вызов, определите
функцию и зарегистрируйте ее с помощью метода  Document.on_session_destroyed :
 doc = Документ ()

def cleanup_session (session_context):
    # Эта функция выполняется, когда пользователь закрывает сеанс.
    проходить

doc.on_session_destroyed (cleanup_session)
 
 Помимо хуков жизненного цикла, описанных выше, вы также можете определить хуки запросов для
доступ к HTTP-запросам, которые делают ваши пользователи.Для получения дополнительной информации см.
Крючки обработчика запросов.
 Встраивание сервера Bokeh как библиотеки 
 Может быть полезно встроить сервер Bokeh в более крупное приложение Tornado или
Jupyter и используйте уже существующий Tornado  IOloop . Здесь
основа для интеграции боке в таком сценарии:
 с Сервера импорта bokeh.server.server

server = Сервер (
    bokeh_applications, # список приложений с эффектом боке
    io_loop = loop, # Торнадо IOLoop
    ** server_kwargs # порт, num_procs и т. д.)

# запускаем таймеры и сервисы и сразу возвращаемся
server.start ()
 
 Вы также можете напрямую создавать  IOLoop  и управлять им. Это может быть полезно, когда
создание автономных «обычных» скриптов Python, которые обслуживают приложения Bokeh или встраивают
приложение Bokeh во фреймворке, таком как Flask или Django, без необходимости запускать
отдельный процесс сервера Bokeh. Вы можете найти несколько примеров этой техники в
каталог примеров:
 Также обратите внимание, что каждый аргумент командной строки для  bokeh serve  имеет
соответствующий аргумент ключевого слова для  Server .Например, используя  --allow-websocket-origin  аргумент командной строки эквивалентен передаче  allow_websocket_origin  в качестве параметра.
 Подключение с помощью 
 боке. Клиент 
 Вы можете напрямую взаимодействовать с сервером Bokeh через клиентский API, который вы можете
использовать для внесения изменений в документы с эффектом боке в существующих сеансах с эффектом боке.
сервер.
 Обычно веб-браузеры подключаются к серверу Bokeh, но вы можете
подключение из Python с использованием боке .клиентский модуль .
 Это может быть полезно, например, для внесения пользовательских настроек в
Приложение Bokeh, встроенное в другой веб-фреймворк, например Flask или Django.
В следующем примере конечная точка Flask уже встраивает приложение «ползунки».
работает на сервере, но меняет заголовок сюжета  перед передачей вывода  пользователю.
 из flask import Flask, render_template

из bokeh.client import pull_session
из bokeh.embed import server_session

app = Flask (__ имя__)

@приложение.маршрут ('/', методы = ['ПОЛУЧИТЬ'])
def bkapp_page ():

    с pull_session (url = "http: // localhost: 5006 / sliders") в качестве сеанса:

        # обновить или настроить этот сеанс
        session.document.roots [0] .children [1] .title.text = "Специальные ползунки для конкретного пользователя!"

        # генерируем скрипт для загрузки настроенного сеанса
        script = server_session (session_id = session.id, url = 'http: // localhost: 5006 / слайдеры')

        # использовать скрипт на отображаемой странице
        return render_template ("embed.html", script = script, template = "Flask")

если __name__ == '__main__':
    приложение.запустить (порт = 8080)
 
 Сценарии развертывания 
 Чтобы превратить ваше приложение в удобный сервис, вам нужно развернуть
твоя работа. В этом подразделе исследуются различные аспекты развертывания.
 Автономный сервер Bokeh 
 Вы можете запустить сервер Bokeh в сети, чтобы пользователи могли взаимодействовать с ним.
ваше приложение напрямую. Это может быть простое решение для развертывания локальной сети,
при условии, что возможности оборудования, на котором запущен сервер, соответствуют вашему приложению
требования и ожидаемое количество пользователей.
 Однако, если у вас есть требования к аутентификации, масштабированию или времени безотказной работы, вы
необходимо рассмотреть более сложные конфигурации развертывания.
 SSH туннели 
 Для запуска автономного экземпляра сервера Bokeh на хосте с ограниченным доступом.
доступ, используйте SSH для «туннелирования» к серверу.
 В простейшем сценарии пользователь обращается к серверу Bokeh из другого
расположение, например, ноутбук без машин-посредников.
 Запустите сервер как обычно на удаленном хосте  .
 Затем введите следующую команду на локальном компьютере  , чтобы установить SSH
туннель к удаленному хосту:
 ssh -NfL localhost: 5006: localhost: 5006 user@remote.host
 
 Замените  user  своим именем пользователя на удаленном хосте и  remote.host  на
имя хоста или IP-адрес системы, на которой размещен сервер Bokeh. Удаленный
система может запросить у вас учетные данные для входа. Как только вы подключитесь, вы
иметь возможность перейти на  localhost: 5006 , как если бы сервер Bokeh был
работает на локальной машине.
 Немного более сложный сценарий включает шлюз между сервером и
локальная машина. В этой ситуации обратный туннель должен быть установлен от
сервер к шлюзу с другим туннелем, соединяющим шлюз с
локальная машина.
 Выполните следующие команды на удаленном узле  , где находится сервер Bokeh
будет работать:
 nohup сервер боке и
ssh -NfR 5006: локальный: 5006 user@gateway.host
 
 Замените  пользователь  своим именем пользователя на шлюзе и  на шлюзе.хост  с
имя хоста или IP-адрес шлюза. Шлюз может предложить вам войти в систему
реквизиты для входа.
 Чтобы настроить туннель между локальным компьютером и шлюзом, запустите
следующая команда на локальном компьютере  :
 ssh -NfL localhost: 5006: localhost: 5006 user@gateway.host
 
 Снова замените  user  своим именем пользователя на шлюзе и  gateway.host  с именем хоста или IP-адресом шлюза.
 Теперь у вас должна быть возможность получить доступ к серверу Bokeh с локального компьютера с помощью
переход на  localhost: 5006 .Вы даже можете настроить клиентские подключения из
ноутбук Jupyter, работающий на локальном компьютере.
 Примечание
 Мы намерены расширить этот раздел дополнительными инструкциями по другим инструментам и
конфигурации. Если у вас есть опыт работы с другими сценариями веб-развертывания
и желаете поделиться здесь своими знаниями, пожалуйста, свяжитесь с нами по
https://discourse.bokeh.org
 Завершение SSL 
 Вы можете настроить сервер Bokeh для прерывания SSL-соединений и обслуживания
защищать сеансы HTTPS и WSS напрямую.Для этого вам нужно будет предоставить  --ssl-certfile  аргумент со значением пути к одному файлу PEM
содержащий сертификат, а также любое количество сертификатов CA, необходимых для установки
подлинность сертификата.
 bokeh serve --ssl-certfile /path/to/cert.pem
 
 Вы также можете указать путь к файлу сертификата, установив среду
переменная  BOKEH_SSL_CERTFILE .
 Если закрытый ключ хранится отдельно, вы можете указать его местоположение, установив
аргумент командной строки  --ssl-keyfile  или задав  BOKEH_SSL_KEYFILE  переменная среды.Если для закрытого ключа требуется
пароль, укажите его, установив переменную среды  BOKEH_SSL_PASSWORD .
 В качестве альтернативы вы можете захотеть запустить сервер Bokeh за прокси и иметь
прокси завершает SSL-соединения. См. Подробности в следующем подразделе.
 Базовая настройка обратного прокси 
 Для обслуживания веб-приложения в Интернете вы можете разместить свой
приложение во внутренней сети и прокси-подключения к нему через выделенный
HTTP-сервер.В этом подразделе представлены инструкции по настройке некоторых распространенных
обратные прокси.
 Nginx 
 Одним из наиболее распространенных серверов HTTP и обратного проксирования является Nginx. Вот пример
сервера , строфа конфигурации :
 server {
    слушаем 80 default_server;
    название сервера _;

    access_log /tmp/bokeh.access.log;
    error_log /tmp/bokeh.error.log отладка;

    место нахождения / {
        proxy_pass http://127.0.0.1:5100;
        proxy_set_header Обновить $ http_upgrade;
        proxy_set_header Соединение «апгрейд»;
        proxy_http_version 1.1;
        proxy_set_header X-Forwarded-For $ proxy_add_x_forwarded_for;
        proxy_set_header Хост $ host: $ server_port;
        proxy_buffering выключен;
    }

}
 
 Вышеупомянутый блок  server  настраивает Nginx для проксирования входящих подключений к  127.0.0.1  на порту 80 на  127.0.0.1  на порт 5100. Для работы в этом
конфигурации, вам необходимо использовать некоторые параметры командной строки для настройки
сервер Bokeh. В частности, используйте  --port , чтобы иметь сервер Bokeh.
слушать порт 5100.
 боке служат myapp.py --port 5100
 
 Базовый серверный блок выше не настраивает никакой специальной обработки для статических
ресурсы, такие как файлы Bokeh JS и CSS. Это означает, что сервер Bokeh
обслуживает эти файлы напрямую.
 Хотя это жизнеспособный вариант, он требует от сервера Bokeh дополнительных
работа, которую лучше выполнять с помощью Nginx. Чтобы обслуживать статические ресурсы с Nginx, добавьте
следующий подблок к приведенному выше коду, подставляя путь к вашему
статические ресурсы для  / путь / к / боке / сервер / статический :
 location / static {
    псевдоним / путь / к / боке / серверу / статическому;
}
 
 Убедитесь, что у учетной записи, на которой запущен Nginx, есть разрешения на доступ к Bokeh.
Ресурсы.В качестве альтернативы вы можете скопировать ресурсы в глобальный статический
каталог во время развертывания.
 Для передачи файлов cookie и заголовков между процессами Bokeh может включать это
информацию в веб-токене JSON, отправив ее через WebSocket. В некоторых случаях
этот токен может вырасти до очень большого размера, из-за чего Nginx отбросит запрос. Ты можешь иметь
чтобы обойти это, переопределив настройку Nginx по умолчанию  large_client_header_buffers :
 large_client_header_buffers 4 24k;
 
 Apache 
 Другой распространенный HTTP-сервер и прокси - это Apache.Вот пример
конфигурация для сервера Bokeh, работающего за Apache:
 
    ServerName localhost

    CustomLog "/ path / to / logs / access_log" объединены
    ErrorLog "/ путь / к / журналам / error_log"

    ProxyPreserveHost On
    ProxyPass / myapp / WS WS: //127.0.0.1: 5100 / myapp / WS
    ProxyPassReverse / myapp / WS WS: //127.0.0.1: 5100 / myapp / WS

    ProxyPass / myapp http://127.0.0.1:5100/myapp/
    ProxyPassReverse / myapp http://127.0.0.1:5100/myapp/

    <Каталог />
        Требовать все предоставлено
        Параметры -Индексы
    

    Псевдоним / static / path / to / bokeh / server / static
    <Каталог / путь / к / bokeh / server / static>
        # директивы для работы со статическим каталогом
        Параметры + Индексы
    


 
 В приведенной выше конфигурации псевдонимы  / static  соответствуют местоположению статического объекта Bokeh.
каталог ресурсов.Однако также возможно (и, вероятно, предпочтительнее)
скопируйте статические ресурсы в любое стандартное место для статических файлов, которые вы
настроить для Apache как часть развертывания.
 Вам также может потребоваться включить некоторые модули для указанной выше конфигурации:
 a2enmod прокси
a2enmod proxy_http
a2enmod proxy_wstunnel
перезапуск apache2ctl
 
 В зависимости от вашей системы вам, возможно, придется использовать  sudo  для выполнения вышеуказанного.
 Как и раньше, запустите сервер Bokeh с помощью следующей команды:
 боке служат myapp.py --port 5100
 
 Обратное проксирование с Nginx и SSL 
 Для развертывания сервера Bokeh за прокси-сервером Nginx с завершением SSL вам понадобится
несколько дополнительных настроек. В частности, вам нужно будет настроить
Сервер Bokeh с флагом  --use-xheaders .
 bokeh serve myapp.py --port 5100 --use-xheaders
 
 Флаг  --use-xheaders  заставляет Bokeh переопределить удаленный IP-адрес и
Схема / протокол URI для всех запросов с  X-Real-Ip ,  X-Forwarded-For ,
 Заголовки  X-Scheme  и  X-Forwarded-Proto , если они доступны.
 Вам также придется настроить Nginx. В частности, вам необходимо настроить Nginx
для отправки заголовков  X-Forwarded-Proto  и использования завершения SSL. При желании вы
может захотеть перенаправить весь HTTP-трафик на HTTPS.
 Полная информация об этой конфигурации, например, как и где установить
Сертификаты и ключи SSL, различаются в зависимости от платформы, и ниже приводится только
ссылка  nginx.conf  setup:
 # перенаправить HTTP-трафик на HTTPS (необязательно)
server {
    слушать 80;
    имя_сервера foo.com;
    return 301 https: // $ server_name $ request_uri;
}

server {
    слушать 443 default_server;
    имя_сервера foo.com;

    # добавляет Strict-Transport-Security для предотвращения атак типа "злоумышленник посередине"
    add_header Strict-Transport-Security "max-age = 31536000";

    ssl включен;

    # Детали установки SSL зависят от платформы
    ssl_certificate /etc/ssl/certs/my-ssl-bundle.crt;
    ssl_certificate_key /etc/ssl/private/my_ssl.key;

    # включает все версии TLS, но не устаревшие SSLv2 или v3
    ssl_protocols TLSv1 TLSv1.1 TLSv1.2;

    # отключает все слабые шифры
    ssl_ciphers "ECDHE-RSA-AES256-GCM-SHA384: ECDHE-RSA-AES128-GCM-SHA256: DHE-RSA-AES256-GCM-SHA384: DHE-RSA-AES128-GCM-SHA256: ECDHE4256-RSA-SHA256: ECDHE4256-RSA-SHA256: ECDHE4256. ECDHE-RSA-AES128-SHA256: ECDHE-RSA-AES256-SHA: ECDHE-RSA-AES128-SHA: DHE-RSA-AES256-SHA256: DHE-RSA-AES128-SHA256: DHE-RSA-AES256-SHA: DHE-RSA-AES256-SHA RSA-AES128-SHA: ECDHE-RSA-DES-CBC3-SHA: EDH-RSA-DES-CBC3-SHA: AES256-GCM-SHA384: AES128-GCM-SHA256: AES256-SHA256: AES128-SHA256: AES256-SHA: AES128-SHA: DES-CBC3-SHA: HIGH:! ANULL:! ENULL:! EXPORT:! DES:! MD5:! PSK:! RC4 ";

    ssl_prefer_server_ciphers на;

    место нахождения / {
        прокси-пароль http: // 127.0.0.1: 5100;
        proxy_set_header Обновить $ http_upgrade;
        proxy_set_header Соединение «апгрейд»;
        proxy_http_version 1.1;
        proxy_set_header Схема X-Forwarded-Proto $;
        proxy_set_header X-Forwarded-For $ proxy_add_x_forwarded_for;
        proxy_set_header Хост $ host: $ server_port;
        proxy_buffering выключен;
    }

}
 
 Эта конфигурация будет проксировать все входящие HTTPS-соединения на  foo.com  на сервер Bokeh, работающий внутри по адресу  http: // 127.0.0.1: 5100 .
 Балансировка нагрузки с Nginx 
 Сервер Bokeh имеет масштабируемую конструкцию. Если вам нужна большая емкость, вы можете
просто запустите дополнительные серверы. В этом случае обычно нужно запускать все
экземпляры сервера Bokeh за балансировщиком нагрузки, чтобы новые подключения
распределены между отдельными серверами.
 Сервер Bokeh масштабируется по горизонтали. Чтобы увеличить емкость, вы
может запускать больше серверов за балансировщиком нагрузки.
 Nginx может помочь с балансировкой нагрузки.В этом разделе описаны некоторые основы
одной из возможных конфигураций, но, пожалуйста, также обратитесь к
Документация по балансировщику нагрузки Nginx. Например, есть разные
доступные стратегии для выбора того, к какому серверу подключиться следующим.
 Во-первых, вам нужно добавить раздел  восходящего потока  в конфигурацию Nginx.
Обычно это располагается над разделом  server  и выглядит примерно так:
следующий:
 восходящий поток myapp {
    less_conn; # Используйте стратегию с наименьшими связями
    сервер 127.0.0.1: 5100; # Сервер боке 0
    сервер 127.0.0.1:5101; # Сервер боке 1
    сервер 127.0.0.1:5102; # Сервер боке 2
    сервер 127.0.0.1:5103; # Сервер боке 3
    сервер 127.0.0.1:5104; # Сервер боке 4
    сервер 127.0.0.1:5105; # Сервер боке 5
}
 
 Остальная часть конфигурации использует имя  myapp  для обозначения вышеупомянутого  восходящий раздел , в котором приводится информация о внутреннем соединении для шести
разные экземпляры сервера Bokeh (каждый работает на своем порту).Вы можете
запустите и перечислите столько серверов Bokeh, сколько вам нужно.
 Чтобы запустить экземпляр сервера Bokeh, используйте команды, подобные приведенным ниже:
 служить myapp.py --port 5100
служить myapp.py --port 5101
...
 
 Затем в разделе  местоположения  для сервера Bokeh измените  proxy_pass  значение для ссылки на раздел  восходящего потока  выше. В
код ниже использует  proxy_pass http: // myapp; .
 server {

    место нахождения / {
        proxy_pass http: // myapp;

        # все остальные настройки без изменений
        proxy_set_header Обновить $ http_upgrade;
        proxy_set_header Соединение «апгрейд»;
        proxy_http_version 1.1;
        proxy_set_header X-Forwarded-For $ proxy_add_x_forwarded_for;
        proxy_set_header Хост $ host: $ server_port;
        proxy_buffering выключен;
    }

}
 
 Аутентификация 
 Сам сервер Bokeh не имеет средств для аутентификации или
авторизация. Однако вы можете настроить сервер Bokeh с помощью «auth
provider », который подключается к базовым возможностям Tornado. Для фона
Для получения дополнительной информации см. документацию Tornado по проверке подлинности и безопасности. Прочее
этого раздела предполагает некоторое знакомство с этим материалом.
 Модуль аутентификации 
 Вы можете настроить сервер Bokeh, чтобы разрешить доступ только авторизованным пользователям.
соединять. Для этого укажите путь к модулю, который реализует необходимые
функции в командной строке.
 bokeh serve --auth-module = / путь / к / auth.py
 
 В качестве альтернативы вы можете установить для переменной среды  BOKEH_AUTH_MODULE  значение
этот путь.
 Модуль должен содержать  одну  из следующих двух функций, которые возвращают
текущий пользователь (или  Нет ):
 def get_user (request_handler):
    проходить

async def get_user_async (request_handler):
    проходить
 
 Модуль передает функцию в Tornado  RequestHandler , который может
проверять файлы cookie или заголовки запросов, чтобы определить аутентифицированного пользователя.Если
нет аутентифицированного пользователя, эти функции должны возвращать  Нет .
 Дополнительно в модуле необходимо указать, куда перенаправлять неаутентифицированных пользователей.
включив либо:
 login_url = "..."

класс LoginHandler (RequestHandler):
    проходить

def get_login_url (request_handler):
    проходить
 
 Если модуль предоставляет относительный  login_url , он также может предоставить
дополнительный  LoginHandler  класс, который будет включать сервер Bokeh
автоматически.
 Функция  get_login_url  полезна в случаях, когда URL-адрес входа должен
варьироваться в зависимости от запроса, файлов cookie или других факторов. Вы также можете указать  LoginHandler  при определении  get_url_function .
 Чтобы определить конечную точку для выхода пользователей из системы, вы также можете использовать необязательный  logout_url  и  LogoutHandler  параметры, аналогичные параметрам входа в систему.
 Если вы не предоставите модуль аутентификации, конфигурация не будет
требуется любая аутентификация для доступа к конечным точкам сервера Bokeh.
 Предупреждение
 Конфигурация выполняет содержимое модуля аутентификации.
 Безопасные файлы cookie 
 Если вы хотите использовать set_secure_cookie и get_secure_cookie Торнадо
функций в вашем модуле аутентификации, вам нужно будет установить секрет cookie. Для этого
используйте переменную среды  BOKEH_COOKIE_SECRET .
 экспорт BOKEH_COOKIE_SECRET = <секретное значение cookie>
 
 Значение должно быть длинной случайной последовательностью байтов.
 Безопасность 
 По умолчанию сервер Bokeh принимает любые входящие соединения с
разрешенное происхождение WebSocket. Если вы укажете идентификатор сеанса, а сеанс с
этот идентификатор уже существует на сервере, сервер подключится к этому сеансу.
В противном случае сервер автоматически создаст и будет использовать новый сеанс.
 Если вы развертываете встроенное приложение Bokeh в крупной организации или
для более широкого Интернета, вы можете ограничить круг лиц, которые могут инициировать сеансы, и
отсюда.Bokeh позволяет управлять правами на создание сеанса.
 Источник WebSocket 
 Когда сервер Bokeh получает HTTP-запрос, он немедленно возвращает скрипт.
который инициирует соединение WebSocket. Все последующее общение происходит
через WebSocket.
 Чтобы снизить риск несанкционированного использования между сайтами, сервер Bokeh будет только инициировать
Подключения WebSocket из явно разрешенных источников. Запросы
с заголовками  Origin , которых нет в разрешенном списке, будет генерироваться HTTP 403
ответы об ошибках.
 По умолчанию разрешен только  localhost: 5006 , что делает следующие два
идентичные вызовы:
 подача боке - показать myapp.py
 
 и
 bokeh serve --show --allow-websocket-origin = localhost: 5006 myapp.py
 
 Оба из них открывают ваш браузер по умолчанию с URL-адресом приложения по умолчанию.  localhost: 5006  и, поскольку  localhost: 5006  находится в списке разрешенных
WebSocket, сервер Bokeh создает и отображает новый сеанс.
 Когда вы встраиваете сервер Bokeh на другую веб-страницу с помощью  server_document ()  или  server_session () , заголовок  Origin  для запроса к серверу Bokeh
- это URL-адрес страницы, на которой размещен ваш контент Bokeh.
 Например, если пользователь переходит на вашу страницу по адресу  https://acme.com/products ,
заголовок источника, сообщаемый браузером, будет  acme.com . В этом случае,
вы обычно ограничиваете сервер Bokeh обработкой  только  запросов,
происходят от акме  г.com , предотвращая встраивание других страниц
ваше приложение Bokeh без вашего ведома.
 Это можно сделать, задав аргумент командной строки  --allow-websocket-origin  следующим образом:
 bokeh serve --show --allow-websocket-origin = acme.com myapp.py
 
 Это помешает другим сайтам встраивать ваше приложение Bokeh в свои
страниц, потому что запросы от пользователей, просматривающих эти страницы, будут сообщать о другом
origin, чем  acme.com , в результате чего сервер Bokeh их отклоняет.
 Предупреждение
 Имейте в виду, что это предотвращает только  других веб-страниц  от встраивания вашего
Приложение боке без вашего ведома.
 Если вам требуется несколько разрешенных источников, вы можете передать несколько экземпляров  --allow-websocket-origin  в командной строке.
 Вы также можете настроить сервер Bokeh для разрешения всех подключений независимо от
происхождение:
 bokeh serve --show --allow-websocket-origin = '*' myapp.py
 
 Этот вариант подходит только для тестирования, экспериментов и локального ноутбука.
использование.
 Подписанные идентификаторы сеанса 
 По умолчанию сервер Bokeh автоматически создает новые сеансы для всех
новые запросы от разрешенных источников WebSocket, даже если вы не предоставили идентификатор сеанса.
 При встраивании приложения Bokeh в другое веб-приложение, такое как Flask или
Django, убедитесь, что  только  ваше веб-приложение способно генерировать
жизнеспособные запросы к серверу Bokeh, который вы можете настроить только для создания
сеансы с криптографически подписанным идентификатором сеанса.
 Сначала используйте команду  bokeh secret , чтобы создать секрет для подписи идентификаторов сеансов.
 экспорт BOKEH_SECRET_KEY = `секрет боке`
 
 Затем установите  BOKEH_SIGN_SESSIONS  на  yes  при запуске сервера Bokeh.
Обычно на этом этапе вы также можете установить разрешенное происхождение WebSocket.
 BOKEH_SIGN_SESSIONS = yes bokeh serve --allow-websocket-origin = acme.com myapp.py
 
 Затем в своем веб-приложении явно укажите подписанные идентификаторы сеанса с  generate_session_id :
 из боке.util.token import generate_session_id

script = server_session (url = 'http: // localhost: 5006 / bkapp',
                        session_id = generate_session_id ())
return render_template ("embed.html", script = script, template = "Flask")
 
 Убедитесь, что вы установили одинаковые переменные среды  BOKEH_SECRET_KEY  как для
сервер Bokeh и для процессов веб-приложений, таких как Flask, Django или любые
другой инструмент, который вы используете.
 Примечание
 Подписанные идентификаторы сеанса служат маркерами доступа.Как и в любой системе токенов,
безопасность основана на хранении токена в секрете. Вам также следует запустить
сервер Bokeh за прокси-сервером, который завершает SSL-соединения, или
настроить сервер Bokeh для прямого прерывания SSL. Это позволяет вам
безопасно передавать идентификаторы сеанса в клиентские браузеры.
 Файлы cookie XSRF 
 Сервер
 Bokeh может использовать защиту от подделки межсайтовых запросов Tornado. Повернуть
для этой функции используйте опцию  --enable-xsrf-cookies  или установите
переменная среды  BOKEH_XSRF_COOKIES от  до  да .
 С этой настройкой вам необходимо правильно настроить все операции PUT, POST и DELETE.
операции над пользовательскими обработчиками и обработчиками входа в систему, чтобы они функционировали.
Обычно это означает добавление следующего кода ко всем отправляемым HTML-формам.
шаблонов:
 {% модуль xsrf_form_html ()%}
 
 Для получения полной информации см. Документацию Tornado по файлам cookie XSRF.
 Масштабирование сервера 
 Вы можете разветвить несколько серверных процессов с помощью опции  num-procs .Для
Например, выполните следующую команду для разветвления 3 процессов:
 подача боке --num-procs 3
 
 Обратите внимание, что операция разветвления происходит на базовом сервере Tornado. Для
дополнительную информацию см. в документации Tornado.
 Интерактивная визуализация данных с использованием боке (в Python) 
 Введение 
 Недавно я просматривал видео с конференции SciPy 2015 «Создание приложений для обработки данных Python с помощью Blaze и Bokeh», недавно прошедшей в Остине, штат Техас, США. Я не мог перестать думать о силе, которую эти две библиотеки предоставляют специалистам по данным, использующим Python, по всему миру.В этой статье я познакомлю вас с миром возможностей визуализации данных с использованием боке и расскажу, почему я считаю, что эту библиотеку необходимо изучить / использовать для каждого специалиста по данным.
 Источник: bokeh.pydata.org
 Что такое боке? 
 Bokeh - это библиотека Python для интерактивной визуализации, предназначенная для представления в веб-браузерах. В этом основное отличие Bokeh от других библиотек визуализации. Посмотрите на снимок ниже, который объясняет, как Bokeh помогает представлять данные в веб-браузере.
 Источник: Continuum Analytics
 Как видите, Bokeh имеет привязку к нескольким языкам (Python, R, lua и Julia). Эти привязки создают файл JSON, который работает как вход для BokehJS (библиотеки Javascript), который, в свою очередь, представляет данные для современных веб-браузеров.
 Bokeh может создавать элегантную и интерактивную визуализацию, такую ​​как D3.js, с высокопроизводительной интерактивностью для очень больших или потоковых наборов данных. Bokeh может помочь любому, кто хочет быстро и легко создавать интерактивные графики, информационные панели и приложения для обработки данных.
 Что предлагает Боке такому специалисту по обработке данных, как я? 
 Я начал свой путь в области науки о данных как профессионал в области бизнес-аналитики, а затем прошел свой путь через прогнозное моделирование, науку о данных и машинное обучение. В первую очередь я полагался на такие инструменты, как QlikView и Tableau для визуализации данных и SAS и Python для прогнозной аналитики и анализа данных. У меня практически не было опыта использования JavaScript.
 Итак, для всех моих продуктов или идей, связанных с данными, мне пришлось либо отдать работу на аутсорсинг, либо продвигать свои идеи через каркасы, которые не идеальны для создания быстрых прототипов.Теперь, благодаря Bokeh, я могу продолжать работать в экосистеме Python, но при этом быстро создавать эти прототипы.
 Преимущества боке: 
 Bokeh позволяет быстро строить сложные статистические графики с помощью простых команд
 Bokeh обеспечивает вывод на различных носителях, таких как HTML, ноутбук и сервер.
 Мы также можем встроить визуализацию Bokeh в приложение Flask и django
 Bokeh может преобразовывать визуализацию, написанную в других библиотеках, таких как matplotlib, seaborn, ggplot
 Bokeh обеспечивает гибкость для применения взаимодействия, макетов и различных вариантов стиля к визуализации
 Проблем с боке: 
 Как и любая будущая библиотека с открытым исходным кодом, Bokeh находится в стадии развития.Таким образом, код, который вы пишете сегодня, не может быть полностью повторно использован в будущем.
 В нем относительно меньше возможностей визуализации по сравнению с D3.js. Следовательно, маловероятно, что в ближайшем будущем он будет бросать вызов D3.js за свою корону.
 Учитывая преимущества и проблемы, в настоящее время идеально подходит для быстрой разработки прототипов. Однако, если вы хотите создать что-то для производственной среды, D3.js все равно может быть вашим лучшим выбором.
 Чтобы установить Bokeh, следуйте инструкциям, приведенным здесь.
 Визуализация с боке 
 Bokeh предлагает как мощные, так и гибкие функции, которые придают простоту и расширенные возможности настройки. Он предоставляет пользователю несколько интерфейсов визуализации, как показано ниже:
  Диаграммы:   высокоуровневый интерфейс , который используется для быстрого и упрощенного построения сложных статистических графиков.
  Plotting:  интерфейс  среднего уровня , который сосредоточен вокруг создания визуальных глифов.
  Models:   низкоуровневый интерфейс , который обеспечивает максимальную гибкость для разработчиков приложений.
 В этой статье мы рассмотрим только первые два интерфейса, графики и графики. В следующем посте мы обсудим модели и другие дополнительные возможности этой библиотеки.
 Графики 
 Как упоминалось выше, это интерфейс высокого уровня, используемый для представления информации в стандартной форме визуализации. Эти формы включают прямоугольную диаграмму, гистограмму, диаграмму с областями, тепловую карту, кольцевую диаграмму и многие другие.Вы можете создавать эти графики, просто передавая фреймы данных, массивы numpy и словари.
 Давайте посмотрим на общую методологию создания диаграммы:
 Импорт библиотеки и функций / методов
 Подготовить данные
 Установите режим вывода (ноутбук, веб-браузер или сервер)
 Создать диаграмму с возможностью стилизации (если требуется)
 Визуализируйте диаграмму
 Чтобы лучше понять эти шаги, позвольте мне продемонстрировать эти шаги на примере ниже:
 Charts Example-1: Создайте гистограмму и визуализируйте ее в веб-браузере с помощью Bokeh 
 Мы будем следовать перечисленным выше шагам, чтобы создать диаграмму:
 # Импорт библиотеки
из боке.диаграммы импорта Bar, output_file, show #use output_notebook для визуализации в записной книжке 
 # подготовить данные (фиктивные данные)
data = {"y": [1, 2, 3, 4, 5]} 
 # Вывод в Line.HTML
output_file ("lines.html", title = "пример линейного графика") #put output_notebook () для записной книжки 
 # создать новую строку чата с заголовком и метками оси
p = Bar (data, title = "Пример линейной диаграммы", xlabel = 'x', ylabel = 'values', width = 400, height = 400) 
 # показать результаты
показать (p)
 
 На приведенной выше диаграмме вы можете видеть инструменты вверху (масштабирование, изменение размера, сброс, масштабирование колеса), и эти инструменты позволяют вам взаимодействовать с диаграммой.Вы также можете посмотреть несколько вариантов диаграммы (легенда, xlabel, ylabel, xgrid, ширина, высота и многие другие) и различные примеры диаграмм здесь.
 Диаграмма Пример-2: Сравните распределение длины чашелистика и длины лепестка набора данных IRIS с помощью прямоугольной диаграммы на записной книжке 
 Чтобы создать эту визуализацию, сначала я импортирую набор данных радужной оболочки глаза с помощью библиотеки sklearn. Затем выполните шаги, описанные выше, чтобы визуализировать диаграмму в блокноте ipython.
 # Набор данных IRIS
из склеарна.наборы данных импорт load_iris
импортировать панд как pd
радужная оболочка = load_iris ()
df = pd.DataFrame (iris.data)
df.columns = ['petal_width', 'petal_length', 'sepal_width', 'sepal_length'] 
 # Импорт библиотеки
from bokeh.charts import BoxPlot, output_notebook, show 
 data = df [['petal_length', 'sepal_length']] 
 # Вывод в ноутбук
output_notebook () 
 # создать новую строку чата с заголовком и метками оси
p = BoxPlot (данные, ширина = 400, высота = 400) 
 # показать результаты
показать (p) 
 Диаграмма Пример-3: Создание линейного графика для сервера боке 
 Перед нанесением визуализации на сервер Bokeh ее необходимо запустить.
 Если вы используете пакет conda, вы можете использовать команду запуска  bokeh-server  из любого каталога с помощью команды. В противном случае команда  python ./bokeh-server  должна работать в целом. Для получения более подробной информации перейдите по этой ссылке «Развертывание сервера Bokeh».
 Графическая визуализация на сервере Bokeh дает несколько преимуществ:
 Сюжеты можно публиковать для широкой аудитории
 Интерактивная визуализация большого набора данных
 Потоковая передача данных для автоматического обновления графиков
 Создание информационных панелей и приложений
 Чтобы начать построение на сервере Bokeh, я выполнил команду  bokeh-server  для его инициализации, а затем команды, используемые для визуализации.
 из bokeh.plotting import figure, output_server, show
output_server ("строка")
p = фигура (plot_width = 400, plot_height = 400)
# добавить средство визуализации строки
p.line ([5, 2, 3, 4, 5], [5, 7, 2, 4, 5], line_width = 2)
показать (p) 
 Участок 
 Plotting - это интерфейс  промежуточного уровня , который сосредоточен на создании визуальных глифов. Здесь вы создаете визуализацию, комбинируя различные визуальные элементы (точка, круги, линия, патч и многие другие) и инструменты (инструмент наведения, масштабирование, сохранение, сброс и другие).
 Графики боке, созданные с использованием интерфейса bokeh.plotting, поставляются с набором инструментов и визуальных стилей по умолчанию. Для построения графика выполните следующие шаги:
 Импорт библиотеки, методов или функций
 Выберите режим вывода (ноутбук, веб-браузер, сервер)
 Активировать фигуру (аналогично matplotlib)
 Выполните последующие операции построения графика, это повлияет на сгенерированный рисунок.
 Визуализируйте
 Чтобы лучше понять эти шаги, позвольте мне продемонстрировать эти шаги на примерах ниже:
 Пример графика 1. Создайте квадратную метку разброса на XY-рамке записной книжки 
 из боке.построение графика импорта, output_notebook, show

# вывод в блокнот
output_notebook ()
p = фигура (plot_width = 400, plot_height = 400)
# добавить квадрат с размером, цветом и альфа
p.square ([2, 5, 6, 4], [2, 3, 2, 1, 2], size = 20, color = "темно-синий")
# показать результаты
показать (p)

 
 Точно так же вы можете создавать различные другие графики, такие как линии, клинья и дуги, овалы, изображения, пятна и многие другие, см. Эту ссылку, чтобы увидеть различные примеры.
 Пример графика 2: объединение двух визуальных элементов на графике 
 из боке.построение графика импорта, output_notebook, show 
 # вывод в ноутбук
output_notebook ()
p = фигура (plot_width = 400, plot_height = 400)
# добавить квадрат с размером, цветом и альфа
p.square ([2, 5, 6, 4], [2, 3, 2, 1, 2], size = 20, color = "темно-синий")
p.line ([1, 2, 3, 4, 5], [1, 2, 2, 4, 5], line_width = 2) # добавил линейный график к существующей фигуре
# показать результаты
показать (p) 
 Пример графика-3: Добавьте инструмент наведения и метки осей на график выше 
 из боке.построение графика импорта, output_notebook, show
from bokeh.models import HoverTool, BoxSelectTool # Для включения инструментов 
 # вывод в ноутбук
output_notebook () 
 # Добавить инструменты
ИНСТРУМЕНТЫ = [BoxSelectTool (), HoverTool ()] 
 p = фигура (plot_width = 400, plot_height = 400, tools = TOOLS) 
 # добавить квадрат с размером, цветом и альфой
p.square ([2, 5, 6, 4], [2, 3, 2, 1, 2], size = 20, color = "navy", alpha = 0.5) 
 # Визуальные элементы
p.xaxis.axis_label = "Ось X"
p.yaxis.axis_label = "Ось Y" 
 # показать результаты
показать (p) 
 Для получения дополнительной информации о визуальных атрибутах и ​​инструментах перейдите по этим ссылкам:
 Графический пример-4: Построить карту Индии с использованием данных широты и долготы для границ 
  Примечание:  У меня есть данные для многоугольника широты и долготы границ Индии в формате csv. Я буду использовать это для построения графика.
 Здесь мы перейдем к построению патчей, давайте посмотрим на команды ниже:
 # Импорт библиотек 
 импортировать панд как pd
из боке.построение графика импорта, шоу, output_notebook 
 # Импорт координат широты и широты
Индия = pd.read_csv ('E: /India.csv')
дель Индия ['ID']
India.index = ['IN0', 'IN1', 'IN2', 'IN3', 'IN4', 'IN5'] 
 # Преобразовать строковые значения в число с плавающей запятой, поскольку координаты в фрейме данных являются строковыми
для j в диапазоне (0, len (Индия)):
 a = Индия ['lats'] [j]
 Индия ['lats'] [j] = [float (i) for i in a [1: len (a) -1] .split (",")] 
 для j в диапазоне (0, len (Индия)):
 a = Индия ['lons'] [j]
 Индия ['lons'] [j] = [float (i) for i in a [1: len (a) -1].split (",")] 
 # Вариант вывода
output_notebook () 
 # Создайте свой сюжет
p = фигура (plot_height = 400, plot_width = 400, toolbar_location = "right", x_axis_type = None, y_axis_type = None)
p.patches (xs = India ['lons'], ys = India ['lats'], fill_color = "white", line_color = "black", line_width = 0,5) 
 # Визуализируйте свою диаграмму
показать (p) 
 Конечные ноты 
 В этой статье мы рассмотрели создание визуализаций с использованием боке и методы их представления на ноутбуках, html и боке-сервере.Мы также рассмотрели методы создания настраиваемой визуализации с использованием построения графиков, здесь вы можете комбинировать несколько визуальных элементов для представления информации.
 В моем следующем посте о боке я расскажу о моделях и других интерактивных функциях визуализации. Например, у меня есть координаты границ для каждой страны по всему миру. Теперь я хочу создать визуализацию для представления каждой карты страны в цикле (цикле). Он начинает построение карты страны, ждет 3 секунды и повторяется для всех стран.Звучит интересно! Не правда ли?
 Вы нашли эту статью полезной? Сообщите нам свои мысли об этой статье в разделе комментариев ниже.
 Если вам нравится то, что вы только что прочитали, и вы хотите продолжить изучение аналитики, подпишитесь на наши электронные письма, подпишитесь на нас в Twitter или поставьте лайк на нашей странице в Facebook. 
  Связанные 
 Интерактивная визуализация данных на Python с боке - Real Python 
 Bokeh гордится тем, что является библиотекой  для интерактивной визуализации данных.
 В отличие от популярных аналогов в области визуализации Python, таких как Matplotlib и Seaborn, Bokeh отображает свою графику с помощью HTML и JavaScript. Это делает его отличным кандидатом для создания веб-панелей и приложений. Однако это не менее мощный инструмент для изучения и понимания ваших данных или создания красивых пользовательских диаграмм для проекта или отчета.
 Используя ряд примеров из реального набора данных, цель этого руководства - научить вас работать с Bokeh.
  Вы узнаете, как: 
  Преобразуйте свои данные  в визуализации с помощью боке
  Настройте и систематизируйте  свои визуализации
  Добавьте интерактивности  к вашим визуализациям
 Итак, приступим. Вы можете загрузить примеры и фрагменты кода из репозитория Real Python на GitHub.
 От данных к визуализации 
 Построение визуализации с эффектом боке включает следующие шаги:
 Подготовить данные
 Определите, где будет отображаться визуализация
 Установите фигуры
 Подключитесь и извлеките данные
 Организовать макет
 Предварительный просмотр и сохранение ваших прекрасных данных
 Давайте рассмотрим каждый шаг более подробно.
 Подготовьте данные 
 Любая хорошая визуализация данных начинается, как вы уже догадались, с данных. Если вам нужно быстро освежить в памяти обработку данных в Python, обязательно ознакомьтесь с растущим числом отличных руководств по  Real Python  по этой теме.
 Этот шаг обычно включает библиотеки обработки данных, такие как Pandas и Numpy, и заключается в том, чтобы предпринять необходимые шаги для преобразования его в форму, которая лучше всего подходит для вашей предполагаемой визуализации.
 Определите, где будет отображаться визуализация 
 На этом этапе вы определите, как вы хотите создавать и в конечном итоге просматривать визуализацию.В этом руководстве вы узнаете о двух распространенных вариантах, которые предоставляет Bokeh: создание статического файла HTML и рендеринг визуализации в блокноте Jupyter.
 Установите рисунки 
 Отсюда вы соберете свою фигуру, подготовив холст для визуализации. На этом этапе вы можете настроить все, от заголовков до отметок. Вы также можете настроить набор инструментов, которые могут позволить пользователю различное взаимодействие с вашей визуализацией.
 Подключайтесь и извлекайте данные 
 Затем вы воспользуетесь множеством средств рендеринга Bokeh, чтобы придать форму вашим данным.Здесь у вас есть возможность рисовать данные с нуля, используя множество доступных параметров маркеров и форм, и все они легко настраиваются. Эта функция дает вам невероятную свободу творчества при представлении ваших данных.
 Кроме того, Bokeh имеет некоторые встроенные функции для создания таких вещей, как гистограммы с накоплением, и множество примеров для создания более сложных визуализаций, таких как сетевые графики и карты.
 Упорядочить макет 
 Если вам нужно несколько цифр для выражения ваших данных, Bokeh поможет вам.Bokeh не только предлагает стандартные параметры макета в виде сетки, но также позволяет легко организовать визуализацию в макет с вкладками всего за несколько строк кода.
 Кроме того, ваши графики можно быстро связать друг с другом, поэтому выбор одного из них будет отражаться на любой комбинации других.
 Предварительный просмотр и сохранение ваших прекрасных созданных данных 
 Наконец, пора посмотреть, что вы создали.
 Независимо от того, просматриваете ли вы визуализацию в браузере или в записной книжке, вы сможете изучить свою визуализацию, изучить свои настройки и поиграть с любыми добавленными взаимодействиями.
 Если вам нравится то, что вы видите, вы можете сохранить визуализацию в файл изображения. В противном случае вы можете вернуться к описанным выше шагам по мере необходимости, чтобы воплотить свое видение данных в реальность.
 Вот и все! Эти шесть шагов - строительные блоки аккуратного гибкого шаблона, который можно использовать для переноса данных из таблицы на большой экран:
  "" "Шаблон визуализации боке

Этот шаблон представляет собой общую схему преобразования ваших данных в
визуализация с использованием боке.
"" "
# Обработка данных
импортировать панд как pd
импортировать numpy как np

# Библиотеки боке
из боке.io import output_file, output_notebook
из боке. построение импортного рисунка, шоу
из bokeh.models импортировать ColumnDataSource
from bokeh.layouts импортировать строку, столбец, сетку
из bokeh.models.widgets импортировать вкладки, панель

# Подготовить данные

# Определить, где будет отображаться визуализация
output_file ('filename.html') # Рендеринг в статический HTML, или
output_notebook () # Рендеринг встроенного в Jupyter Notebook

# Установите фигуру (ы)
fig = figure () # Создание экземпляра объекта figure ()

# Подключиться и нарисовать данные

# Организуйте макет

# Предварительный просмотр и сохранение
show (fig) # Посмотрите, что я сделал, и сохраните, если мне это нравится
  
 Некоторые распространенные фрагменты кода, которые можно найти на каждом этапе, показаны выше, и вы увидите, как заполнить остальные, по мере продвижения по оставшейся части руководства!
 Создание вашего первого рисунка 
 Есть несколько способов вывести визуализацию в режиме боке.В этом руководстве вы увидите эти два варианта:
   output_file ('filename.html')   запишет визуализацию в статический файл HTML.
   output_notebook ()   отобразит вашу визуализацию непосредственно в Jupyter Notebook.
 Важно отметить, что ни одна из функций не отображает визуализацию. Этого не произойдет, пока не будет вызван  show () . Однако они гарантируют, что при вызове  show ()  визуализация появится там, где вы хотите.
 При одновременном вызове  output_file ()  и  output_notebook ()  визуализация визуализируется как в статический файл HTML, так и в записной книжке. Однако, если по какой-либо причине вы запустите несколько команд  output_file ()  в одном исполнении, для визуализации будет использоваться только последняя из них.
 Это отличная возможность впервые взглянуть на фигуру Bokeh  по умолчанию ()  с использованием  output_file () :
  # Библиотеки Bokeh
из боке.io импорт output_file
из боке. построение импортного рисунка, шоу

# Рисунок будет отображен в статическом HTML-файле с именем output_file_test.html
выходной_файл ('output_file_test.html',
            title = 'Пустой рисунок боке')

# Настроить общий объект figure ()
fig = рисунок ()

# Посмотрите, как это выглядит
показать (рис)
  
 Как видите, новое окно браузера открылось с вкладкой под названием  Empty Bokeh Figure  и пустым рисунком. Не показан файл, созданный с именем  output_file_test.html  в вашем текущем рабочем каталоге.
 Если вы запустите тот же фрагмент кода с  output_notebook ()  вместо  output_file () , предполагая, что у вас запущен и готов к работе Jupyter Notebook, вы получите следующее:
  # Библиотеки Bokeh
из bokeh.io импортировать output_notebook
из боке. построение импортного рисунка, шоу

# Рисунок будет прямо у меня в Jupyter Notebook
output_notebook ()

# Настроить общий объект figure ()
fig = рисунок ()

# Посмотрите, как это выглядит
показать (рис)
  
 Как видите, результат тот же, только визуализирован в другом месте.
 Более подробную информацию о  output_file ()  и  output_notebook ()  можно найти в официальных документах Bokeh.
  Примечание:  Иногда при последовательном рендеринге нескольких визуализаций вы можете видеть, что прошлые рендеры не очищаются при каждом выполнении. Если вы столкнулись с этим, импортируйте и запустите следующее между выполнениями:
  # Импортировать reset_output (требуется только один раз)
из bokeh.plotting import reset_output

# При необходимости используйте reset_output () между последующими вызовами show ()
reset_output ()
  
 Прежде чем двигаться дальше, вы могли заметить, что фигура Боке по умолчанию поставляется с предварительно загруженной панелью инструментов.Это важный предварительный просмотр интерактивных элементов боке, которые появляются прямо из коробки. Вы узнаете больше о панели инструментов и о том, как ее настроить, в разделе «Добавление взаимодействия» в конце этого руководства.
 Подготовка фигуры к работе с данными 
 Теперь, когда вы знаете, как создавать и просматривать общую фигуру Bokeh в браузере или в Jupyter Notebook, пора узнать больше о том, как настроить объект  figure () .
 Объект  figure ()  - это не только основа визуализации данных, но и объект, который открывает все доступные инструменты Bokeh для визуализации данных.Фигура Bokeh является подклассом объекта Bokeh Plot, который предоставляет многие параметры, позволяющие настраивать эстетические элементы вашей фигуры.
 Чтобы вы могли лишь мельком увидеть доступные параметры настройки, давайте создадим самую уродливую фигуру в истории:
  # Библиотеки Bokeh
из bokeh.io импортировать output_notebook
из боке. построение импортного рисунка, шоу

# Рисунок будет встроен в мой блокнот Jupyter
output_notebook ()

# Пример рисунка
fig = figure (background_fill_color = 'gray',
             background_fill_alpha = 0.5,
             border_fill_color = 'синий',
             border_fill_alpha = 0,25,
             plot_height = 300,
             plot_width = 500,
             h_symmetry = Верно,
             x_axis_label = 'Метка X',
             x_axis_type = 'datetime',
             x_axis_location = 'выше',
             x_range = ('2018-01-01', '2018-06-30'),
             y_axis_label = 'Ярлык Y',
             y_axis_type = 'линейный',
             y_axis_location = 'влево',
             y_range = (0, 100),
             title = 'Пример рисунка',
             title_location = 'право',
             toolbar_location = 'ниже',
             tools = 'сохранить')

# Посмотрите, как это выглядит
показать (рис)
  
 После создания экземпляра объекта  figure ()  вы все равно можете настроить его постфактум.Допустим, вы хотите избавиться от линий сетки:
  # Удалить линии сетки с объекта figure ()
fig.grid.grid_line_color = Нет

# Посмотрите, как это выглядит
показать (рис)
  
 Свойства линии сетки доступны через атрибут  grid  фигуры. В этом случае установка  grid_line_color  на  None  фактически полностью удаляет линии сетки. Более подробную информацию об атрибутах фигур можно найти ниже в документации класса Plot.
  Примечание:  Если вы работаете в записной книжке или в среде IDE с функцией автозаполнения, эта функция определенно может стать вашим другом! Благодаря такому количеству настраиваемых элементов он может быть очень полезен при обнаружении доступных опций:
 В противном случае быстрый поиск в Интернете по ключевому слову  bokeh  и то, что вы пытаетесь сделать, как правило, укажет вам правильное направление.
 Я мог бы затронуть еще много чего, но не думаю, что вы что-то упускаете.Я обязательно буду вводить различные настройки фигуры по ходу обучения. Вот еще несколько полезных ссылок по теме:
  Класс  графика боке является суперклассом объекта  figure () , от которого фигуры наследуют множество своих атрибутов.
  Документация класса Figure  - хорошее место, чтобы найти более подробную информацию об аргументах объекта  figure () .
 Вот несколько конкретных вариантов настройки, которые стоит проверить:
  Свойства текста  охватывает все атрибуты, связанные с изменением стилей, размеров, цветов и т. Д. Шрифтов.
  TickFormatters  - это встроенные объекты, специально предназначенные для форматирования осей с использованием синтаксиса форматирования строк, подобного Python.
 Иногда непонятно, как настроить фигуру, пока в ней не будут визуализированы какие-то данные, поэтому теперь вы узнаете, как это сделать.
 Рисование данных с символами 
 Пустая фигура не так уж и интересна, поэтому давайте посмотрим на глифы: строительные блоки визуализации боке. Глиф - это векторизованная графическая форма или маркер, который используется для представления ваших данных в виде круга или квадрата.Больше примеров можно найти в галерее Боке. После того, как вы создадите свою фигуру, вам будет предоставлен доступ к набору настраиваемых методов глифов.
 Давайте начнем с очень простого примера, нарисовав несколько точек на координатной сетке x-y:
  # Библиотеки Bokeh
из bokeh.io импорт output_file
из боке. построение импортного рисунка, шоу

# Мои данные о координатах x-y
х = [1, 2, 1]
у = [1, 1, 2]

# Вывести визуализацию прямо в блокнот
output_file ('first_glyphs.html', title = 'Первые глифы')

# Создать фигуру без панели инструментов и диапазонов осей [0,3]
fig = figure (title = 'Мои координаты',
             plot_height = 300, plot_width = 300,
             x_range = (0, 3), y_range = (0, 3),
             toolbar_location = Нет)

# Нарисуйте координаты в виде кругов
инжир.круг (х = х, у = у,
           цвет = 'зеленый', размер = 10, альфа = 0,5)

# Показать сюжет
показать (рис)
  
 После того, как ваша фигура будет создана, вы можете увидеть, как ее можно использовать для рисования данных координат x-y с использованием настроенных глифов круга  .
 Вот несколько категорий глифов:
  Маркер  включает фигуры, такие как круги, ромбы, квадраты и треугольники, и эффективен для создания визуализаций, таких как точечные и пузырьковые диаграммы.
  Line  охватывает такие вещи, как одно-, ступенчатые и многолинейные фигуры, которые можно использовать для построения линейных диаграмм.
 Гистограмма / прямоугольник  Фигуры  можно использовать для создания традиционных или составных столбчатых диаграмм ( гбар, ) и столбцов ( гбар, ), а также каскадных диаграмм или диаграмм Ганта.
 Информацию о вышеперечисленных и других глифах можно найти в Справочном руководстве Bokeh.
 Эти глифы можно комбинировать по мере необходимости, чтобы они соответствовали вашим потребностям в визуализации. Допустим, я хочу создать визуализацию, которая показывает, сколько слов я написал за день, чтобы сделать это руководство, с наложенной линией тренда совокупного количества слов:
  импортировать numpy как np

# Библиотеки боке
из боке.io импорт output_notebook
из боке. построение импортного рисунка, шоу

# Мои данные о подсчете слов
day_num = np.linspace (1, 10, 10)
daily_words = [450, 628, 488, 210, 287, 791, 508, 639, 397, 943]
cumulative_words = np.cumsum (daily_words)

# Вывести визуализацию прямо в блокнот
output_notebook ()

# Создаем фигуру с осью x типа datetime
fig = figure (title = 'Мои успехи в обучении',
             plot_height = 400, plot_width = 700,
             x_axis_label = 'Номер дня', y_axis_label = 'Написанные слова',
             x_minor_ticks = 2, y_range = (0, 6000),
             toolbar_location = Нет)

# Ежедневные слова будут представлены в виде вертикальных полос (столбцов)
инжир.vbar (x = day_num, bottom = 0, top = daily_words,
         цвет = 'синий', ширина = 0,75,
         легенда = 'Ежедневно')

# Накопленная сумма будет линией тренда
fig.line (x = day_num, y = cumulative_words,
         color = 'серый', line_width = 1,
         legend = 'Накопительное')

# Поместите легенду в левый верхний угол
fig.legend.location = 'top_left'

# Давайте проверим
показать (рис)
  
 Чтобы объединить столбцы и линии на рисунке, они просто создаются с использованием одного и того же объекта  figure () .
 Кроме того, вы можете увидеть выше, как легко можно создать легенду, установив свойство  legend  для каждого глифа. Затем легенда была перемещена в верхний левый угол графика путем присвоения  'top_left'   fig.legend.location .
 Вы можете найти гораздо больше информации о легендах стиля. Тизер: они снова появятся позже в руководстве, когда мы начнем копаться в интерактивных элементах визуализации.
 Немного о данных 
 Каждый раз, когда вы изучаете новую библиотеку визуализации, рекомендуется начать с некоторых данных в знакомой вам области.Прелесть боке в том, что почти любая идея, которая у вас есть, должна быть возможна. Вопрос лишь в том, как вы хотите использовать для этого доступные инструменты.
 В остальных примерах будут использоваться общедоступные данные из Kaggle, который содержит информацию о сезоне 2017–18 Национальной баскетбольной ассоциации (НБА), а именно:
 Эти данные не имеют ничего общего с тем, что я делаю по работе, но я люблю баскетбол и люблю думать о способах визуализации постоянно растущего объема данных, связанных с ним.
 Если у вас нет данных, с которыми можно поиграть в школе или на работе, подумайте о том, что вас интересует, и попытайтесь найти данные, связанные с этим. Это во многом сделает обучение и творческий процесс более быстрым и приятным!
 Чтобы следовать примерам в руководстве, вы можете загрузить наборы данных по ссылкам выше и прочитать их в Pandas  DataFrame , используя следующие команды:
  импорт панд как pd

# Прочитать csv файлы
player_stats = pd.read_csv ('2017-18_playerBoxScore.csv', parse_dates = ['gmDate'])
team_stats = pd.read_csv ('2017-18_teamBoxScore.csv', parse_dates = ['gmDate'])
standings = pd.read_csv ('2017-18_standings.csv', parse_dates = ['stDate'])
  
 Этот фрагмент кода считывает данные из трех файлов CSV и автоматически интерпретирует столбцы даты как объекты  datetime .
 Пришло время получить реальные данные.
 Использование 
 ColumnDataSource  Object
 В приведенных выше примерах для представления данных использовались списки Python и массивы Numpy, и Bokeh хорошо приспособлено для обработки этих типов данных.Однако, когда дело доходит до данных в Python, вы, скорее всего, встретите словари Python и Pandas DataFrames, особенно если вы читаете данные из файла или внешнего источника данных.
 Bokeh хорошо оборудован для работы с этими более сложными структурами данных и даже имеет встроенные функции для их обработки, а именно  ColumnDataSource .
 Вы можете спросить себя: «Зачем использовать  ColumnDataSource , если Bokeh может напрямую взаимодействовать с другими типами данных?»
 Во-первых, независимо от того, ссылаетесь ли вы на список, массив, словарь или DataFrame напрямую, Bokeh все равно превратит его в  ColumnDataSource  за кулисами.Что еще более важно,  ColumnDataSource  значительно упрощает реализацию интерактивных возможностей Bokeh.
  ColumnDataSource  лежит в основе передачи данных глифам, которые вы используете для визуализации. Его основная функция - отображать имена столбцам ваших данных. Это упрощает использование ссылок на элементы данных при построении визуализации. Это также упрощает то же самое для Bokeh при построении вашей визуализации.
  ColumnDataSource  может интерпретировать три типа объектов данных:
  Python  dict  : Ключи - это имена, связанные с соответствующими последовательностями значений (списки, массивы и т. Д.).
  Pandas  DataFrame  : столбцы  DataFrame  становятся ссылочными именами для  ColumnDataSource .
  Pandas  groupby  : столбцы  ColumnDataSource  ссылаются на столбцы, как видно при вызове  groupby.describe () .
 Давайте начнем с визуализации гонки за первое место в Западной конференции НБА в 2017–2018 годах между действующим чемпионом Golden State Warriors и претендентом Houston Rockets.Ежедневные записи о победах и поражениях этих двух команд хранятся в DataFrame с именем  west_top_2 :
.
>>>
  >>> west_top_2 = (турнирная таблица [(турнирная таблица ['teamAbbr'] == 'HOU') | (турнирная таблица ['teamAbbr'] == 'GS')]
... .loc [:, ['stDate', 'teamAbbr', 'gameWon']]
... .sort_values ​​(['teamAbbr', 'stDate']))
>>> west_top_2.head ()
        stDate teamAbbr gameWon
9 2017-10-17 GS 0
39 2017-10-18 GS 0
69 2017-10-19 GS 0
99 2017-10-20 GS 1
129 2017-10-21 GS 1
  
 Отсюда вы можете загрузить этот  DataFrame  в два объекта  ColumnDataSource  и визуализировать гонку:
  # Библиотеки боке
из боке.построение рисунка импорта, показать
из bokeh.io импорт output_file
из bokeh.models импортировать ColumnDataSource

# Вывод в файл
output_file ('запад-топ-2-турнирная гонка.html',
            title = 'Две лучшие команды Западной конференции выигрывают гонку')

# Изолируйте данные для ракет и воинов
rockets_data = west_top_2 [west_top_2 ['teamAbbr'] == 'HOU']
warriors_data = west_top_2 [west_top_2 ['teamAbbr'] == 'GS']

# Создаем объект ColumnDataSource для каждой команды
rockets_cds = ColumnDataSource (rockets_data)
warriors_cds = ColumnDataSource (warriors_data)

# Создаем и настраиваем фигуру
fig = figure (x_axis_type = 'datetime',
             plot_height = 300, plot_width = 600,
             title = 'Гонка побед двух лучших команд Западной конференции, 2017-18 гг.',
             x_axis_label = 'Дата', y_axis_label = 'Победы',
             toolbar_location = Нет)

# Отрисовываем гонку в виде ступенчатых линий
инжир.step ('stDate', 'gameWon',
         color = '# CE1141', legend = 'Rockets',
         источник = rockets_cds)
fig.step ('stDate', 'gameWon',
         color = '# 006BB6', legend = 'Воины',
         источник = warriors_cds)

# Переместите легенду в верхний левый угол
fig.legend.location = 'top_left'

# Показать сюжет
показать (рис)
  
 Обратите внимание, как ссылаются на соответствующие объекты  ColumnDataSource  при создании двух строк. Вы просто передаете исходные имена столбцов в качестве входных параметров и указываете, какой  ColumnDataSource  использовать, через свойство  source .
 Визуализация показывает напряженную гонку в течение всего сезона, при этом Warriors строят довольно большую подушку в середине сезона. Тем не менее, небольшой спад в конце сезона позволил «Рокетс» наверстать упущенное и, в конечном итоге, превзойти защищающихся чемпионов и завершить сезон в качестве посева номер один в Западной конференции.
  Примечание.  В боке можно указать цвета по имени, шестнадцатеричному значению или цветовому коду RGB.
 Для визуализации выше указан цвет соответствующих линий, представляющих две команды.Вместо использования названий цветов CSS, таких как  «красный»  для Ракет и  «синий»  для Воинов, вы, возможно, захотели добавить приятный визуальный штрих, используя официальные цвета команд в виде шестнадцатеричных цветовых кодов. В качестве альтернативы вы могли бы использовать кортежи, представляющие цветовые коды RGB:  (206, 17, 65)  для ракет,  (0, 107, 182)  для воинов.
 Bokeh предоставляет полезный список названий цветов CSS, сгруппированных по их общему оттенку. Также htmlcolorcodes.com - отличный сайт для поиска цветовых кодов CSS, шестнадцатеричного и RGB.
  Объекты ColumnDataSource  могут не только служить простым способом ссылки на столбцы  DataFrame . Объект  ColumnDataSource  имеет три встроенных фильтра, которые можно использовать для создания представлений ваших данных с помощью объекта  CDSView :
   GroupFilter   выбирает строки из  ColumnDataSource  на основе категориального ссылочного значения
   IndexFilter   фильтрует  ColumnDataSource  через список целочисленных индексов
   BooleanFilter   позволяет использовать список  логических значений  с выбранными строками  True 
 В предыдущем примере были созданы два объекта  ColumnDataSource , по одному из подмножества фрейма данных  west_top_2 .В следующем примере будет воссоздан тот же вывод из одного  ColumnDataSource  на основе всего  west_top_2  с использованием  GroupFilter , который создает представление для данных:
  # Библиотеки боке
из боке. построение импортного рисунка, шоу
из bokeh.io импорт output_file
из bokeh.models импортировать ColumnDataSource, CDSView, GroupFilter

# Вывод в файл
output_file ('запад-топ-2-турнирная гонка.html',
            title = 'Две лучшие команды Западной конференции выигрывают гонку')

# Создать ColumnDataSource
west_cds = ColumnDataSource (west_top_2)

# Создайте представления для каждой команды
rockets_view = CDSView (source = west_cds,
                       фильтры = [GroupFilter (column_name = 'teamAbbr', group = 'HOU')])
warriors_view = CDSView (источник = west_cds,
                        фильтры = [GroupFilter (column_name = 'teamAbbr', group = 'GS')])

# Создаем и настраиваем фигуру
west_fig = фигура (x_axis_type = 'datetime',
                  plot_height = 300, plot_width = 600,
                  title = 'Гонка побед двух лучших команд Западной конференции, 2017-18 гг.',
                  x_axis_label = 'Дата', y_axis_label = 'Победы',
                  toolbar_location = Нет)

# Отрисовываем гонку в виде ступенчатых линий
west_fig.step ('stDate', 'gameWon',
              source = west_cds, view = rockets_view,
              color = '# CE1141', legend = 'Rockets')
west_fig.step ('stDate', 'gameWon',
              source = west_cds, view = warriors_view,
              color = '# 006BB6', legend = 'Warriors')

# Переместите легенду в верхний левый угол
west_fig.legend.location = 'top_left'

# Показать сюжет
показать (west_fig)
  
 Обратите внимание, как  GroupFilter  передается в  CDSView  в виде списка. Это позволяет вам комбинировать несколько фильтров вместе, чтобы изолировать нужные данные из  ColumnDataSource  по мере необходимости.
 Для получения информации об интеграции источников данных ознакомьтесь с публикацией руководства пользователя Bokeh о  ColumnDataSource  и других доступных исходных объектах.
 Западная конференция закончилась захватывающей гонкой, но скажем, вы хотите увидеть, была ли Восточная конференция такой же напряженной. Не только это, но вы хотите просмотреть их в одной визуализации. Это отличный переход к следующей теме: макеты.
 Организация нескольких визуализаций с помощью макетов 
 В турнирной таблице Восточной конференции остались два соперника в Атлантическом дивизионе: «Бостон Селтикс» и «Торонто Рэпторс».Перед тем, как повторить шаги, использованные для создания  west_top_2 , давайте попробуем еще раз протестировать  ColumnDataSource , используя то, что вы узнали выше.
 В этом примере вы увидите, как передать весь DataFrame в  ColumnDataSource  и создать представления для выделения соответствующих данных:
  # Библиотеки боке
из боке. построение импортного рисунка, шоу
из bokeh.io импорт output_file
из bokeh.models импортировать ColumnDataSource, CDSView, GroupFilter

# Вывод в файл
output_file ('восток-топ-2-турнирная гонка.html ',
            title = 'Две лучшие команды Восточной конференции выиграли гонку')

# Создать ColumnDataSource
standings_cds = ColumnDataSource (турнирная таблица)

# Создайте представления для каждой команды
celtics_view = CDSView (источник = standings_cds,
                      Filters = [GroupFilter (column_name = 'teamAbbr',
                                           group = 'BOS')])
raptors_view = CDSView (источник = standings_cds,
                      Filters = [GroupFilter (column_name = 'teamAbbr',
                                           group = 'TOR')])

# Создаем и настраиваем фигуру
east_fig = фигура (x_axis_type = 'datetime',
           plot_height = 300, plot_width = 600,
           title = 'Гонка побед двух лучших команд Восточной конференции, 2017-18 гг.',
           x_axis_label = 'Дата', y_axis_label = 'Победы',
           toolbar_location = Нет)

# Отрисовываем гонку в виде ступенчатых линий
east_fig.step ('stDate', 'gameWon',
              color = '# 007A33', legend = 'Celtics',
              source = standings_cds, view = celtics_view)
east_fig.step ('stDate', 'gameWon',
              color = '# CE1141', legend = 'Raptors',
              source = standings_cds, view = raptors_view)

# Переместите легенду в верхний левый угол
east_fig.legend.location = 'top_left'

# Показать сюжет
показать (east_fig)
  
  ColumnDataSource  смог изолировать релевантные данные в пределах 5,040 на 39  DataFrame  без особого труда, сохранив при этом несколько строк кода Pandas.
 Глядя на визуализацию, вы можете увидеть, что гонка Восточной конференции не была сутулой. После того, как «Селтикс» вылетели из ворот, «Рэпторс» отскочили назад, чтобы обогнать своего соперника в дивизионе и завершить регулярный сезон еще пятью победами.
 Когда две наши визуализации готовы, пора собрать их воедино.
 Подобно функциям подзаголовка   в Matplotlib, Bokeh предлагает функции  столбца ,  строки  и  сетки  в своем боке .макеты  модуля. Эти функции в более общем плане можно классифицировать как макеты , .
 Использование очень простое. Если вы хотите разместить две визуализации в вертикальной конфигурации, вы можете сделать это следующим образом:
  # Библиотека боке
из боке. построение импортного рисунка, шоу
из bokeh.io импорт output_file
из столбца импорта bokeh.layouts

# Вывод в файл
output_file ('восток-запад-топ-2-турнирная гонка.html',
            title = 'Две лучшие команды конференции выигрывают гонку')

# Постройте две визуализации в вертикальной конфигурации
показать (столбец (west_fig, east_fig))
  
 Я сохраню вам две строки кода, но будьте уверены, что замена  столбца  на  строки  в приведенном выше фрагменте аналогичным образом настроит два графика в горизонтальной конфигурации.
  Примечание:  Если вы пробуете фрагменты кода во время изучения руководства, я хочу сделать небольшой обходной путь, чтобы устранить ошибку, которую вы можете увидеть при доступе к  west_fig  и  east_fig  в следующих примерах. При этом вы можете получить такую ​​ошибку:
  ВНИМАНИЕ: bokeh.core.validation.check: W-1004 (BOTH_CHILD_AND_ROOT): модели не должны быть корнем документа ...
  
 Это одна из многих ошибок, которые являются частью модуля проверки Bokeh, где  w-1004 , в частности, предупреждает о повторном использовании  west_fig  и  east_fig  в новом макете.
 Чтобы избежать этой ошибки при тестировании примеров, добавьте к фрагменту кода, иллюстрирующему каждый макет, следующее:
  # Библиотеки боке
из боке. построение импортного рисунка, шоу
из bokeh.models импортировать ColumnDataSource, CDSView, GroupFilter

# Создать ColumnDataSource
standings_cds = ColumnDataSource (турнирная таблица)

# Создайте представления для каждой команды
celtics_view = CDSView (источник = standings_cds,
                      Filters = [GroupFilter (column_name = 'teamAbbr',
                                           group = 'BOS')])

raptors_view = CDSView (источник = standings_cds,
                      Filters = [GroupFilter (column_name = 'teamAbbr',
                                           group = 'TOR')])

rockets_view = CDSView (source = standings_cds,
                      Filters = [GroupFilter (column_name = 'teamAbbr',
                                           group = 'HOU')])
warriors_view = CDSView (источник = standings_cds,
                      Filters = [GroupFilter (column_name = 'teamAbbr',
                                           group = 'GS')])

# Создаем и настраиваем фигуру
east_fig = фигура (x_axis_type = 'datetime',
                  plot_height = 300,
                  x_axis_label = 'Дата',
                  y_axis_label = 'Победы',
                  toolbar_location = Нет)

west_fig = фигура (x_axis_type = 'datetime',
                  plot_height = 300,
                  x_axis_label = 'Дата',
                  y_axis_label = 'Победы',
                  toolbar_location = Нет)

# Настроить цифры для каждой конференции
east_fig.step ('stDate', 'gameWon',
              color = '# 007A33', legend = 'Celtics',
              source = standings_cds, view = celtics_view)
east_fig.step ('stDate', 'gameWon',
              color = '# CE1141', legend = 'Raptors',
              source = standings_cds, view = raptors_view)

west_fig.step ('stDate', 'gameWon', color = '# CE1141', legend = 'Rockets',
              source = standings_cds, view = rockets_view)
west_fig.step ('stDate', 'gameWon', color = '# 006BB6', legend = 'Воины',
              source = standings_cds, view = warriors_view)

# Переместите легенду в верхний левый угол
east_fig.legend.location = 'top_left'
west_fig.legend.location = 'top_left'

# Здесь идет фрагмент кода макета!
  
 Это приведет к обновлению соответствующих компонентов для визуализации визуализации без предупреждения.
 Вместо использования столбца   или строки   вы можете использовать сетку  .
 Одним из ключевых отличий сетки  от  является то, что он автоматически объединяет панель инструментов по всем своим дочерним фигурам.Две приведенные выше визуализации не имеют панели инструментов, но если бы они были, то каждая фигура имела бы свою собственную при использовании  столбца  или  строки . При этом у него также есть собственное свойство  toolbar_location , которое, как показано ниже, установлено на  'right' .
 Синтаксически вы также заметите ниже, что график сетки   отличается тем, что вместо передачи кортежа в качестве входных данных ему требуется список списков, где каждый подсписок представляет собой строку в сетке:
  # Библиотеки боке
из боке.io импорт output_file
from bokeh.layouts импортировать сетку

# Вывод в файл
output_file ('восток-запад-топ-2-gridplot.html',
            title = 'Две лучшие команды конференции выигрывают гонку')

# Уменьшаем ширину обеих фигур
east_fig.plot_width = west_fig.plot_width = 300

# Редактировать заголовки
east_fig.title.text = 'Восточная конференция'
west_fig.title.text = 'Западная конференция'

# Настроить сетку
east_west_gridplot = график сетки ([[west_fig, east_fig]],
                              toolbar_location = 'право')

# Постройте две визуализации в горизонтальной конфигурации
показать (east_west_gridplot)
  
 Наконец, график сетки   позволяет передавать значения  Нет, , которые интерпретируются как пустые подграфикы.Следовательно, если вы хотите оставить заполнитель для двух дополнительных графиков, вы можете сделать что-то вроде этого:
  # Библиотеки боке
из bokeh.io импорт output_file
from bokeh.layouts импортировать сетку

# Вывод в файл
output_file ('восток-запад-топ-2-gridplot.html',
            title = 'Две лучшие команды конференции выигрывают гонку')

# Уменьшаем ширину обеих фигур
east_fig.plot_width = west_fig.plot_width = 300

# Редактировать заголовки
east_fig.title.text = 'Восточная конференция'
west_fig.title.text = 'Западная конференция'

# Постройте две визуализации с заполнителями
east_west_gridplot = gridplot ([[west_fig, None], [None, east_fig]],
                              toolbar_location = 'право')

# Постройте две визуализации в горизонтальной конфигурации
показать (east_west_gridplot)
  
 Если вы предпочитаете переключаться между обеими визуализациями в их полном размере, не сжимая их, чтобы они поместились рядом или поверх друг друга, хорошим вариантом является макет с вкладками.
 Макет с вкладками состоит из двух функций виджета Bokeh:  Tab ()  и  Panel ()  из подмодуля  bokeh.models.widgets . Как и при использовании  gridplot () , создание макета с вкладками довольно просто:
  # Библиотека боке
из bokeh.io импорт output_file
из bokeh.models.widgets импортировать вкладки, панель

# Вывод в файл
output_file ('восток-запад-верх-2-tabbed_layout.html',
            title = 'Две лучшие команды конференции выигрывают гонку')

# Увеличиваем ширину графика
east_fig.plot_width = west_fig.plot_width = 800

# Создайте две панели, по одной для каждой конференции
east_panel = Панель (child = east_fig, title = 'Восточная конференция')
west_panel = Панель (child = west_fig, title = 'Западная конференция')

# Назначьте панели вкладкам
tabs = Вкладки (tabs = [west_panel, east_panel])

# Показать макет с вкладками
показать (вкладки)
  
 Первый шаг - создать панель  ()  для каждой вкладки. Это может показаться немного запутанным, но подумайте о функции  Tabs ()  как о механизме, который организует отдельные вкладки, созданные с помощью  Panel () .
 Каждая панель  Panel ()  принимает в качестве входных данных дочерний элемент, который может быть либо одной фигурой  () , либо макетом. (Помните, что макет - это общее имя для столбца  , строки   или графика сетки  .) После того, как ваши панели собраны, их можно передать в качестве входных данных в  Tabs ()  в виде списка.
 Теперь, когда вы понимаете, как получить доступ, нарисовать и упорядочить данные, пора перейти к настоящей магии боке: взаимодействию! Как всегда, ознакомьтесь с Руководством пользователя Bokeh для получения дополнительной информации о макетах.
 Добавление взаимодействия 
 Особенность, которая отличает Bokeh, - это способность легко реализовать интерактивность в вашей визуализации. Боке даже описывает себя как интерактивную библиотеку визуализации  :
 Bokeh - это интерактивная библиотека визуализации, предназначенная для презентаций в современных веб-браузерах. (Источник)
 В этом разделе мы коснемся пяти способов добавления интерактивности:
 Настройка панели инструментов
 Выбор точек данных
 Добавление действий при наведении
 Связывание осей и выборок
 Выделение данных с помощью легенды
 Реализация этих интерактивных элементов открывает возможности для изучения ваших данных, которые статические визуализации просто не могут сделать сами по себе.
 Настройка панели инструментов 
 Как вы уже видели в «Создание вашей первой фигуры», фигура Bokeh  по умолчанию ()  поставляется с панелью инструментов прямо из коробки. Панель инструментов по умолчанию содержит следующие инструменты (слева направо):
 Панель инструментов может быть удалена путем передачи  toolbar_location = None  при создании экземпляра объекта figure ()   или перемещена путем передачи любого из  'выше' ,  'ниже' ,  'слева'  или  ' справа '.
 Кроме того, панель инструментов может быть настроена для включения любой комбинации инструментов по вашему желанию. Bokeh предлагает 18 специальных инструментов в пяти категориях:
  Панорамирование / перетаскивание :  box_select ,  box_zoom ,  lasso_select ,  pan ,  xpan ,  ypan ,  resize_select 
  Щелчок / касание :  poly_select ,  нажатие 
  Прокрутка / масштабирование :  wheel_zoom ,  xwheel_zoom ,  ywheel_zoom 
  Действия :  отменить ,  повторить ,  сбросить ,  сохранить 
  Инспекторы :  прицел ,  наведение 
 Чтобы познакомиться с инструментами, обязательно посетите Specifying Tools.В противном случае они будут проиллюстрированы при освещении различных взаимодействий, описанных здесь.
 Выбор точек данных 
 Реализовать поведение выбора так же просто, как добавить несколько конкретных ключевых слов при объявлении ваших глифов.
 В следующем примере будет создана диаграмма разброса, которая связывает общее количество трехочковых попыток игрока с процентным соотношением (для игроков, сделавших не менее 100 трехочковых бросков).
 Данные могут быть агрегированы из  player_stats  DataFrame:
  # Найти игроков, сделавших хотя бы 1 трехочковый бросок за сезон
three_takers = player_stats [player_stats ['play3PA']> 0]

# Убрать имена игроков, поместив их в один столбец
three_takers ['name'] = [f '{p ["playFNm"]} {p ["playLNm"]}'
                        для _, p в три_задача.iterrows ()]

# Суммируйте общее количество трехочковых попыток и количество попыток для каждого игрока
three_takers = (three_takers.groupby ('имя')
                            .sum ()
                            .loc [:, ['play3PA', 'play3PM']]
                            .sort_values ​​('play3PA', ascending = False))

# Отфильтровать всех, кто не сделал хотя бы 100 трехочковых бросков
three_takers = three_takers [three_takers ['play3PA']> = 100] .reset_index ()

# Добавить столбец с рассчитанным трехбалльным процентом (выполнено / предпринято)
three_takers ['pct3PM'] = three_takers ['play3PM'] / three_takers ['play3PA']
  
 Вот образец полученного  DataFrame :
 >>>
  >>> three_takers.образец (5)
                   имя play3PA play3PM pct3PM
229 Кори Брюэр 110 31 0,281818
78 Марк Газоль 320109 0,340625
126 Раймонд Фелтон 230 81 0,352174
127 Кристапс Порзикис 229 90 0,393013
66 Джош Ричардсон 336127 0,377976
  
 Допустим, вы хотите выбрать группы игроков в раздаче и при этом отключить цвет глифов, представляющих невыбранных игроков:
  # Библиотеки Bokeh
из боке.построение рисунка импорта, показать
из bokeh.io импорт output_file
из bokeh.models импортировать ColumnDataSource, NumeralTickFormatter

# Вывод в файл
output_file ('трехточечный-att-vs-pct.html',
            title = 'Трёхточечные попытки против процента')

# Хранить данные в ColumnDataSource
three_takers_cds = ColumnDataSource (three_takers)

# Укажите инструменты выбора, которые будут доступны
select_tools = ['box_select', 'lasso_select', 'poly_select', 'касание', 'сбросить']

# Создаем фигуру
fig = figure (plot_height = 400,
             plot_width = 600,
             x_axis_label = 'Попытка трехочкового броска',
             y_axis_label = 'Сделано в процентах',
             title = 'Попытка выстрелов 3PT vs.Процент произведенных (мин. 100 3PA), 2017-18 ',
             toolbar_location = 'ниже',
             tools = select_tools)

# Отформатируйте метки делений оси Y в процентах
fig.yaxis [0] .formatter = NumeralTickFormatter (format = '00 .0% ')

# Добавить квадрат, представляющий каждого игрока
fig.square (x = 'play3PA',
           y = 'pct3PM',
           source = three_takers_cds,
           цвет = 'королевский синий',
           selection_color = 'темно-синий',
           nonselection_color = 'светло-серый',
           nonselection_alpha = 0,3)

# Визуализировать
показать (рис)
  
 Сначала укажите инструменты выбора, которые вы хотите сделать доступными.В приведенном выше примере  'box_select' ,  'lasso_select' ,  'poly_select'  и  'tap'  (плюс кнопка сброса) были указаны в списке под названием  select_tools . При создании экземпляра фигуры панель инструментов располагается на  «ниже»  графика, и список передается в  tools , чтобы сделать инструменты, выбранные выше, доступными.
 Каждый игрок изначально представлен синим квадратным глифом, но при выборе игрока или группы игроков устанавливаются следующие конфигурации:
 Превратите выбранного игрока (ов) в  deepskyblue 
 Измените глифы всех невыбранных игроков на светло-серый цвет   с  0.3  непрозрачность
 Вот и все! После нескольких быстрых добавлений визуализация теперь выглядит так:
 Для получения дополнительной информации о том, что вы можете делать после выбора, ознакомьтесь с выделенными и невыбранными глифами.
 Добавление действий при наведении 
 Итак, возможность выбора конкретных точек данных игроков, которые кажутся интересными на моем графике рассеяния, реализована, но что, если вы хотите быстро увидеть, каких отдельных игроков представляет глиф? Один из вариантов - использовать Bokeh  HoverTool ()  для отображения всплывающей подсказки, когда курсор пересекает пути с глифом.Все, что вам нужно сделать, это добавить в приведенный выше фрагмент кода следующее:
  # Библиотека боке
из bokeh.models импортировать HoverTool

# Отформатируйте всплывающую подсказку
tooltips = [
            ('Имя игрока'),
            ('Three-Pointers Made', '@ play3PM'),
            ('Попытка трех указателей', '@ play3PA'),
            ('Трехточечный процент', '@ pct3PM {00.0%}'),
           ]

# Добавляем HoverTool к фигуре
fig.add_tools (HoverTool (tooltips = tooltips))

# Визуализировать
показать (рис)
  
  HoverTool ()  немного отличается от инструментов выделения, которые вы видели выше, тем, что у него есть свойства, в частности  всплывающих подсказок .
 Во-первых, вы можете настроить отформатированную всплывающую подсказку, создав список кортежей, содержащий описание и ссылку на  ColumnDataSource . Этот список был передан в качестве входных данных в  HoverTool () , а затем просто добавлен к рисунку с помощью  add_tools () . Вот что произошло:
 Обратите внимание на добавление кнопки  Hover  на панель инструментов, которую можно включать и выключать.
 Если вы хотите еще больше подчеркнуть игроков при наведении, Bokeh делает это возможным с помощью инспекций при наведении.Вот немного измененная версия фрагмента кода, в который добавлена ​​всплывающая подсказка:
  # Отформатировать всплывающую подсказку
tooltips = [
            ('Имя игрока'),
            ('Three-Pointers Made', '@ play3PM'),
            ('Попытка трех указателей', '@ play3PA'),
            ('Трехточечный процент', '@ pct3PM {00.0%}'),
           ]

# Настроить рендерер, который будет использоваться при наведении курсора
hover_glyph = fig.circle (x = 'play3PA', y = 'pct3PM', source = three_takers_cds,
                         размер = 15, альфа = 0,
                         hover_fill_color = 'черный', hover_alpha = 0.5)

# Добавляем HoverTool к фигуре
fig.add_tools (HoverTool (tooltips = tooltips, renderers = [hover_glyph]))

# Визуализировать
показать (рис)
  
 Это делается путем создания совершенно нового глифа, в данном случае кругов вместо квадратов, и присвоения ему значения  hover_glyph . Обратите внимание, что начальная непрозрачность установлена ​​на ноль, поэтому она невидима, пока курсор не коснется ее. Свойства, которые появляются при наведении курсора, фиксируются путем установки  hover_alpha  на  0,5  вместе с  hover_fill_color .
 Теперь вы увидите маленький черный кружок, появляющийся над исходным квадратом при наведении курсора на различные маркеры:
 Для дальнейшего изучения возможностей  HoverTool ()  см. Руководства HoverTool и Hover Inspections.
 Связывание осей и выделений 
 Связывание - это процесс синхронизации элементов различных визуализаций в макете. Например, может быть, вы хотите связать оси нескольких графиков, чтобы гарантировать, что если вы увеличите масштаб на одном, он отразится на другом.Посмотрим, как это делается.
 В этом примере визуализация сможет перемещаться по различным сегментам расписания команды и изучать различную игровую статистику. Каждая статистика будет представлена ​​своим собственным графиком в сетке  размером два на два () .
 Данные могут быть собраны из  team_stats  DataFrame, выбрав Philadelphia 76ers в качестве интересующей команды:
  # Изолировать соответствующие данные
phi_gm_stats = (team_stats [(team_stats ['teamAbbr'] == 'PHI') &
                           (team_stats ['SeasTyp'] == 'Обычный')]
                .loc [:, ['gmDate',
                         'teamPTS',
                         'teamTRB',
                         'teamAST',
                         'teamTO',
                         'opptPTS',]]
                .sort_values ​​('gmDate'))

# Добавить номер игры
phi_gm_stats ['game_num'] = диапазон (1, len (phi_gm_stats) +1)

# Получение столбца win_loss
win_loss = []
для _ строка в phi_gm_stats.iterrows ():

    # Если 76-е наберут больше очков, это победа
    если строка ['teamPTS']> строка ['opptPTS']:
        win_loss.добавить ('W')
    еще:
        win_loss.append ('L')

# Добавить данные win_loss в DataFrame
phi_gm_stats ['winLoss'] = win_loss
  
 Вот результаты первых 5 игр 76ers:
 >>>
  >>> phi_gm_stats.head ()
        gmDate teamPTS teamTRB teamAST teamTO opptPTS game_num winLoss
10 2017-10-18 115 48 25 17120 1 л
39 2017-10-20 92 47 20 17102 2 л
52 2017-10-21 94 41 18 20128 3 л
80 2017-10-23 97 49 25 21 86 4 Вт
113 2017-10-25 104 43 29 16105 5 л
  
 Начните с импорта необходимых библиотек Bokeh, определения выходных параметров и считывания данных в  ColumnDataSource :
  # Библиотеки Bokeh
из боке.построение рисунка импорта, показать
из bokeh.io импорт output_file
из bokeh.models импортировать ColumnDataSource, CategoriesColorMapper, Div
from bokeh.layouts импортировать сетку, столбец

# Вывод в файл
выходной_файл ('phi-gm-connected-stats.html',
                title = 'Игровой журнал 76ers')

# Хранить данные в ColumnDataSource
gm_stats_cds = ColumnDataSource (phi_gm_stats)
  
 Каждая игра представлена ​​столбцом и будет окрашена в зеленый цвет, если результатом была победа, и красным в случае проигрыша. Для этого можно использовать объект Bokeh  CategoryColorMapper  для сопоставления значений данных с указанными цветами:
  # Создайте объект CategoryColorMapper, который назначает цвет победам и поражениям
win_loss_mapper = CategoryColorMapper (факторы = ['W', 'L'],
                                         palette = ['зеленый', 'красный'])
  
 Для этого варианта использования список, определяющий значения категорийных данных, которые должны отображаться, передается в факторы  , а список с намеченными цветами - в палитру  .Для получения дополнительной информации о  CategoryColorMapper  см. Раздел «Цвета» в «Обработке категориальных данных» в Руководстве пользователя Bokeh.
 На сетке   два на два нужно визуализировать четыре статистики: очки, передачи, подборы и потери. При создании четырех фигур и настройке соответствующих диаграмм в свойствах есть много избыточности. Таким образом, для оптимизации кода можно использовать цикл  для :
  # Создаем dict с названием статистики и соответствующей колонкой в ​​данных
stat_names = {'Очки': 'teamPTS',
              'Assists': 'teamAST',
              'Подборы': 'teamTRB',
              'Обороты': 'teamTO',}

# Цифра для каждой характеристики будет храниться в этом слове
stat_figs = {}

# Для каждой характеристики в dict
для stat_label, stat_col в stat_names.Предметы():

    # Создать фигуру
    fig = figure (y_axis_label = stat_label,
                 plot_height = 200, plot_width = 400,
                 x_range = (1, 10), tools = ['xpan', 'reset', 'save'])

    # Настроить vbar
    fig.vbar (x = 'game_num', top = stat_col, source = gm_stats_cds, width = 0.9,
             color = dict (field = 'winLoss', transform = win_loss_mapper))

    # Добавляем фигуру в stat_figs dict
    stat_figs [stat_label] = рис
  
 Как видите, единственными параметрами, которые необходимо было отрегулировать, были  метка оси y  на рисунке и данные, которые будут определять  вершину  в  vbar .Эти значения легко сохранялись в  dict , который проходил итерацию для создания цифр для каждого показателя.
 Вы также можете увидеть реализацию  CategoryColorMapper  в конфигурации глифа  vbar . Свойству  color  передается  dict  с полем в  ColumnDataSource , которое необходимо сопоставить, и именем  CategoryColorMapper , созданного выше.
 Первоначальный вид будет показывать только первые 10 игр сезона 76ers, поэтому должен быть способ панорамирования по горизонтали для навигации по остальным играм в сезоне.Таким образом, настройка панели инструментов на наличие инструмента  xpan  позволяет панорамировать график, не беспокоясь о случайном перекосе вида по вертикальной оси.
 Теперь, когда фигуры созданы, можно настроить сетку  , сославшись на цифры из  dict , созданного выше:
  # Создать макет
grid = gridplot ([[stat_figs ['Points'], stat_figs ['Assists']],
                [stat_figs ['Rebounds'], stat_figs ['Turnovers']]])
  
 Связать оси четырех графиков так же просто, как установить  x_range  каждой фигуры равными друг другу:
  # Соединить вместе оси X
stat_figs ['Очки'].x_range = \
    stat_figs ['Assists']. x_range = \
    stat_figs ['Rebounds']. x_range = \
    stat_figs ['Обороты']. x_range
  
 Чтобы добавить строку заголовка к визуализации, вы могли бы попытаться сделать это на рисунке точек, но это было бы ограничено пространством этого рисунка. Поэтому хороший трюк - использовать способность Bokeh интерпретировать HTML для вставки элемента  Div , который содержит информацию о заголовке. Как только это будет создано, просто объедините это с сеткой  ()  в макете столбца  :
  # Добавить заголовок для всей визуализации с помощью Div
html = "" " 
 Протокол игры" Филадельфия 76ерс "
 
  Регулярный сезон 2017-18 


  Выигрыши - зеленым, проигрыши - красным 
"" "
sup_title = Div (текст = html)

# Визуализировать
показать (столбец (sup_title, grid))
  
 Если сложить все вместе, получим следующее:
 Аналогичным образом вы можете легко реализовать связанные выборки, когда выбор на одном графике будет отражаться на других.
 Чтобы увидеть, как это работает, следующая визуализация будет содержать два графика разброса: один показывает процент попаданий с игры двух и трех очков 76-х, а другой показывает командные очки 76-х по сравнению с очками оппонента в каждой игре. игровая основа.
 Цель состоит в том, чтобы иметь возможность выбирать точки данных на левой диаграмме рассеяния и быстро распознавать, является ли соответствующая точка данных на правой диаграмме рассеяния выигрышем или проигрышем.
 DataFrame для этой визуализации очень похож на кадр из первого примера:
  # Изолировать соответствующие данные
phi_gm_stats_2 = (team_stats [(team_stats ['teamAbbr'] == 'PHI') &
                             (team_stats ['SeasTyp'] == 'Обычный')]
                  .loc [:, ['gmDate',
                           'team2P%',
                           'team3P%',
                           'teamPTS',
                           'opptPTS']]
                  .sort_values ​​('gmDate'))

# Добавить номер игры
phi_gm_stats_2 ['game_num'] = диапазон (1, len (phi_gm_stats_2) + 1)

# Получение столбца win_loss
win_loss = []
для _ строка в phi_gm_stats_2.iterrows ():

    # Если 76-е наберут больше очков, это победа
    если строка ['teamPTS']> строка ['opptPTS']:
        win_loss.append ('W')
    еще:
        win_loss.добавить ('L')

# Добавить данные win_loss в DataFrame
phi_gm_stats_2 ['winLoss'] = win_loss
  
 Вот как выглядят данные:
 >>>
  >>> phi_gm_stats_2.head ()
        gmDate team2P% team3P% teamPTS opptPTS game_num winLoss
10 2017-10-18 0,4746 0,4286 115120 1 л
39 2017-10-20 0,4167 0,3125  2 л
52 2017-10-21 0,4138 0,3333 94128 3 л
80 2017-10-23 0.5098 0,3750 97 86 4 Вт
113 2017-10-25 0,5082 0,3333 104105 5 л
  
 Код для создания визуализации следующий:
  # Библиотеки Bokeh
из боке. построение импортного рисунка, шоу
из bokeh.io импорт output_file
из bokeh.models импортировать ColumnDataSource, CategoryColorMapper, NumeralTickFormatter
from bokeh.layouts импортировать сетку

# Выводить в записную книжку
выходной_файл ('phi-gm-connected-selections.html',
            title = 'Процент 76ers vs.Победа-проигрыш ')

# Хранить данные в ColumnDataSource
gm_stats_cds = ColumnDataSource (phi_gm_stats_2)

# Создайте объект CategoryColorMapper, который назначает определенные цвета победам и поражениям
win_loss_mapper = CategoryColorMapper (факторы = ['W', 'L'], палитра = ['Зеленый', 'Красный'])

# Укажите инструменты
toolList = ['lasso_select', 'tap', 'reset', 'save']

# Создайте цифру, относящуюся к процентам
pctFig = цифра (title = '2PT FG% vs 3PT FG%, регулярный сезон 2017-18',
                plot_height = 400, plot_width = 400, tools = toolList,
                x_axis_label = '2PT FG%', y_axis_label = '3PT FG%')

# Рисуем круговыми маркерами
pct Рис.круг (x = 'team2P%', y = 'team3P%', source = gm_stats_cds,
              размер = 12, цвет = 'черный')

# Отформатируйте метки деления оси Y как проценты
pctFig.xaxis [0] .formatter = NumeralTickFormatter (формат = '00 .0% ')
pctFig.yaxis [0] .formatter = NumeralTickFormatter (формат = '00 .0% ')

# Создайте цифру, относящуюся к итогу
totFig = цифра (title = 'Командные очки против очков соперников, регулярный сезон 2017-18',
                plot_height = 400, plot_width = 400, tools = toolList,
                x_axis_label = 'Очки команды', y_axis_label = 'Очки противника')

# Рисуем квадратными маркерами
tot Рис.квадрат (x = 'teamPTS', y = 'opptPTS', source = gm_stats_cds, size = 10,
              color = dict (field = 'winLoss', transform = win_loss_mapper))

# Создать макет
grid = gridplot ([[pctFig, totFig]])

# Визуализировать
показать (сетка)
  
 Это прекрасная иллюстрация возможностей использования  ColumnDataSource . Пока средства визуализации глифов (в данном случае глифы круга ,  для процентов и глифы квадрата   для побед и поражений) используют один и тот же  ColumnDataSource , тогда выборки будут связаны по умолчанию.
 Вот как это выглядит в действии, где вы можете видеть, что выбор, сделанный на одном рисунке, будет отражен на другом:
 Путем выбора случайной выборки точек данных в верхнем правом квадранте левого графика разброса, соответствующих как высокому проценту двухочковых, так и трехочковых бросков с игры, точки данных на правом графике разброса выделяются.
 Аналогично, выбор точек данных на правом графике разброса, которые соответствуют потерям, как правило, располагаются дальше к нижнему левому углу, к более низким процентам выстрелов на левом графике разброса.
 Все подробности о связывании графиков можно найти в разделе "Связывание графиков" в Руководстве пользователя Bokeh.
 Выделение данных с помощью легенды 
 Это подводит нас к последнему примеру интерактивности в этом уроке: интерактивным легендам.
 В разделе «Данные чертежа с символами» вы увидели, насколько легко реализовать легенду при создании графика. При наличии легенды для добавления интерактивности достаточно присвоить  click_policy . Используя одну строку кода, вы можете быстро добавить возможность  скрыть  или  отключить данные  с помощью легенды.
 В этом примере вы увидите две идентичные диаграммы разброса, сравнивающие очки за игру и подборы Леброна Джеймса и Кевина Дюранта. Единственное отличие состоит в том, что один будет использовать  hide  как  click_policy , а другой -  mute .
 Первым шагом является настройка вывода и настройка данных, создание представления для каждого игрока из  player_stats  DataFrame:
  # Библиотеки Bokeh
из боке.построение рисунка импорта, показать
из bokeh.io импорт output_file
из bokeh.models импортировать ColumnDataSource, CDSView, GroupFilter
из строки импорта bokeh.layouts

# Выводить в записную книжку
выходной_файл ('lebron-vs-durant.html',
            title = 'Леброн Джеймс против Кевина Дюранта')

# Хранить данные в ColumnDataSource
player_gm_stats = ColumnDataSource (player_stats)

# Создайте представление для каждого игрока
lebron_filters = [GroupFilter (column_name = 'playFNm', group = 'LeBron'),
                  GroupFilter (column_name = 'playLNm', group = 'James')]
lebron_view = CDSView (источник = player_gm_stats,
                      Filters = lebron_filters)

durant_filters = [GroupFilter (column_name = 'playFNm', group = 'Kevin'),
                  GroupFilter (column_name = 'playLNm', group = 'Durant')]
durant_view = CDSView (источник = player_gm_stats,
                      фильтры = durant_filters)
  
 Перед созданием рисунков общие параметры рисунка, маркеров и данных можно объединить в словари и использовать повторно.Это не только сохраняет избыточность на следующем этапе, но и предоставляет простой способ настроить эти параметры позже, если потребуется:
  # Объединить общие аргументы ключевых слов в dicts
common_figure_kwargs = {
    'plot_width': 400,
    'x_axis_label': 'Очки',
    'toolbar_location': нет,
}
common_circle_kwargs = {
    'x': 'playPTS',
    'y': 'playTRB',
    'источник': player_gm_stats,
    'размер': 12,
    'альфа': 0,7,
}
common_lebron_kwargs = {
    'вид': lebron_view,
    'цвет': '# 002859',
    'легенда': 'Леброн Джеймс'
}
common_durant_kwargs = {
    'вид': durant_view,
    'цвет': '# FFC324',
    'легенда': 'Кевин Дюрант'
}
  
 Теперь, когда различные свойства установлены, два графика разброса можно построить гораздо более кратко:
  # Создайте две фигуры и нарисуйте данные
hide_fig = рисунок (** common_figure_kwargs,
                  title = 'Щелкните легенду, чтобы СКРЫТЬ данные',
                  y_axis_label = 'Rebounds')
hide_fig.круг (** common_circle_kwargs, ** common_lebron_kwargs)
hide_fig.circle (** common_circle_kwargs, ** common_durant_kwargs)

mute_fig = figure (** common_figure_kwargs, title = 'Щелкните легенду, чтобы ОТКЛЮЧИТЬ данные')
mute_fig.circle (** common_circle_kwargs, ** common_lebron_kwargs,
                muted_alpha = 0,1)
mute_fig.circle (** common_circle_kwargs, ** common_durant_kwargs,
                muted_alpha = 0,1)
  
 Обратите внимание, что  mute_fig  имеет дополнительный параметр, называемый  muted_alpha .Этот параметр управляет непрозрачностью маркеров, когда  mute  используется как  click_policy .
 Наконец, устанавливается  click_policy  для каждого рисунка, и они отображаются в горизонтальной конфигурации:
  # Добавить интерактивности в легенду
hide_fig.legend.click_policy = 'скрыть'
mute_fig.legend.click_policy = 'без звука'

# Визуализировать
показать (строка (hide_fig, mute_fig))
  
 Когда легенда размещена, все, что вам нужно сделать, это назначить  скрыть  или  отключить  свойству  click_policy  фигуры.Это автоматически превратит вашу основную легенду в интерактивную легенду.
 Также обратите внимание, что специально для  mute  дополнительное свойство  muted_alpha  было установлено в соответствующих глифах  круга  для Леброна Джеймса и Кевина Дюранта. Это определяет визуальный эффект, обусловленный взаимодействием легенды.
 Чтобы узнать больше о взаимодействии с эффектом боке, обратитесь к разделу «Добавление взаимодействий в руководстве пользователя по боке».
 Сводка и следующие шаги 
 Поздравляем! Вы дошли до конца этого урока.
 Теперь у вас должен быть отличный набор инструментов, чтобы начать превращать ваши данные в красивую интерактивную визуализацию с помощью боке. Вы можете скачать примеры и фрагменты кода из репозитория Real Python на GitHub.
 Вы научились:
 Настройте сценарий для рендеринга в статический файл HTML или Jupyter Notebook
 Создание и настройка объекта  figure () 
 Создайте визуализацию с помощью глифов
 Доступ и фильтрация данных с помощью  ColumnDataSource 
 Организация нескольких графиков в виде сетки и макетов с вкладками
 Добавление различных форм взаимодействия, включая выделение, действия при наведении курсора, ссылки и интерактивные легенды
 Чтобы еще больше узнать о возможностях боке, официальное руководство пользователя по боке - отличное место для более сложных тем.Я также рекомендую заглянуть в галерею Боке, где можно найти массу примеров и вдохновения.
 5 линз с великолепным боке 
 может жаждать каждый фотограф
 Вы, наверное, только что преодолели синдром приобретения снаряжения. Но по правде говоря, это никогда не уходит. Мы бы знали; мы проверяем тонны товаров, а затем отправляем их обратно. И есть объективы с красивым боке, которые мы всегда обожали. Боке - это еще не все, но иногда вы не можете не смотреть с трепетом на сделанное фото.И в большинстве случаев это может улучшить ваш объект. Поэтому мы углубились в наш индекс обзоров, чтобы найти некоторые из наших любимых объективов с великолепным боке.
  Это изделие представлено в сотрудничестве с Leica. Мы уже провели независимую и этическую проверку всех продуктов в этом обзоре без спонсорской поддержки. И мы работали с ними, чтобы порекомендовать вам несколько ключевых драгоценных камней. 
 Pro Советы по использованию объективов с великолепным боке 
 Если вы хотите использовать объективы Leica с великолепным боке, вот несколько профессиональных советов для вас:
 Хотите максимально точную и критически резкую фокусировку? Используйте ЖК-экран или Leica Visiolfex.Для получения лучших результатов увеличьте сцену. Это поможет сделать объект резким, а боке будет выглядеть красиво.
 Конечно, добиться наилучшего боке можно, когда вы снимаете на широко открытой диафрагме и фокусируетесь как можно ближе. Хотя это не всегда имеет практический смысл в зависимости от вашего творческого видения, следует придерживаться этого правила.
 Чтобы получить сверхчеткие, четкие фотографии, всегда соблюдайте взаимное правило выдержки. Для всех этих объективов мы рекомендуем использовать выдержку не менее 1/125, если вы новее.Некоторые из нас могут удерживать до 1/15 и получить уверенный выстрел!
 Не используйте эти объективы только с камерами с байонетом M. Объективы с байонетом Leica M с великолепным боке - абсолютная мечта для использования на Leica SL2 и Leica SL2-S. Они подарят вашим линзам новую жизнь!
 В дальномерах Leica механизм фокусировки настроен на фокусировку по центру. Если вы собираетесь сфокусироваться и изменить композицию, используя объективы с великолепным боке, не поворачивайте камеру. Сдвиньте его как можно дальше по одной плоскости фокусировки.
 Leica 35 мм f2 Summicron-M ASPH APO 
 Что нужно знать 
 Непревзойденное качество изображения
 Современный дизайн
 Простота фокусировки
 Самый компактный полнокадровый объектив 35 мм с исключительными оптическими характеристиками
 Минимальное фокусное расстояние в линейке объективов M - до 0,3 м
 В нашем обзоре мы отмечаем :
  «Для 35-мм объектива боке зашкаливает. Он мягкий, кремовый и мечтательный.Шарики с эффектом боке красивые и круглые, а в углах практически не видно боке «кошачий глаз». Некоторые из вас скажут: «Ну, сейчас идет луковое боке». Преодолейте это. Это добавляет очарования и характера этому прекрасному объективу. Меня тошнит от технически совершенных, безжизненных, клинических изображений. К счастью, Leica APO Summicron 35mm f2 ASPH знает, как это сделать. Включите фокусировку и смотрите на великолепные изображения ». 
   Купить сейчас  
 Leica 50 мм f1.2 Ноктилюкс 
 Что нужно знать 
 Современная интерпретация одной из самых мифических линз для M-System
 Оптический дизайн аналогичен оригинальной линзе Noctilux. Уникальное качество изображения с винтажным ощущением от оригинального объектива.
 Несмотря на то, что объектив имеет уникальный внешний вид с широко открытой диафрагмой, его очень удобно использовать для повседневной съемки.
 Объектив будет поставляться в классическом прозрачном контейнере для линз, как и в оригинальной версии.
 Эта специальная модель оснащена латунной оправой объектива и гравировкой на переднем кольце, на которой, как и на оригинале, виден классический логотип LEITZ WETZLAR.
 В нашем обзоре мы указываем:
  «Боке от Leica Noctilux 50mm f1.2 просто восхитительно. Фон имеет приятное мягкое размытие. Иногда кажется, что боке слегка закручено. Падение от резкого к размытому происходит быстро, что делает объект действительно ярким. Этот эффект хорошо работает как на переднем, так и на заднем плане.”
   Купить сейчас  
 Leica 50 мм f2 Summicron-M ASPH 
 Что нужно знать 
 Угол изображения по диагонали: 47 °
 Рабочий диапазон: от 0,7 м до бесконечности
 Максимальный масштаб: 1: 11,5
 Количество линз / групп: 6/4
 Длина * 1: 43,5 мм
 Вес * 1: 240 г
 Бленда объектива: выдвижная
 Фильтр / резьба фильтра: E39
 Сделано в Германии
 В нашем обзоре мы указываем:
  «Объектив Leica 50mm f2 Summicron M не такой эффектный, как его f1.4 брат. Но в целом все равно довольно красиво. Вы можете получить боке в форме кошачьего глаза. Однако я не возражаю против всего этого в ситуациях, подобных описанной выше. Я думаю, это может быть довольно круто. И не все боке должны быть идеально круглыми. Я тоже из лагеря, который никогда не заботился о луковом боке. На самом деле это не проблема ». 
   Купить сейчас  
 Leica 75 мм f2 Summicron-M ASPH 
 Что нужно знать 
 Угол обзора по диагонали: 32 °
 Рабочий диапазон: 0.От 7 м до бесконечности
 Максимальный масштаб: 1: 7
 Количество линз / групп: 7/5
 Длина * 1: 66,8 мм
 Вес * 1: 430 г
 Бленда объектива: выдвижная и запираемая
 Фильтр / резьба фильтра: E49
 В нашем обзоре мы указываем:
  «При f2 объектив Leica 75mm f2 APO Summicron-M ASPH не самый широкий при таком фокусном расстоянии в линейке Leica. Однако мы обнаружили, что он дает такое же качество боке, что и у объективов с байонетом Leica M.При съемке портретов на открытой диафрагме фон становится гладким, как акварель. Мы достигли желаемых результатов с достаточным отделением объекта от фона даже при остановке ». 
   Купить сейчас  
 Leica 90 мм f1.5 
 Что нужно знать 
 8 линз, две из которых имеют асферическую форму и изготовлены из специального стекла
 Новейший в длинной линейке знаменитых объективов Summilux, впервые с фокусным расстоянием 90 мм
 Идеально подходит для портретов с невероятно мелким глубина резкости
 Оживляет портреты с новым уровнем резкости
 Первый объектив Summilux с диафрагмой 90 мм
 В нашем обзоре мы указываем:
  «Leica 90mm Summilux обеспечивает отличное боке на f1.5. Фон просто тает. Трава становится такой гладкой, как фоновая бумага. Более длинное фокусное расстояние и полнокадровая матрица означают, что при опускании объектива все еще остается немного боке. Световые точки бывают мягкими и круглыми. Я не заметил лукового звона или боке из мыльных пузырей ». 
   Купить сейчас  
 Что такое боке? | Artfinder 
 Взгляните на следующую фотографию:
 Обратите внимание, как голова лебедя полностью сфокусирована, а фон ярко-желтый и размытый? Это эффект боке, основная цель которого - выделить объект вместе с определенными точками света.
 Термин «боке» происходит от японского слова «бокэ», что означает «дымка» или «размытость». Это слово стало широко ассоциироваться с эстетическим качеством размытия вне фокуса в произведении искусства. И если вам интересно, как произносится «боке», это барабанная дробь, пожалуйста… ‘boh-keh’. Не верите нам?
 Как сделать снимок с эффектом боке? 
 Чтобы создать эффект боке на фотографии, художники сначала должны найти объект, который будет легко сниматься с короткого фокусного расстояния или крупным планом.Скажем, например, божья коровка на листе. Чтобы добиться идеального боке, солнце также должно быть видно на заднем плане за листвой. Это необходимо для того, чтобы световые точки за листом оказались не в фокусе.
 Затем фотограф помещает камеру на штатив и использует ее ручные настройки, чтобы получить резкий фокус для божьей коровки. На этом этапе фон должен быть полностью размытым. Чтобы фон был почти полностью не в фокусе, фотограф должен быть ближе к объекту, совсем рядом с точкой минимальной фокусировки.
 Художественные эффекты боке 
 Захват размытого света в художественной фотографии - один из наиболее распространенных способов использования боке. Размытые огни - от рождественских огней до ночного городского пейзажа - придают фотографии мягкость и глубину. Идея состоит в том, чтобы создать потрясающий фон, не отвлекая слишком много внимания от объекта, который по-прежнему должен быть в центре фотографии.
 Боке - это просто техника? 
 Несмотря на то, что боке действительно является фотографической техникой, его использование очень субъективно.У каждого фотографа свое представление о том, как должно выглядеть хорошее боке. Тип используемого объектива влияет на боке, и основная вещь, которую нужно понимать при съемке боке, - это то, как линзы передают размытие. С этого момента все зависит от видения фотографа.
 Глубина резкости - это то, с чем фотографам также следует поэкспериментировать при съемке боке, поскольку конечный результат заключается не только в получении размытого фона, но и в достижении правильной глубины резкости.
 Хотя эффект боке традиционно является фотографической техникой, мы видели, как художники в Artfinder тоже баловались с боке.В конце концов, все дело в экспериментах с фокусировкой и светом.
 Почему так популярно искусство боке? 
 Размытый фон с несколькими круговыми шарами сияющего света может вызвать ощущение тепла и романтики. Представьте, что вам тепло и уютно, и вы наблюдаете, как мир проходит через мокрое от дождя окно. Или сидя в машине, проезжая ночью по новому и захватывающему городу. Хорошо, поместите это на холст и назовите это боке, ребята.
 Больше боке для удовольствия от просмотра:
  Изображение на обложке Journey Gong 
 Как проявить творческий подход с фотографией с эффектом боке 
 Сказать, что фотография с эффектом боке очень интересна, - значит ничего не сказать.Само слово « боке, » имеет японское происхождение и относится к эстетическому качеству размытия изображения, которое обнаруживается в нефокусной области изображения. По сути, это способ, которым ваш объектив отображает точки света, которые не в фокусе.
 Важно отметить, что боке может быть как хорошим, так и плохим, что определяется исключительно тем, насколько приятным для глаз является размытие изображения. Поэтому, когда дело доходит до этого жанра фотографии, ваш успех в значительной степени зависит от формы диафрагмы и любых оптических аберраций в вашем объективе.
 
 изображение Пранава Ядданапуди
 Боке имеет место в тех частях сцены, которые находятся за пределами глубины резкости. В результате некоторые фотографы иногда используют метод преднамеренного неглубокого фокуса для создания фотографий, на которых присутствуют расфокусированные области, очень заметные для глаза. Если все сделано правильно, фотография с эффектом боке станет визуальным наслаждением для ваших глаз.
 Если проявить творческий подход, ваши фотографии с эффектом боке останутся незабываемыми.
 Рождественские огни для боке: это волшебство 
 У вас есть возможность создавать свои собственные изображения с эффектом боке, от которых все ваши друзья будут делать двойные дубли.Лучшая новость заключается в том, что вам даже не нужно выходить из дома, чтобы создавать исключительные изображения с эффектом боке. Все, что вам нужно, - это рождественские огни и обстановка в помещении, в которой нет источников света, которые лучше всего подходят для боке.
 Не ждите Рождества, чтобы попробовать свои силы в этой технике боке! Просто сотрите старую рождественскую гирлянду из туалета и приступайте.
 Требования 
 
 изображение Мусуме Миюки
  Идеальный объектив  - Идеальным объективом для этой ситуации является любой объектив с действительно широкой диафрагмой, например f / 1.8 или даже f / 1,4.
 Примеры объективов, которые хорошо подходят для этого упражнения в творческой фотографии с боке, включают Canon 50mm f / 1.8, Nikkor 50mm f / 1.8 и Nikkor 50mm f / 1.4.
 Технически вполне возможно получать изображения с эффектом боке с объективом f / 2 или меньше. Просто знайте, что качество и размер вашего эффекта боке будут снижены.
  Рождественские огни  - Вам не нужно выбирать количество огней на нити, цветные или прозрачные.Подойдут рабочие фары любого цвета.
  Штатив  - Этот аксессуар не является обязательным. Конечно, наличие штатива обеспечивает стабильность, что вам следует серьезно подумать, если вы знаете, что ваши руки дрожат.
  Вспышка  - Опять же, вспышка здесь не является обязательной, но она действительно помогает осветить ваши изображения и любое боке на них.
 Установка 
 Это самая простая часть процесса: просто настройте камеру, как вы обычно делаете при съемке в помещении, но с одним важным отличием.
 Убедитесь, что вы отрегулировали диафрагму камеры на максимально возможное значение. В идеале вам нужна диафрагма f / 1.8 или f / 1.4 (или даже шире, например, f / 1.2), все, конечно, в зависимости от точного типа объектива.
 Флэш 
 Если вы решили использовать вспышку, установите ее так, чтобы она находилась вне камеры и была направлена ​​на объект. Если место, где будет находиться ваш объект, имеет отражающее освещение, вы также можете направить вспышку на задний план, чтобы создать боке из отражения света, исходящего от этих поверхностей.
 Рождественские огни 
 Пришло время для звезд всего вашего творческого упражнения по фотографии с эффектом боке: рождественских огней! Установите их, равномерно распределив их по заданному фону; альтернативой было бы просто пойти со своей интуицией и настроить их в соответствии с вашей прихотью.
 Если вы не придумаете способ успешно закрепить свет, вы всегда можете использовать обычную старую книжную полку и положиться на зажимы для папок, чтобы закрепить свет на полках.
 Субъект 
 Как и в любом фотопроекте, ваш объект жизненно важен для успеха ваших изображений, поэтому потратьте некоторое время на настройку объекта для вашего эффекта боке, каким бы он ни был.
 При съемке в помещении ваш объект, скорее всего, будет небольшим, и его можно будет аккуратно разместить на столе или другой поверхности. Примеры включают скрепку, раскрытую книгу, кружку и даже кусочек пазла.
 Некоторые фотографы предпочитают размещать объект на расстоянии от 4 до 5 футов перед рождественскими огнями.Чем дальше вы расположите источники света от объекта, тем меньше будет эффект боке на изображениях. Чем ближе объект съемки к источникам света, тем сильнее эффект боке на снимках. В конце концов, все сводится к личным предпочтениям: вы хотите больше или меньше боке на своих фотографиях?
 Объектив 
 Если вы не используете фиксированный объектив, не забудьте полностью увеличить его. Фотографы, имеющие опыт работы с боке, обнаруживают, что таким способом они могут добиться превосходного эффекта боке, чем если бы они не увеличивали масштаб.Следует также отметить, что, если вы увеличиваете масштаб с помощью объектива, вы обычно можете обойтись установкой диафрагмы на f / 4.5 вместо f / 1.8 или f / 1.4.
 Утонченность фокусировки 
 Вы почти подошли к тому моменту, когда можете проверить результаты своего эксперимента с боке! Теперь все, что вам нужно сделать, это овладеть тонкостью фокусировки на объекте.
 Рекомендуется держаться как можно ближе к объекту съемки. Если вы этого не сделаете, ваше боке станет заметно меньше, что несколько снизит его драматический и интересный эффект.Однако это вопрос предпочтений: если вам нравится более мелкое и мелкое боке, не стесняйтесь снимать издалека.
 Удовольствие от съемки изображения 
 На этом этапе вы перечеркнули все свои пресловутые «t» и расставили все свои пресловутые «i» точками. Единственное, что осталось сделать, чтобы осуществить вашу кропотливую настройку и подготовку, - это наконец щелкнуть затвором - так что продолжайте! Когда вы смотрите на свои изображения, вы можете оценить творческий потенциал этой техники.
 В конце концов, вы только что сделали один из самых художественных и новаторских снимков во всей фотографии.Вы только что создали боке в помещении с помощью обычных рождественских гирлянд!
 Фотография с эффектом боке: творчество в силах десяти 
 Боке олицетворяет то, как фотографию можно использовать для достижения более сложных форм искусства. Вы не просто фотографируете предметы, а потом смотрите, как они получатся!
 Вы активно добавляете в свои снимки уникальные эффекты, а также разумно используете размытие, которое является естественной частью фотосъемки.Поэкспериментируйте с этим эффектом боке, пока не получите действительно завораживающие снимки.
 Твоя очередь говорить 
 Вы когда-нибудь пробовали фотографировать с эффектом боке? У вас есть свои особые советы о том, как добиться самых потрясающих эффектов боке на ваших изображениях? Не стесняйтесь делиться своими знаниями через Twitter или Facebook! Ах да, и обязательно сделайте Contrastly вашим универсальным магазином для всех ваших потребностей в фотографии.
Боке это: Использование фона боке на фотографии