G2Plot下載|G2Plot(開(kāi)箱即用的圖表庫(kù)) 官方版v2.3.11 下載

軟件簡(jiǎn)介相關(guān)版本猜你喜歡精品推薦用戶評(píng)論

G2Plot是簡(jiǎn)單、易用、并具備一定擴(kuò)展能力和組合能力的統(tǒng)計(jì)圖表庫(kù)，內(nèi)置的是業(yè)務(wù)中使用量占比超過(guò) 90% 的常規(guī)統(tǒng)計(jì)圖表。支持用戶對(duì)其進(jìn)行自定義開(kāi)發(fā)，軟件配置項(xiàng)優(yōu)化精簡(jiǎn)，僅需幾行代碼輕松生成圖表。使用起來(lái)也非常方便，可以通過(guò)將腳本下載到本地也可以直接引入在線資源。同時(shí)軟件還在不斷地進(jìn)行升級(jí)，更多高級(jí)圖表功能用戶可以自行體驗(yàn)一下。

G2Plot圖片1

軟件特色

開(kāi)箱即用

配置項(xiàng)優(yōu)化精簡(jiǎn)，僅需幾行代碼輕松生成圖表

默認(rèn)好用

即使你是可視化或設(shè)計(jì)小白，也能制作優(yōu)雅、標(biāo)準(zhǔn)的統(tǒng)計(jì)圖表

響應(yīng)式圖表

保證圖表在任何顯示尺寸、任何數(shù)據(jù)狀態(tài)下的可讀性

圖表實(shí)驗(yàn)室

來(lái)這里嘗試一下我們正在開(kāi)發(fā)中的高級(jí)圖表功能

G2Plot圖片2

修改柱狀圖顏色

柱狀圖用于描述分類數(shù)據(jù)之間的對(duì)比，如果我們把時(shí)間周期，如周、月、年，也理解為一種分類數(shù)據(jù)。那么要如何自定義柱狀圖的顏色呢，一起來(lái)看看修改方法。

1、指定點(diǎn)的顏色。如沒(méi)有配置 colorField，指定一個(gè)單值即可。對(duì) colorFiled 進(jìn)行了配置的情況下，即可以指定一系列色值，也可以通過(guò)回調(diào)函數(shù)的方法根據(jù)對(duì)應(yīng)數(shù)值進(jìn)行設(shè)置。

默認(rèn)配置：采用 theme 中的色板。

// 設(shè)置單一顏色

{

color: '#a8ddb5'

}

// 設(shè)置多色

{

colorField: 'type', // 部分圖表使用 seriesField

color: ['#d62728', '#2ca02c', '#000000'],

}

// Function

