Echarts图表效果图（Make A Pie替代）

已于 2022-06-14 15:18:49 修改
阅读量481 收藏 1
点赞数
分类专栏： 工具类 文章标签： echarts 前端
于 2022-06-14 15:03:36 首次发布
原文链接：https://blog.csdn.net/IDOshi201109/article/details/122838792
版权

Echarts图表效果图（Make A Pie替代）

Make A Pie 是由社区贡献者维护的用于 Apache ECharts 作品分享的第三方非官方社区。平时做Echarts图表经常需要用到，近期官方已经关闭，找到以下几个可替代的网站。（Make A Pie替代网址）都可以在线编辑方便好用

1、http://analysis.datains.cn/finance-admin/#/chartLib/all

在这里插入图片描述

2、makeapie 复刻站点1：http://ppchart.com/

在这里插入图片描述

3、Make A Pie复刻站点2：http://www.isqqw.com/ 备用地址http://echarts.isqqw.com/

在这里插入图片描述

4、Make A Pie复刻站点3： http://pie.antcode.net

在这里插入图片描述

————————————————
版权声明：本文为CSDN博主「狮兄」的原创文章，遵循CC 4.0 BY-SA版权协议，转载请附上原文出处链接及本声明。
原文链接：https://blog.csdn.net/IDOshi201109/article/details/122838792

