Highcharts кратко ръководство

Удобства

По-долу са характеристиките Highcharts библиотека.

Съвместимост - Работи незабелязано във всички основни браузъри и мобилни платформи. като Android и IOS.

Безплатно ползване - с отворен код и свободен да се използва за нетърговски цели.

Лек - highcharts.js ядро ​​библиотека с площ от около 35KB, много лек библиотека.

Лесна конфигурация - Използва JSON. за дефиниране на различни конфигурационни диаграми и много лесно да се научат и да използват.

Dynamic - Позволява се промени, дори и след поколение графика диаграма.

Няколко оси - не се ограничават до X, Y ос. Подкрепа многоосните диаграми.

Конфигуриращи пояснения - подсказка идва. когато потребителят витае курсора до всяка точка на графиката. Highcharts съдържа вградена подсказка за форматиране или форматиране обаждане управление подсказка софтуер.

Експорт - износ диаграми на PDF / PNG / JPG / SVG формат чрез прилагане функция износ.

Печат - Печат на диаграмата с помощта на уеб - страница.

Външни данни - Поддържа динамично зареждане на данни от сървъра. Тя осигурява контрол над данните при използване на функцията за обратно повикване.

Текст Rotation - Поддържа ротация на етикетите в произволна посока.

Поддържани типове диаграми

Highcharts библиотека предоставя следните типове диаграми:

В следващите глави ще обсъдят всеки вид горните класациите в детайли с примери.

Highcharts е с отворен код и е свободен да използва за нетърговски цели. Поръчка. Highcharts за използване в търговски обекти, отидете на: Лиценз и ценообразуване

В тази глава ще говорим за това как да конфигурирате Highcharts библиотека за използване при разработването на уеб приложения.

Highcharts изискват Jquery като зависимост. Така че, от една страна ние си поставихме за Jquery библиотеката и след това HighChart библиотека.

Задайте JQuery

Има два начина за използване на JQuery.

Изтегляне: Изтеглете го от jQuery.COM на местно ниво и да я използват.

CDN достъп: Можете също така да има достъп до CDN. CDN ще ви даде по света достъп до регионалните центрове за данни, с оглед на обстоятелствата, Google ще бъде домакин. Това означава, че с помощта на CDN движи отговорността на хостинг на файлове на вашите собствени сървъри за серия от външната. Той също така има предимството, че ако посетител на уеб страница вече е изтеглен копие от същото JQuery CDN, тя не трябва да се изтегля отново.

Използването на JQuery Downloads

С помощта на CDN

Ние използваме версията на библиотеката CDN на JQuery в този урок.

Задайте Highcharts

Има два начина за използване на Highcharts.

Изтегляне: Изтеглете го от Highcharts.COM на местно ниво и да я използват.

CDN достъп: Можете също така да има достъп до CDN. CDN ще ви даде по целия свят, за достъп на регионалните центрове за данни, че в този случай собственикът Highcharts Code.Highcharts.Com.

Използването на изтеглените Highcharts

С помощта на CDN

Ние използваме версия CDN Highcharts библиотека в този урок.

В тази глава ще демонстрираме comfiguration необходимо да се направи схема, използвайки Highcharts API.

Стъпка 1: Създаване на HTML-страници

DIV съставен Zdeskonteyner използва за съхраняване на диаграма, използваща Highcharts библиотека.

Стъпка 2: Създаване на Configuration

Highcharts библиотека използва една много проста конфигурация посредством JSON синтаксис.

Има данни формат JSON JSON и конфигурации, че библиотеката използва, за да се направи диаграма HighChart DIV контейнер пакети, като се използва метода (Highcharts). Сега ние ще се създаде разнообразие от възможности за създаване на желаната JSON низ.

Регулиране на заглавието на диаграма.

подзаглавие

Създаване диаграма на субтитрите.

Регулиране на джаджа за показване на оста X.

Настройка на заглавката, сюжетната линия, която ще се появи на Y. на оста

Задаването на подсказка. Поставете наставката да се добави след стойността (у-ос).

Създаване легенда, която се показва в дясната страна на графиката, заедно с други свойства.

Персонализиране на данните, които ще бъдат показани на графиката. Серия е масив, където всеки елемент на масива е единична линия на графиката.

Стъпка 3: Изграждане на данни JSON

Комбинирайте всички конфигурации.

Етап 4: направи диаграма

По-долу е пълен пример:

Графиките използвани, за да се направи въз основа диаграми линия / сплайн. В този раздел ние ще обсъдим следните видове линии и шлици въз основа на диаграми.

Тип диаграма / Описание