Highcharts入門之基本屬性

更新時(shí)間：2016年08月02日 17:12:54 投稿：daisy

Highcharts是一個(gè)用純JavaScript編寫的一個(gè)圖表庫(kù)，之前小編發(fā)了一篇介紹Highcharts的文章，那么本文將進(jìn)一步的介紹Highcharts的基本屬性，有需要的可以參考學(xué)習(xí)。

一.基本組成：

1.Highcharts包含標(biāo)題（Title）：主標(biāo)題是必須的但是subTTitle不是必須

2.坐標(biāo)軸（Axis）：有x坐標(biāo)（xAxis）和y坐標(biāo)（yAxis）

3.數(shù)據(jù)列（Series）：每個(gè)曲線，每個(gè)柱形條組，每個(gè)餅圖的部分

4.數(shù)據(jù)提示框（Tooltip）：鼠標(biāo)放上去的提示框

5.圖例（Legend）：通過(guò)點(diǎn)擊標(biāo)示可以顯示或隱藏該數(shù)據(jù)列

6.

7.版權(quán)信息（Credits）：一般是highcharts的官網(wǎng)，指定credits.enabled=false不讓顯示

8.導(dǎo)出功能按鈕（Exporting）：需要包含exporting.js

9.標(biāo)示線（PlotLines）：主動(dòng)添加如平均線等

二.參數(shù)屬性：

1、調(diào)用highcharts：

方法一：

$(function () {
    $(".chart").highcharts({});
});

方法二：

var charts = new Highcharts.Chart({
  // Highcharts 配置
  chart : {
    renderTo : "container" // 注意這里一定是 ID 選擇器
  }
});

2、設(shè)置表格寬高：

等同于設(shè)置div的寬高：

style="width: 800px ;height: 400px"

3、圖表樣式：

常見的有：border、backgroundColor、margin、spacing、style

總結(jié)

以上就是Highcharts入門之基本屬性的全部?jī)?nèi)容，希望對(duì)大家學(xué)習(xí)Highcharts有所幫助，小編還會(huì)陸續(xù)更新Highcharts的相關(guān)文章，請(qǐng)繼續(xù)關(guān)注腳本之家。

您可能感興趣的文章:

相關(guān)文章

fullCalendar中文API官方文檔
FullCalendar是一款基于jQuery的日歷插件，適用于各種日程安排、工作計(jì)劃等場(chǎng)景，本文是fullCalendar官方文檔的中文版，主要介紹了fullCalendar的具體屬性與方法，大家可以參考一下
2017-02-02
ThinkJS中如何使用MongoDB的CURD操作
最近因?yàn)樾难獊?lái)潮想要試試thinkJS操作mongoDB，去官方文檔看了看，默認(rèn)是只給了mysql的配置，源代碼也是沒(méi)有配置mongo的，只有一個(gè)官方案例，無(wú)奈只能自己學(xué)習(xí)了，下面是自己的一些學(xué)習(xí)總結(jié)，有需要的朋友們可以參考借鑒，下面來(lái)一起看看吧。
2016-12-12
js類庫(kù)styled-components快速入門教程
這篇文章主要為大家介紹了js類庫(kù)styled-components快速入門的教程示例，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪
2022-06-06
Three.js學(xué)習(xí)之文字形狀及自定義形狀
今天小編帶大家學(xué)習(xí)的是Three.js的文字形狀與自定義形狀，文章內(nèi)容很詳細(xì)，對(duì)大家學(xué)習(xí)Three.js或許有幫助，下面一起來(lái)看看吧。
2016-08-08
基于d3.js實(shí)現(xiàn)實(shí)時(shí)刷新的折線圖
本文用實(shí)例演示如何用d3.js實(shí)現(xiàn)實(shí)時(shí)刷新的折線圖,非常具有實(shí)用價(jià)值,需要的朋友可以參考下。
2016-08-08
JS日程管理插件FullCalendar簡(jiǎn)單實(shí)例
JS日程管理插件FullCalendar是一款基于jQuery的日歷日程插件，適用于各種日程安排、工作計(jì)劃等場(chǎng)景，您可以很方便的查看查看待辦事項(xiàng)，標(biāo)記重要事項(xiàng)以及綁定點(diǎn)擊和拖動(dòng)事件，能快速的整合到您的項(xiàng)目中，本文將簡(jiǎn)單介紹FullCalendar的使用
2017-02-02
Highcharts學(xué)習(xí)之?dāng)?shù)據(jù)列
數(shù)據(jù)列配置是 Highcharts 最復(fù)雜也是最靈活的配置，如果說(shuō) Highcharts 是靈活多變，細(xì)節(jié)可定制的話，那么數(shù)據(jù)列配置就是這個(gè)重要特性的核心。
2016-08-08
精通JavaScript 糾正 cleanWhitespace函數(shù)
這個(gè)函數(shù)用在火狐(firefox)上面老是出錯(cuò)，今天仔細(xì)研究了下，改正了，希望別人不要遇到我這樣的問(wèn)題
2010-03-03
Highcharts入門之簡(jiǎn)介
Highcharts 是一個(gè)用純JavaScript編寫的一個(gè)圖表庫(kù), 能夠很簡(jiǎn)單便捷的在web網(wǎng)站或是web應(yīng)用程序添加有交互性的圖表，并且免費(fèi)提供給個(gè)人學(xué)習(xí)、個(gè)人網(wǎng)站和非商業(yè)用途使用。下面通過(guò)本文的介紹及實(shí)例一起來(lái)學(xué)習(xí)學(xué)習(xí)吧。
2016-08-08
淺談JavaScript前端開發(fā)的MVC結(jié)構(gòu)與MVVM結(jié)構(gòu)
以AngularJS為代表的MVVM結(jié)構(gòu)框架或庫(kù)這兩年來(lái)在前端界真是火到不行,大有對(duì)抗傳統(tǒng)jQuery綁定思想的趨勢(shì),這里我們結(jié)合傳統(tǒng)的MVC結(jié)構(gòu),來(lái)淺談JavaScript前端開發(fā)的MVC結(jié)構(gòu)與MVVM結(jié)構(gòu)
2016-06-06