1 Star 0 Fork 6

sre / go-charts

forked from Gitee 极速下载 / go-charts 
加入 Gitee
与超过 1200万 开发者一起发现、参与优秀开源项目,私有仓库也完全免费 :)
免费加入
克隆/下载
贡献代码
同步代码
取消
提示: 由于 Git 不支持空文件夾,创建文件夹后会生成空的 .keep 文件
Loading...
README
MIT

go-charts

license Build Status

go-charts基于go-chart,更简单方便的形式生成数据图表,支持svgpng两种方式的输出,支持主题light, dark, grafana以及ant。默认的输入格式为png,默认主题为light

Apache ECharts在前端开发中得到众多开发者的认可,因此go-charts提供了兼容Apache ECharts的配置参数,简单快捷的生成相似的图表(svgpng),方便插入至Email或分享使用。下面为常用的图表截图(主题为light与grafana):

go-charts

go-table

支持图表类型

支持以下的图表类型:line, bar, horizontal bar, pie, radar, funnel 以及 table

示例

下面的示例为go-charts两种方式的参数配置:golang的参数配置、echarts的JSON配置,输出相同的折线图。 更多的示例参考:./examples/目录

Line Chart

package main

import (
	charts "github.com/vicanso/go-charts/v2"
)

func main() {
	values := [][]float64{
		{
			120,
			132,
			101,
			134,
			90,
			230,
			210,
		},
		{
			// snip...
		},
		{
			// snip...
		},
		{
			// snip...
		},
		{
			// snip...
		},
	}
	p, err := charts.LineRender(
		values,
		charts.TitleTextOptionFunc("Line"),
		charts.XAxisDataOptionFunc([]string{
			"Mon",
			"Tue",
			"Wed",
			"Thu",
			"Fri",
			"Sat",
			"Sun",
		}),
		charts.LegendLabelsOptionFunc([]string{
			"Email",
			"Union Ads",
			"Video Ads",
			"Direct",
			"Search Engine",
		}, charts.PositionCenter),
	)

	if err != nil {
		panic(err)
	}

	buf, err := p.Bytes()
	if err != nil {
		panic(err)
	}
	// snip...
}

Bar Chart

package main

import (
	"github.com/vicanso/go-charts/v2"
)

func main() {
	values := [][]float64{
		{
			2.0,
			4.9,
			7.0,
			23.2,
			25.6,
			76.7,
			135.6,
			162.2,
			32.6,
			20.0,
			6.4,
			3.3,
		},
		{
			// snip...	
		},
	}
	p, err := charts.BarRender(
		values,
		charts.XAxisDataOptionFunc([]string{
			"Jan",
			"Feb",
			"Mar",
			"Apr",
			"May",
			"Jun",
			"Jul",
			"Aug",
			"Sep",
			"Oct",
			"Nov",
			"Dec",
		}),
		charts.LegendLabelsOptionFunc([]string{
			"Rainfall",
			"Evaporation",
		}, charts.PositionRight),
		charts.MarkLineOptionFunc(0, charts.SeriesMarkDataTypeAverage),
		charts.MarkPointOptionFunc(0, charts.SeriesMarkDataTypeMax,
			charts.SeriesMarkDataTypeMin),
		// custom option func
		func(opt *charts.ChartOption) {
			opt.SeriesList[1].MarkPoint = charts.NewMarkPoint(
				charts.SeriesMarkDataTypeMax,
				charts.SeriesMarkDataTypeMin,
			)
			opt.SeriesList[1].MarkLine = charts.NewMarkLine(
				charts.SeriesMarkDataTypeAverage,
			)
		},
	)
	if err != nil {
		panic(err)
	}

	buf, err := p.Bytes()
	if err != nil {
		panic(err)
	}
	// snip...
}

Horizontal Bar Chart

package main

import (
	"github.com/vicanso/go-charts/v2"
)

