1. 程式人生 > >echarts 常用方法 初始化和銷燬

echarts 常用方法 初始化和銷燬

縱觀ECharts圖表例項化的API,主要有一下幾個相關的例項化方法:

1、setOption(Object option,{boolean = true} notMerge)

引數:

1)、Object型別的引數 option,表示圖表資料結構 ,形如:

1.var option  = {2.title: {3.text: "我的第一個ECharts圖表示例"4.},5.tooltip: {6.trigger: 'axis'7.}8.};

2)、boolean notMerge,表示是否合併option。預設為false,可以不設定。

描述:

萬能介面,配置圖表例項任何可配置選項(詳見option),多次呼叫時option選項是預設是合併(merge)的,如果不需求,可以通過notMerger引數為true阻止與上次option的合併。

2、getOption()

描述:

返回內部持有的當前顯示option克隆

3、setSeries(Array series,{boolean=}notMerge)

引數:

1)、Array型別的series序列資料,形如:

01.var Array seriesList = new Array();02.03.var seriesObj = new seriesObj();04.seriesObj.name = "蒸發量";05.seriesObj.type = "line";06.seriesObj.data = [2.0, 4.9, 7.0, 23.2, 25.6, 76.7, 135.6, 162.2, 32.6, 20.0, 6.4, 3.3];
07.08.//設定series09.myChart.setSeries(seriesList,false);

2)、boolean notMerge 表示是否合併series,預設為false,可以不設定。

描述:

資料介面,驅動圖表生成的資料內容,效果等同呼叫setOption({series:{...}})

4、getSeries()

描述:

返回內部持有的當前顯示series克隆,效果同return getOption().series

5、addData(....)

引數:

1)、單組資料引數

11)、{number} seriesIdx :表示給哪一條series新增資料,series腳標從0開始;

12)、{number | Object} data;

13)、{boolean=} isHead ;

14)、{boolean=} dataGrow;

15)、{string=} additionData;

2)、多組資料引數

其實就是多個單組資料的形成的集合或者陣列{Array} params

描述:

動態資料介面

seriesIdx 系列索引 

data 增加資料 

isHead 是否隊頭加入,預設,不指定或false時為隊尾插入 

dataGrow 是否增長資料佇列長度,預設,不指定或false時移出目標陣列對位資料 

additionData 是否增加類目軸(餅圖為圖例)資料,附加操作同isHead和dataGrow 

多組資料新增時引數為: 

params == [[seriesIdx, data, isHead, dataGrow, additionData], [...]]

6、on(string eventName,function eventListner)

描述:

事件繫結,支援事件有:REFRESH,RESTORE,CLICK,HOVER,DATA_CHANGED,MAGIC_TYPE_CHANGED,DATA_VIEW_CHANGED,DATA_ZOOM,DATA_RANGE,LEGEND_SELECTED,MAP_SELECTED

示例程式碼形如:

1.//ECharts圖表的click事件監聽2.myChart.on("click", function () {3.alert("你點選我了!");4.});

7、un(string eventName,function eventListner)

描述:

解除某個事件的繫結,示例程式碼形如:

1.myChart.un("click", function () {2.alert("悲劇,你登出我了!");3.});

8、showLoading(Object loadingOption)

描述:

過渡控制(詳見loadingOption),顯示loading(讀取中)程式碼片段形如:

01.//圖表顯示提示資訊02.myChart.showLoading({03.text: "圖表資料正在努力載入...",04.x: "center",05.y: "center",06.textStyle: {07.color:"red",08.fontSize:1409.},10.effect:"spin"11.});

注意:

9、hideLoading()

描述:

隱藏圖表資料載入過度提示資訊,示例程式碼:

1.myChart.hideLoading();

10、getZrender()

描述:

獲取當前圖表所用ZRender例項,可用於新增額外圖形或進行深度定製,zrender介面詳見ZRender 示例程式碼如下所示:

1.nyChart.getZrender();

11、getDataURL(string imgType)

描述:

獲取當前圖表的Base64圖片dataURL,imgType 圖片型別,支援png|jpeg,預設為png

示例程式碼如下所示:

1.var imgUrl = myChart.getDataURL("png"

相關推薦

echarts 常用方法 初始銷燬

縱觀ECharts圖表例項化的API,主要有一下幾個相關的例項化方法:1、setOption(Object option,{boolean = true} notMerge)引數:1)、Object型別的引數 option,表示圖表資料結構 ,形如:1.var option 

【spring系列】之6:bean的初始銷燬方法

bean的生命週期:bean建立---初始化----銷燬的過程 容器管理bean的生命週期:我們可以自定義初始化和銷燬方法;容器在bean進行到當前生命週期的時候來呼叫我們自定義的初始化和銷燬方法 構造(物件建立): 單例項:在容器啟動的時候建立物件 多例項:在每次獲

通過Spring @PostConstruct @PreDestroy 方法 實現初始銷燬bean之前進行的操作

