vis.js и fontawesome значки глифов

Question

При создании графиков с использованием vis.js мы можем указать, как узлы могут отображаться с использованием опций.

var options = { 
    width: '400px', 
    height: '400px', 
    edges:{ 
    style:'arrow' 
    }, 
    nodes:{ 
    shape:'icon' 
    } 
}; 

с помощью «значка» для стиля мы используем либо бутстрап, либо значки шрифтовых значков. В документации говорится об использовании юникодов.

Создано Plunker, и значки не отображаются.

http://plnkr.co/edit/DFYz26SOxGY9IvMqSuKm?p=preview 

Не уверен, что я делаю неправильно.

Благодаря

Answer 1

Я посмотрел на свой plunker и я установил его здесь:

http://plnkr.co/edit/NQarGkQSYeg3Cl0SdBGy?p=preview

Я один из разработчиков из vis.js, и я хотел бы объяснить, что пошло не так Вот. Во-первых, вам нужно будет включить css fontawesome, поэтому vis знает, где найти глифы. Таким образом, мы добавляем: < link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css">

Во-вторых, переходя к вашему плункеру, вы устанавливаете форму узлов на «круг». Это означает, что узлам не понадобятся параметры значков. В вашем вопросе вы установили форму узла на «значок». Это означает, что узел будет использовать дополнительные параметры значка для настройки значков.

Таким образом, мы добавили (в опции глобальные узлы):
iconFontFace: 'FontAwesome',
iconSize: 50

Теперь для Юникода. Вам нужно будет указать, какой значок должен показывать вам. Это делается с помощью значка. Итак, где мы находим Юникод? Давайте посмотрим на этом примере: http://fortawesome.github.io/Font-Awesome/icon/coffee/ и мы находим:

fa-coffee · Unicode: f0f4 · Created: v3.0 · Categories: Web Application Icons

Так Юникод f0f4 и в JavaScript мы пишем это как

\uf0f4

С вашей проблемой я заметил, нет никаких настроек по умолчанию для значков, которые будут фиксироваться с релиз 4.0.

Для дальнейшей ссылки вы можете посмотреть на документы:

http://visjs.org/docs/network.html#Nodes_configuration

рабочий пример с несколькими иконами fontawesome и Ionicons:

http://visjs.org/examples/network/38_node_as_icon.html

Чтобы обернуть, в следующий раз у вас есть проблема, пожалуйста, опубликуйте его на нашей странице Github, мы постараемся собрать все вопросы там :)

https://github.com/almende/vis/issues

Удачи вам!