func main() {
	values := [][]float64{
		{
			18203,
			23489,
			29034,
			104970,
			131744,
			630230,
		},
		{
			// snip...	
		},
	}
	p, err := charts.HorizontalBarRender(
		values,
		charts.TitleTextOptionFunc("World Population"),
		charts.PaddingOptionFunc(charts.Box{
			Top:    20,
			Right:  40,
			Bottom: 20,
			Left:   20,
		}),
		charts.LegendLabelsOptionFunc([]string{
			"2011",
			"2012",
		}),
		charts.YAxisDataOptionFunc([]string{
			"Brazil",
			"Indonesia",
			"USA",
			"India",
			"China",
			"World",
		}),
	)
	if err != nil {
		panic(err)
	}

	buf, err := p.Bytes()
	if err != nil {
		panic(err)
	}
	// snip...
}

Pie Chart

package main

import (
	"github.com/vicanso/go-charts/v2"
)

func main() {
	values := []float64{
		1048,
		735,
		580,
		484,
		300,
	}
	p, err := charts.PieRender(
		values,
		charts.TitleOptionFunc(charts.TitleOption{
			Text:    "Rainfall vs Evaporation",
			Subtext: "Fake Data",
			Left:    charts.PositionCenter,
		}),
		charts.PaddingOptionFunc(charts.Box{
			Top:    20,
			Right:  20,
			Bottom: 20,
			Left:   20,
		}),
		charts.LegendOptionFunc(charts.LegendOption{
			Orient: charts.OrientVertical,
			Data: []string{
				"Search Engine",
				"Direct",
				"Email",
				"Union Ads",
				"Video Ads",
			},
			Left: charts.PositionLeft,
		}),
		charts.PieSeriesShowLabel(),
	)
	if err != nil {
		panic(err)
	}

	buf, err := p.Bytes()
	if err != nil {
		panic(err)
	}
	// snip...	
}

Radar Chart

package main

import (
	"github.com/vicanso/go-charts/v2"
)

func main() {
	values := [][]float64{
		{
			4200,
			3000,
			20000,
			35000,
			50000,
			18000,
		},
		{
			// snip...
		},
	}
	p, err := charts.RadarRender(
		values,
		charts.TitleTextOptionFunc("Basic Radar Chart"),
		charts.LegendLabelsOptionFunc([]string{
			"Allocated Budget",
			"Actual Spending",
		}),
		charts.RadarIndicatorOptionFunc([]string{
			"Sales",
			"Administration",
			"Information Technology",
			"Customer Support",
			"Development",
			"Marketing",
		}, []float64{
			6500,
			16000,
			30000,
			38000,
			52000,
			25000,
		}),
	)
	if err != nil {
		panic(err)
	}

	buf, err := p.Bytes()
	if err != nil {
		panic(err)
	}
	// snip...
}

Funnel Chart

package main

import (
	"github.com/vicanso/go-charts/v2"
)

func main() {
	values := []float64{
		100,
		80,
		60,
		40,
		20,
	}
	p, err := charts.FunnelRender(
		values,
		charts.TitleTextOptionFunc("Funnel"),
		charts.LegendLabelsOptionFunc([]string{
			"Show",
			"Click",
			"Visit",
			"Inquiry",
			"Order",
		}),
	)
	if err != nil {
		panic(err)
	}

	buf, err := p.Bytes()
	if err != nil {
		panic(err)
	}
	// snip...
}

Table

package main

import (
	"github.com/vicanso/go-charts/v2"
)

func main() {
	header := []string{
		"Name",
		"Age",
		"Address",
		"Tag",
		"Action",
	}
	data := [][]string{
		{
			"John Brown",
			"32",
			"New York No. 1 Lake Park",
			"nice, developer",
			"Send Mail",
		},
		{
			"Jim Green	",
			"42",
			"London No. 1 Lake Park",
			"wow",
			"Send Mail",
		},
		{
			"Joe Black	",
			"32",
			"Sidney No. 1 Lake Park",
			"cool, teacher",
			"Send Mail",
		},
	}
	spans := map[int]int{
		0: 2,
		1: 1,
		// 设置第三列的span
		2: 3,
		3: 2,
		4: 2,
	}
	p, err := charts.TableRender(
		header,
		data,
		spans,
	)
	if err != nil {
		panic(err)
	}

	buf, err := p.Bytes()
	if err != nil {
		panic(err)
	}
	// snip...
}

ECharts Render

package main

import (
	"github.com/vicanso/go-charts/v2"
)