{

colorField: 'type', // 部分圖表使用 seriesField

color: ({ type }) => {

if(type === 'male'){

return 'red';

}

return 'yellow';

}

自定義圖例

圖例是圖表的輔助元素，使用顏色、大小、形狀區(qū)分不同的數(shù)據(jù)類型，用于圖表中數(shù)據(jù)的篩選。用戶可以在G2Plot中自定義圖例，下面就來(lái)告訴大家配置圖例的方法和配置項(xiàng)，方便大家自定義圖例。

1、配置圖例有兩種方式：

第一種，傳入 false 設(shè)置關(guān)閉圖例。

legend: false; // 關(guān)閉圖例

第二種，傳入 LegendCfg 對(duì)圖例進(jìn)行整體配置。

legend: {

layout: 'horizontal',

position: 'right'

}

2、配置項(xiàng)

屬性	類型	默認(rèn)值	描述
layout	string	horizontal	圖例的布局方式，可選項(xiàng)：horizontal \| vertical
title	object	-	圖例標(biāo)題配置，默認(rèn)不展示。詳見(jiàn) title 配置
position	string	-	圖例的位置。詳見(jiàn) position 配置
offsetX	number	-	圖例 x 方向的偏移。
offsetY	number	-	圖例 y 方向的偏移。
background	object	-	背景框配置項(xiàng)。詳見(jiàn) background 配置
flipPage	boolean	false	當(dāng)圖例項(xiàng)過(guò)多時(shí)是否進(jìn)行分頁(yè)。
itemWidth	number \| null	null	圖例項(xiàng)的寬度, 默認(rèn)為 null（自動(dòng)計(jì)算）。
itemHeight	number \| null	null	圖例的高度, 默認(rèn)為 null。
itemName	object	-	圖例項(xiàng) name 文本的配置。詳見(jiàn) itemName 配置
itemValue	object	-	圖例項(xiàng) value 附加值的配置項(xiàng)。詳見(jiàn) itemValue 配置。
itemSpacing	number	-	控制圖例項(xiàng)水平方向的間距
animate	boolean	-	是否開(kāi)啟動(dòng)畫開(kāi)關(guān)。
animateOption	object	-	動(dòng)畫參數(shù)配置，當(dāng)且僅當(dāng) animate 屬性為 true，即動(dòng)畫開(kāi)啟時(shí)生效，詳見(jiàn) animateOption 配置
label	object	-	文本的配置項(xiàng)。詳見(jiàn) label 配置
marker	object	-	圖例項(xiàng)的 marker 圖標(biāo)的配置。
maxWidth	number	-	圖例項(xiàng)最大寬度設(shè)置。
maxHeight	number	-	圖例項(xiàng)最大高度設(shè)置。
rail	object	-	圖例滑軌（背景）的樣式配置項(xiàng)。詳見(jiàn) rail 配置
reversed	boolean	-	是否將圖例項(xiàng)逆序展示。
min	number	-	范圍的最小值。
max	number	-	選擇范圍的最大值。
value	number[]	-	選擇的值。
slidable	boolean	-	滑塊是否可以滑動(dòng)。
track	object	-	選擇范圍的色塊樣式配置項(xiàng)。詳見(jiàn) track 配置
handler	object	-	滑塊的配置項(xiàng)。詳見(jiàn) handler 配置
custom	boolean	false	是否為自定義圖例，當(dāng)該屬性為 true 時(shí)，需要聲明 items 屬性。
items	object[]	-	用戶自己配置圖例項(xiàng)的內(nèi)容。詳見(jiàn) items 配置

自定義主題

1、內(nèi)置主題

目前默認(rèn)的內(nèi)置主要要兩套：default和dark

2、主題屬性

除了使用內(nèi)置的 default 和 dark 主題之外，還可以通過(guò)設(shè)置主題屬性來(lái)修改部分主題內(nèi)容：

下表列出了組成主題的大配置項(xiàng)上的具體屬性：

主題屬性	類型	描述
defaultColor	string	主題色
padding	number	number[]
fontFamily	string	圖表字體
colors10	string[]	分類顏色色板，分類個(gè)數(shù)小于 10 時(shí)使用
colors20	string[]	分類顏色色板，分類個(gè)數(shù)大于 10 時(shí)使用
columnWidthRatio	number	一般柱狀圖寬度占比，0 - 1 范圍數(shù)值
maxColumnWidth	number	柱狀圖最大寬度，像素值
minColumnWidth	number	柱狀圖最小寬度，像素值
roseWidthRatio	number	玫瑰圖占比，0 - 1 范圍數(shù)值
multiplePieWidthRatio	number	多層餅圖/環(huán)圖占比，0 - 1 范圍數(shù)值
geometries	object	配置每個(gè) Geometry 下每個(gè) shape 的樣式，包括默認(rèn)樣式以及各個(gè)狀態(tài)下的樣式
components	object	配置坐標(biāo)軸，圖例，tooltip, annotation 的主題樣式
labels	object	配置 Geometry 下 label 的主題樣式
innerLabels	object	配置 Geometry 下展示在圖形內(nèi)部的 labels 的主題樣式
pieLabels	object	配置餅圖 labels 的主題樣式