前端小白۞
关注
  • 0
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
可视化工具推荐 推荐一个比echarts更适合高端开发者的工具highcharts
qq_42907061的博客
08-10 1508
推荐两个特别好用，特别高级，同时还免费的接口
[echarts] 图表网站 ppchart made a pie
qq_14993591的博客
08-16 2010
Make A Pie 是由社区贡献者维护的用于 Apache ECharts 作品分享的第三方非官方社区。平时做Echarts图表经常需要用到，近期官方已经关闭，找到以下几个可替代的网站。（Make A Pie替代网址）
Echarts Make A Pie社区暂停服务，最新的链接如下
见贤思齐焉，见不贤内自省
02-14 1665
Echarts Make A Pie社区暂停服务，最新的链接如下
echarts常用方法（一）
KOOk123456的博客
04-23 244
　　目前，项目中涉及到图表的，使用echarts的频率较多，因为UI设计一般不会考虑到是否能实现的问题，他们专注的只是显示的效果。所以作为前端开发，要对echarts进行不同程度的改造，组合，甚至重写等。接下来会根据我目前的接触到的问题，进行一个循序渐进的总结。因为echart版本的升级等问题，虽说会兼容低版本，但是部分写法依旧在新版本的效果与老版本有区别。以下方法大家只作为参考，版本的...
Echarts地图与图表联动
10-20
使用Echarts实现地图与图表的联动。这里的效果为点击美国的某个州，下面就会对应的刷新该州与其他州人口的对比饼图。全网首发，独此一家。
echarts散点图及数字翻转效果demo
06-04
因项目大屏需要，用echarts做了散点图效果，直接打开demo就能看到气泡效果。还有数字翻转效果的demo。两个demo都可直接打开。如果对你有用，请五星好评。
Echarts 图表工具 属性解析大全
最新发布
12-18
百度Echarts图表工具的option中个属性详解 title tooltip legend grid dataZoom xAxis yAxis bar line pie series 具体插件 可到官网 https://echarts.apache.org/zh/index.html 查看下载 官网有非常多的各种...
pie_echarts.rar
08-16
本文简单介绍使用ajax从JSON文件加载数据，动态生产并状态。
导出多个饼状图pie图表到ppt中
09-03
String mtemplateName = "E:/PIE/mtemplate/PIE" + dataList.size() + ".pptx"; String path ="E:/PIE/NewPPT/NewPIE" + dataList.size() + ".pptx"; XMLSlideShow pptx = new XMLSlideShow(new FileInputStream...
❤ 让echarts更简单酷炫的网站
林太白
05-09 860
推荐一些 让echarts更简单酷炫的网站
echarts柱状图设置多段markline的替代性方案
WINDRUNNER360的博客
11-27 2656
给柱状图的每个柱子设置一个单独的警示线，可以用markline或者custom系列
ECharts社区 Make A Pie 停用了，这几款可以代替使用
Zzzzzzzzzzzke的博客
03-11 3415
Make A Pie社区在2月15日开始暂停服务。一下几个网址可以代替使用。 1.http://analysis.datains.cn/finance-admin/index.html#/chartLib/all 2.https://www.makeapie.cn/echarts_component/polar 3.http://ppchart.com/#/ 4.https://www.isqqw.com/#/homepage ............
相较于echarts，也许这款数据可视化软件更加适合你
Shanhaibi的博客
04-01 1963
echarts作为一款开源数据可视化工具有着许多优点，但是如果你在使用echarts时经常遇到问题，那么相较于echarts，选择一款专业的数据可视化软件也许更符合你的需求。 今天就将为你介绍一款神奇的数据可视化软件——山海鲸可视化。
ECharts柱状图常见效果
目标检测专栏持续更新中，改进YOLO系列通用，适用v5、v7、v8、所有博客均是团队原创博客，所有文章禁止转载，违者必究。
05-14 971
目录 基础 最大值、最小值、平均值 条形：横向 背景色 折柱混合 堆叠、高亮 本文记录一些平时常见的柱状图的效果图及代码，需要时方便直接套用。本文只列出echarts的配置项代码，不了解echarts的使用方法可查看 官方文档。 基础 效果图： 配置项： option = { xAxis: { type: 'category', data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'] }, yAxis: { t
ECharts饼图常见效果
sunddy_x的博客
05-15 3946
本文记录一些平时常见的折线图的效果图及代码，需要时方便直接套用。本文只列出echarts的配置项代码，不了解echarts的使用方法可查看官方文档。 基础饼图、选中高亮 效果图： 配置项： option = { tooltip: { trigger: 'item' }, legend: { left: 'center' }, series: [ { name: '电商', type: 'pie', radius: '50%',
Echarts图表没数据的时候，用图片代替暂无数据(图片自适应)
曾小超的博客
10-26 3966
有数据时： 没数据时： <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Echarts图表没数据的时候，用图片代替暂无数据</title> <!-- 引入 echarts.js --> <script src="js/echarts.min.js"></script> &l.
javase 生成echarts图表
07-14
### 回答1： JavaSE 可以使用 echarts4j 库来生成 Echarts 图表。 Echarts 是一个可视化的图表库，提供了丰富的图表类型，包括折线图、柱状图、饼图等等。而 echarts4j 则是一个针对 JavaSE 开发的 Echarts 封装库，方便 Java 开发者在代码中生成和使用 Echarts 图表。 使用 echarts4j 可以通过几行代码来生成 Echarts 图表。首先，需要创建一个 ECharts 对象，然后根据需要创建不同类型的图表对象，例如折线图对象或柱状图对象。接着，通过设置图表的各种属性，如标题、大小、数据等，来定制化图表的样式和内容。最后，将图表对象添加到 ECharts 对象中，并将生成的图表写入到 HTML 文件中。 以下是一个使用 echarts4j 生成折线图的示例代码： ```java import com.github.abel533.echarts.ECharts; import com.github.abel533.echarts.Option; import com.github.abel533.echarts.axis.CategoryAxis; import com.github.abel533.echarts.axis.ValueAxis; import com.github.abel533.echarts.code.LineType; import com.github.abel533.echarts.code.Magic; import com.github.abel533.echarts.code.Tool; public class EchartsDemo { public static void main(String[] args) { // 创建 ECharts 对象 ECharts echarts = new ECharts(); // 创建折线图对象 Option option = new Option(); option.title("折线图示例"); // 设置横坐标和纵坐标 CategoryAxis categoryAxis = new CategoryAxis(); categoryAxis.data("Mon", "Tue", "Wed", "Thu", "Fri", "Sat", "Sun"); option.xAxis(categoryAxis); ValueAxis valueAxis = new ValueAxis(); option.yAxis(valueAxis); // 添加数据 option.series(echarts4j.series.Line().data(120, 200, 150, 80, 70, 110, 130)); // 设置图表工具 option.toolbox().show(true).feature(Tool.mark, Tool.dataView, Tool.restore, Tool.saveAsImage); // 设置图表样式 option.tooltip().trigger(LineType.item).formatter("{a} <br/>{b} : {c}"); // 将图表添加到 ECharts 对象中 echarts.setOption(option); // 将生成的图表写入到 HTML 文件中 echarts.writeToHtml("result.html"); } } ``` 通过上述代码，在运行后会生成一个 result.html 文件，在浏览器中打开该文件即可看到生成的折线图。以上仅是一个简单的示例，echarts4j 还提供了丰富的方法和属性，可以实现更多定制化的需求。 ### 回答2： 使用JavaSE生成Echarts图表通常需要以下步骤： 1. 导入Echarts库：首先，需要在Java项目中导入Echarts的相关库文件，这些库文件可以从Echarts官方网站下载并导入到项目中。 2. 创建图表实例：在Java代码中，可以通过创建ECharts对象来初始化一个图表实例。例如，可以使用`ECharts echarts = new ECharts();`来创建一个空的图表实例。 3. 设置图表基本属性：通过`echarts.setOption(Option option)`方法，可以设置图表的基本属性，例如标题、图例、坐标轴、提示框等。这些属性可以通过Option对象来定义和配置。 4. 添加图表数据：调用`echarts.getData().add(Series series)`方法来添加图表的数据序列。可以使用Series对象来定义每个数据序列的类型（例如折线图、柱状图等）以及对应的数据项。 5. 渲染图表：使用JavaFX、Swing或其他图形库，将图表实例渲染到图形界面中显示。 6. 保存图表：如果需要将图表保存为图片或其他格式，可以使用Echarts提供的API进行保存。 7. 更新图表：如果需要动态更新图表的数据，可以通过修改图表实例的数据序列，并重新渲染图表来实现。 总之，使用JavaSE生成Echarts图表需要导入相关库文件，创建图表实例并设置属性，添加数据并渲染图表，可以通过JavaFX、Swing等图形库来显示图表，并可以进行图表保存和动态更新。这样就可以在Java项目中实现生成Echarts图表的功能。 ### 回答3： JavaSE可以使用Echarts提供的Java API来生成图表。Echarts是一个基于JavaScript的数据可视化库，可以用来创建各种类型的图表，如折线图、柱状图、饼图等。 首先，我们需要在JavaSE项目中引入Echarts的Java API库。可以通过在pom.xml文件中配置Maven依赖，或者手动将API库文件添加到项目中。 接下来，我们可以使用Java代码来生成Echarts图表。首先，我们需要创建一个Echarts实例，可以通过调用Echarts提供的构造方法来实现，例如： ```java import com.github.abel533.echarts.ECharts; import com.github.abel533.echarts.Option; import com.github.abel533.echarts.code.Magic; import com.github.abel533.echarts.code.Tool; import com.github.abel533.echarts.json.GsonOption; // 创建Echarts实例 ECharts echarts = new ECharts(); GsonOption option = new GsonOption(); // 设置图表的通用属性 option.title().text("图表标题"); option.tooltip().show(true); // 设置图表的数据 option.legend().data("图例1", "图例2"); option.xAxis().data("数据1", "数据2", "数据3"); option.yAxis().name("数值"); // 添加图表的系列数据 option.series("图例1", Magic.line, new ArrayList<>(Arrays.asList(10, 20, 30))); option.series("图例2", Magic.pie, new ArrayList<>(Arrays.asList(100, 200, 300))); // 设置图表的工具栏 option.toolbox().show(true).feature(Tool.dataView, Tool.magicType, Tool.restore); // 将Option设置到Echarts实例中 echarts.setOption(option); // 将Echarts实例输出为HTML文件或JSON字符串 String echartsHtml = echarts.toHtml(); String echartsJson = echarts.toJson(); ``` 在以上示例中，我们创建了一个ECharts实例echarts，并通过调用Option的相关方法设置了图表的属性和数据。最后，通过调用Echarts提供的toHtml()或toJson()方法，可以将Echarts实例输出为HTML文件或JSON字符串。 需要注意的是，以上示例仅为演示Echarts的基本用法，在实际使用中，可以根据具体需求来设置更多的属性和数据。有关Echarts的更多详细用法，可以查阅Echarts的官方文档。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值