func main() {
	buf, err := charts.RenderEChartsToPNG(`{
		"title": {
			"text": "Line"
		},
		"xAxis": {
			"data": ["Mon", "Tue", "Wed", "Thu", "Fri", "Sat", "Sun"]
		},
		"series": [
			{
				"data": [150, 230, 224, 218, 135, 147, 260]
			}
		]
	}`)
	// snip...
}

常用函数

go-charts针对常用的几种图表提供了简单的调用方式以及几种常用的Option设置,便捷的生成常用图表。

  • LineRender: 折线图表,第一个参数为二维浮点数,对应图表中的点,支持不定长的OptionFunc参数,用于指定其它的属性
  • BarRender: 柱状图表,第一个参数为二维浮点数,对应柱状图的高度,支持不定长的OptionFunc参数,用于指定其它的属性
  • PieRender: 饼图表,第一个参数为浮点数数组,对应各占比,支持不定长的OptionFunc参数,用于指定其它的属性
  • RadarRender: 雷达图,第一个参数为二维浮点数,对应雷达图中的各值,支持不定长的OptionFunc参数,用于指定其它的属性
  • FunnelRender: 漏斗图,第一个参数为浮点数数组,对应各占比,支持不定长的OptionFunc参数,用于指定其它的属性
  • PNGTypeOption: 指定输出PNG
  • FontFamilyOptionFunc: 指定使用的字体
  • ThemeOptionFunc: 指定使用的主题类型
  • TitleOptionFunc: 指定标题相关属性
  • LegendOptionFunc: 指定图例相关属性
  • XAxisOptionFunc: 指定x轴的相关属性
  • YAxisOptionFunc: 指定y轴的相关属性
  • WidthOptionFunc: 指定宽度
  • HeightOptionFunc: 指定高度
  • PaddingOptionFunc: 指定空白填充区域
  • BoxOptionFunc: 指定内容区域
  • ChildOptionFunc: 指定子图表
  • RadarIndicatorOptionFunc: 雷达图指示器相关属性
  • BackgroundColorOptionFunc: 设置背景图颜色

ECharts参数说明