關於在spring 容器初始化 bean 和銷燬前所做的操作定義方式有三種: 第一種:通過@PostConstruct 和 @PreDestroy 方法 實現初始化和銷燬bean之前進行的操作 第二種是:通過 在xml中定義init-method 和 d

【Spring學習筆記】4:三種做屬性連線的Annotation,指示初始銷燬方法的Annotation

屬性連線 屬性連線是指配置DI的方式,之前學了可以在<bean ...></bean>裡面使用<constructor-arg .../>和<property .../> 元素做屬性連線。 Spring裡還可以

init-methoddestroy-method指定的方法是該類裡的哪個方法初始那個方法銷燬

<bean id="userService" class="com.bjsxt.service.UserService"  init-method="init" destroy-method="destory"> <property name="userD

【Spring】【Bean的scope屬性】【Bean的初始銷燬方法

Bean的scope屬性 在Spring容器中的物件,預設是單例的.如dao,service.單例可以提高效能 但是也需要每次獲取都要new一次Bean物件.如Struts2的 Action物件,每

【Spring註解驅動開發】如何使用@Bean註解指定初始銷燬方法?看這一篇就夠了!!

## 寫在前面 > 在【[String註解驅動開發專題](https://www.cnblogs.com/binghe001/category/1780611.html)】中,前面的文章我們主要講了有關於如何向Spring容器中註冊bean的知識,大家可以到【[String註解驅動開發專題](http

spring ioc---定製bean初始銷燬時的回撥函式

約莫有4種方式定製bean初始化和銷燬時的回撥函式,如下表格. 方式 說明 使用beans標籤的屬性 beans標籤中,使用以下兩個屬性, `default-init-method`和`default-destroy-m

spring-bean生命週期之初始銷燬的三種方式

1,註解bean之指定init-method/destroy-method 這種方式spring註解之@Bean註解,這邊再簡單演示如下: 配置類中增加一個bean如下: /** * 定義一個bean物件 * @return */

Spring Bean的初始銷燬方式詳解

最近在專案中需要封裝kafka的服務,其中使用到了工廠模式,該模式涉及到了Spring Bean的初始化和銷燬,如是研究了一番,總結如下,和大家共勉之 Spring Bean的初始化和銷燬Bean有幾種方法了?答案是3種 方法一:使用@PostConstruct註解初始化,

JAVAEE顛覆者,SpringBoot實戰一書學習小記(Bean的Scope,Bean的動態注入,Bean初始銷燬

Bean的Scope每一個bean可以新增Scope標籤來設定個人理解從此看出Spring的控制反轉預設一直都在用一個例項注入1.Singleton 一個Spring容器中只有一個Bean的例項,此為Spring的預設配置,全容器共享一個例項。2.Prototype 每次呼叫

Spring bean的初始銷燬三種方式及優先順序

  Spring bean的初始化和銷燬有三種方式   通過實現 InitializingBean/DisposableBean 介面來定製初始化之後/銷燬之前的操作方法;優先順序第二   通過 元素的 init-method/destroy-method屬性指定初始化之

Spring框架, bean的生命週期中,初始銷燬.

我們可以配置bean的初始化和銷燬前的方法, 有三種方法:1,在配置檔案中的<beans>標籤中配置default-init-method="defautInit" default-destroy-method="defaultDestroy"然後在bean中去寫

Bean的初始銷燬(java配置方式)

bean生命週期管理 spring對bean的生命週期的操作提供了支援,在使用java配置和註解配置下提供瞭如下兩種方式: 1、java配置:使用@Bean 的initMethod和destoyMethod 2、註解方式:@PostConstruct和@PreD

Spring bean 的初始銷燬的三種方式執行順序

Spring 容器中的 Bean 是有生命週期的,spring 允許 Bean 在初始化完成後以及銷燬前執行特定的操作。 下面是常用的三種指定特定操作的方法: 通過實現InitializingBean/DisposableBean 介面來定製初始化之後/銷燬之前的操作方法;

Spring bean的初始銷燬

另外一個方法讓bean實現Spring的InitializingBean和DisposableBean介面,InitializingBean的afterPropertiesSet()和DisposableBean的destroy()方法分別會在bean初始化和移除應

FFmpeg:常見結構體的初始銷燬(AVFormatContext,AVFrame等)——雷神神文

===================================================== FFmpeg的庫函式原始碼分析文章列表: 【架構圖】 【通用】 【解碼】 【編碼】

FFmpeg原始碼簡單分析:常見結構體的初始銷燬(AVFormatContext,AVFrame等)

=====================================================FFmpeg的庫函式原始碼分析文章列表:【架構圖】【通用】【解碼】【編碼】【其它】【指令碼】【H.264】================================

Dynamics Plugin 初始常用方法

using System; using Microsoft.Xrm.Sdk; using Microsoft.Xrm.Sdk.Query; namespace Utility { public class PluginServiceProvider { public

Dynamics CRM PluginServiceProvider Plugin的初始常用方法

using System; using Microsoft.Xrm.Sdk; using Microsoft.Xrm.Sdk.Query; namespace Utility { public class PluginServiceProvider {