Дайте совет, как построить самый простой график?

Question

[Тимофей Михайлов]

Здравствуйте.
Подскажите пожалуйста, как можно на сайте построить график?
Самый простой ... С двумя осями Х и У. Ну и линией соединяющие указанные координаты ...
Я использую:
- JQuery
- Bootstrap
Спасибо!

Answer 1

[Sergey]

Здравствуйте,
попробуйте библиотеку charts или rgraph

Comments

[Тимофей Михайлов]

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

[Sergey]

Это уже готовый код, которой написан на том же JS. Вы можете написать тоже самое сами или скачать уже готовое и протестированное(надеюсь на это) решение. Использование библиотек - нормальная практика, которая экономит время

[Сергей delphinpro]

Тимофей Михайлов,

но мне кажется немного странным тот факт, что используя (JQuery, Bootstrap)

А что здесь странного? Ни в jquery, ни в bootstrap нет готовых решений для построения графиков.
Отсюда вывод — либо вы сами будете рисовать эти линии в svg/canvas, либо сэкономите время, воспользовавшись специализированной библиотекой.

[Тимофей Михайлов]

Сергей delphinpro,
Да, я это понял. Просто я вот как подумал, люди давно уже используют (JQuery, Bootstrap), и неужели ни у кого не возникло такой идеи: "Хм, а почему у нас нет инструмента для построения графиков?".

[Sergey]

У JQuery и Bootstrap немного другие цели и задачи, если вы об этом. Почему нет инструментов то?) Есть куча библиотек.

[Максим Тимофеев]

Тимофей Михайлов, Не для каждого проекта нужны графики. В bootsrap собраны только часто используемые фичи. Да и зачем? Лучше иметь выбор библиотек и маленький boostrap (относительно), чем отсутствие выбора и огромную зависимость, в которой грузятся скрипты не нужные проекту.
Аналогично этому есть ОС и ПО, Вас не смущает, что в win не включен по умолчанию office, photoshop, ide для разработки, кучка игр и еще 2 сотни программ? Ведь можно было бы, но стоимость была бы огого, диск забивался бы при установке и после установки Вы бы чистили его от того что Вам не нужно.

[Тимофей Михайлов]

Ладно, ладно.
Я понял что был не прав в своём предположении.
Ребят, спасибо что рассказали что да как.

Answer 2

[bini1988]

Использовать svg https://css-tricks.com/how-to-make-charts-with-svg/

Answer 3

[Сергей Соколов]

Без библиотек, как я понял по комментариям ТС, можно просто отрисовать график в SVG и разместить на сайте.
Это можно сделать в Adobe Illustrator или другом векторном редакторе и вывести оттуда готовый SVG.

Из массива координат строить график также можно без библиотек, разобравшись в несложном синтаксе SVG и самостоятельно написав простой код. Вам понадобится добавлять элементы line.

Удобнее, с прицелом на будущее, использовать дополнительную, не-jQuery и не-Bootstrap, библиотеку. В идеале разобраться с D3js. Там и масштабирование осей под данные, и динамическое обновление графика по данным и интерактивность – всё легко кодируется, но придётся инвестировать пару часов в обучение.