名称有[]的参数非echarts的原有参数,为go-charts的新增参数,可根据实际使用场景添加。

  • [type] 画布类型,支持svgpng,默认为svg
  • [theme] 颜色主题,支持darklight以及grafana模式,默认为light
  • [fontFamily] 字体,全局的字体设置
  • [padding] 图表的内边距,单位px。支持以下几种模式的设置
    • padding: 5 设置内边距为5
    • padding: [5, 10] 设置上下的内边距为 5,左右的内边距为 10
    • padding:[5, 10, 5, 10] 分别设置上右下左边距
  • [box] 图表的区域,以{"left": Int, "right": Int, "top": Int, "bottom": Int}的形式配置
  • [width] 画布宽度,默认为600
  • [height] 画布高度,默认为400
  • title 图表标题,包括标题内容、高度、颜色等
    • title.text 标题文本,支持以\n的形式换行
    • title.subtext 副标题文本,支持以\n的形式换行
    • title.left 标题与容器左侧的距离,可设置为left, right, center, 20% 以及 20 这样的具体数值
    • title.top 标题与容器顶部的距离,暂仅支持具体数值,如20
    • title.textStyle.color 标题文字颜色
    • title.textStyle.fontSize 标题文字字体大小
    • title.textStyle.fontFamily 标题文字的字体系列,需要注意此配置是会影响整个图表的字体
  • xAxis 直角坐标系grid中的x轴,由于go-charts仅支持单一个x轴,因此若参数为数组多个x轴,只使用第一个配置
    • xAxis.boundaryGap 坐标轴两边留白策略,仅支持三种设置方式null, true或者falsenulltrue时则数据点展示在两个刻度中间
    • xAxis.splitNumber 坐标轴的分割段数,需要注意的是这个分割段数只是个预估值,最后实际显示的段数会在这个基础上根据分割后坐标轴刻度显示的易读程度作调整
    • xAxis.data x轴的展示文案,暂只支持字符串数组,如["Mon", "Tue"],其数量需要与展示点一致
  • yAxis 直角坐标系grid中的y轴,最多支持两个y轴
    • yAxis.min 坐标轴刻度最小值,若不设置则自动计算
    • yAxis.max 坐标轴刻度最大值,若不设置则自动计算
    • yAxis.axisLabel.formatter 刻度标签的内容格式器,如"formatter": "{value} kg"
    • yAxis.axisLine.lineStyle.color 坐标轴颜色
  • legend 图表中不同系列的标记
    • legend.show 图例是否显示,如果不需要展示需要设置为false
    • legend.data 图例的数据数组,为字符串数组,如["Email", "Video Ads"]
    • legend.align 图例标记和文本的对齐,可设置为left或者right,默认为标记靠左left
    • legend.padding legend的padding,配置方式与图表的padding一致
    • legend.left legend离容器左侧的距离,其值可以为具体的像素值(20)或百分比(20%)、left或者right
    • legend.top legend离容器顶部的距离,暂仅支持数值形式
  • radar 雷达图的坐标系
    • radar.indicator 雷达图的指示器,用来指定雷达图中的多个变量(维度)
      • radar.indicator.name 指示器名称
      • radar.indicator.max 指示器的最大值,可选,建议设置
      • radar.indicator.min 指示器的最小值,可选,默认为 0
  • series 图表的数据项列表
    • series.name 图表的名称,与legend.data对应,两者只只设置其一
    • series.type 图表的展示类型,暂支持line, bar, pie, radar 以及 funnel。需要注意只有linebar可以混用
    • series.radius 饼图的半径值,如50%,默认为40%
    • series.yAxisIndex 该数据项使用的y轴,默认为0,对yAxis的配置对应
    • series.label.show 是否显示文本标签(默认为对应的值)
    • series.label.distance 距离图形元素的距离
    • series.label.color 文本标签的颜色
    • series.itemStyle.color 该数据项展示时使用的颜色
    • series.markPoint 图表的标注配置
    • series.markPoint.symbolSize 标注的大小,默认为30
    • series.markPoint.data 标注类型,仅支持数组形式,其类型只支持maxmin,如:`[{"type": "max"}, {"type": "min"}]
    • series.markLine 图表的标线配置
    • series.markPoint.data 标线类型,仅支持数组形式,其类型只支持maxmin以及average,如:`[{"type": "max"}, {"type": "min"}, {"type": "average"}]
    • series.data 数据项对应的数据数组,支持以下形式的数据:
      • 数值 常用形式,数组数据为浮点数组,如[1.1, 2,3, 5.2]
      • 结构体 pie图表或bar图表中指定样式使用,如[{"value": 1048, "name": "Search Engine"},{"value": 735,"name": "Direct"}]
  • [children] 嵌套的子图表参数列表,图表支持嵌套的形式=

性能

简单的图表生成PNG在20ms左右,而SVG的性能则更快,性能上比起使用chrome headless加载echarts图表展示页面再截图生成的方式大幅度提升,满足简单的图表生成需求。

BenchmarkMultiChartPNGRender-8                78          15216336 ns/op         2298308 B/op       1148 allocs/op
BenchmarkMultiChartSVGRender-8               367           3356325 ns/op        20597282 B/op       3088 allocs/op

中文字符

默认使用的字符为roboto为英文字体库,因此如果需要显示中文字符需要增加中文字体库,InstallFont函数可添加对应的字体库,成功添加之后则指定title.textStyle.fontFamily即可。 在浏览器中使用svg时,如果指定的fontFamily不支持中文字符,展示的中文并不会乱码,但是会导致在计算字符宽度等错误。

字体文件可以在中文字库noto-cjk下载,注意下载时选择字体格式为 ttf 格式,如果选用 otf 格式可能会加载失败。

示例见 examples/chinese/main.go

MIT License Copyright (c) 2021 Tree Xie Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions: The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software. THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

简介

go-charts基于 go-chart 生成数据图表,无其它模块的依赖纯golang的实现,支持svg与png的输出,Apache ECharts在前端开发中得到众多开发者的认可 展开 收起
MIT
取消

发行版

暂无发行版

贡献者

全部

近期动态

加载更多
不能加载更多了
1
https://gitee.com/sregit/go-charts.git
git@gitee.com:sregit/go-charts.git
sregit
go-charts
go-charts
main

搜索帮助