基于canvas实现的高性能、跨平台的股票图表库--clchart

最新推荐文章于 2024-07-06 18:29:48 发布
最新推荐文章于 2024-07-06 18:29:48 发布
阅读量4.7k 收藏 4
点赞数 3
分类专栏： 前端 移动开发 javascript 文章标签：  canvas  chart stock-chart data-visualization clchart
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/seerline/article/details/80075359
版权
ClChart是一个基于canvas的股票数据可视化开源项目，支持PC、webApp、React Native和Weex。针对股票图表，它提供高性能、跨平台的解决方案，尤其在处理大量数据和用户交互时。设计目标包括兼容GCanvas以实现在React Native和Weex上的原生绘图，以及支持自定义公式和插件系统。
摘要由CSDN通过智能技术生成

什么是 ClChart？

ClChart是一个基于canvas创建的简单、高性能和跨平台的股票数据可视化开源项目。支持PC、webApp以及React Native和Weex等平台。在React Native和Weex上完全适配开源项目GCanvas，可轻松使用GCanvas来使得您开发的应用在android和ios上具有原生绘图的能力。

为什么需要ClChart

在现有的开源库中，不乏有非常不错的开源图表库，通用图表库有chartjs,echart,highchart等,这些图表库具有非常完备的图表类型以及强大的绘图能力及速度，但由于这些项目需要有通用性，在绘制有价证劵交易图时我们需要进行拓展是比较南。而针对股票等有价证劵特定的图表库有：techanjs和highcharts/highstock等项目，这些图表库对股票绘图已经做了一些非常专业的处理及优化了，但是他们均基于svg来绘图。我们在绘制大量数据图表以及处理跨平台时会存在性能问题，

以下为我们在使用过程中对各画图库在绘制股票类型的K线图做的一个比较

以下所做的比较均为使用这些图表库来绘制有价证劵类型的K线图的绘图能力的比较,数据为主观经验判定

最低0.47元/天 解锁文章
seerline
关注
专栏目录
High-performance, cross-platform stock chart library based on the canvas - clchart
seerline的博客
05-08 464
What is ClChartClChart is a simple, high-performance and cross-platform open source project for stock data visualization created based on the canvas. Support PC, webApp and React Native and Weex platf...
clchart：使用画布创建的快速，简单且跨平台的（html5 react-native weex wechat-applet）股票图表库
02-05
clchart 使用canvas元素的简单跨平台股票图表 安装 说明书下载 您可以从下载最新版本的clchart npm npm install clchart --save 从源构建 克隆和构建基础项目： git clone git@github.com:seerline/clchart.git cd clchart npm install # Then to build npm run build 文献资料 （处理） （编写中） 贡献 git clone https://github.com/seerline/clchart.git npm install npm run dev 屏
如何使用echart做K线图
最新发布
huanghm88的专栏
07-06 318
使用ECharts制作K线图需要先引入ECharts的库文件，然后通过调用相应的API来配置和渲染K线图。需要注意的是，在实际使用中，你需要根据你的数据和需求来配置相应的x轴、y轴和数据系列等属性，以满足你的具体需求。
canvas高效绘制10万图形,你必须知道的高效绘制技巧
weixin_33882452的博客
11-25 1046
最近的一个客户项目中，简化的需求是绘制按照行列绘制很多个圆圈。需求看起来不难，上手就可以做,写两个for循环。 原始绘制方法 首先定义了很多Circle对象，在遍历循环中调用该对象的draw方法。代码如下： for (var i = 0; i < column; i++) { for (var j = 0; j < r...
clchart基于canvas实现的高性能跨平台的股票图表库
08-08
ClChart是一个基于canvas创建的简单、高性能和跨平台的股票数据可视化开源项目。支持PC、webApp以及React Native和Weex等平台。在React Native和Weex上完全适配开源项目GCanvas，可轻松使用GCanvas来使得您开发的应用在android和ios上具有原生绘图的能力。
uCharts高性能跨全端图表
04-22
**uCharts高性能跨全端图表** 是一个基于canvas API开发的图表库，旨在提供一种统一的解决方案，使得开发者可以通过编写一套代码，实现跨平台的图表展示。它支持Web、iOS、Android（通过uni-app或taro框架）、以及...
Vue Konva - 基于 Canvas 开发的 2d JavaScript框架库 - 简单使用整理
热门推荐
Amy的博客
08-25 2万+
最近项目中用到Vue Konva框架，遇到一些问题基本搜不到，网上的文章基本都是些入门教程什么的。所以本文整理了使用过程中遇到的问题以及解决办法，希望你用到的时候有所帮助。 基本是按照我在开发中使用的顺序来写的，使用方法和错误处理没有做单独区分。如有需要可以搜索关键字。 2018.8.25 需求：类似美图秀秀网页版的拼图工具。但是美图秀秀用的是 Flash，我们用 canvas，所以能参...
探秘 FinanceReactNative：一款高效且灵活的金融应用开发框架
gitblog_00008的博客
03-24 367
探秘 FinanceReactNative：一款高效且灵活的金融应用开发框架 FinanceReactNative项目地址:https://gitcode.com/gh_mirrors/fi/FinanceReactNative 项目简介 FinanceReactNative 是一个基于 React Native 框架构建的专门用于开发金融类移动应用的开源库。它提供了一系列预设的组件、样式和功能...
Android 自定义View与ViewGroup
yanhuomatou2015的博客
08-30 332
自定义View与ViewGroup 一、概述： （一）、View和ViewGroup的职责 1、ViewGroup的职责是什么？ ViewGroup相当于一个放置View的容器，在写布局xml的时候，会告诉容器（凡是以layout开头的属性，都是为用于告诉容器），容器宽度（layout_width）、高度（layout_height）、对齐方式（layout_gravity），还有margin等。因此ViewGroup的职能为：给childView计算出建议的宽和高和测量模式 ，决定childView的位置
股票K线图控件
01-16
给公司做的K线图控件，用来显示股票的价格的。采用visual c++ 开发，本人没有写太多的文档，不过代码里面有一定的注释。由于要测试，本工程是个可执行文件的工程，需要的人可以只copy里面的头文件和C++文件，不一定要按照我的测试界面那样做。
SimpleStockSystem.rar_C++编写的K线图_K线_SimpleStockSystem_股票_股票系统
07-14
这个是用c++编写的一个关于gdi绘图程序 主要功能是实现股票系统的k线图
小程序chartjs，小程序折线图图表
03-29
小程序折线图 小程序chartjs 小程序图表
如何(c++,js)写一个传统的K线图和走势图4 - K线图
小银
12-24 2394
首先先讲下K线图的主图部分由哪些元素组成 看图 1.顶部指标信息区域 2.顶部信息地雷 （用来显示一些公告或新闻信息，财务等信息） 3.底部信息地雷 （用来显示一些公告或新闻信息，财务等信息） 信息地雷是用来显示对应这个数据所在时间上发生的事件信息（如新闻，公告，龙虎榜，满足某一个策略等等） 一些特色的K线图会在这里显示一些特有的信息 4.K线和指标区域 5.当前屏最高价和...
Echarts分时图绘制
zhanghuaikun的博客
02-26 8540
应为公司要做一个手机端的分时图，百度echats中只有折线图所以这边查看了api进行了些改造，有需要的可以私聊我。首先可以参考echats中的折线图demo这边就不具体说明了function printKtime() { // 获取金额数组 var data = ktimeArray; option = { tooltip : { trigger : 'axis',            ...
highstock java_纯JavaScript编写的开源股票图表控件Highstock v7.1.2版本发布
weixin_36050866的博客
02-25 300
Highstock使用纯JavaScript编写，为你创建股票图表和常用时间分段图表，包括复杂的导航选项，例如：小导航仪系列、预定日期范围、日期选择器、滚动和平移。Highstock v7.1.2更新内容：●Highcharts 7.1.2中列出的大多数更改也适用于Highstock 7.1.2。『点击查看』● 添加了新选项plotBands.acrossPanes和plotLines.acros...
JavaScript基础——使用Canvas画图
bboyjoe的博客
12-22 1万+
HTML5的元素提供了一组JavaScript API，让我们可以动态地创建图形和图像。图形是在一个特定的上下文中创建的，而上下文对象目前有两种。第一种是2D上下文，可以执行原始的绘图操作，比如： 1）设置填充、描边颜色和模式； 2）绘制矩形； 3）绘制路径； 4）绘制文本； 5）创建渐变和模式。 第二种是3D上下文，即WebGL上下文。WebGL是从OpenGLES2.0移植到浏览器
canvas实现的几何图形密集变化动画html页面源码
mazai5080的博客
05-03 257
大家好，今天给大家介绍一款，canvas实现的几何图形密集变化动画html页面源码（图1）。送给大家哦，获取方式在本文末尾。 图1 点击任意位置可以切换动画模式（图2） 图2 代码完整，需要的朋友可以下载学习（图3） 图3 本源码编码：10150，需要的朋友，关注文末公众号后，搜索10150，即可获取。 <!doctype html> <html> <head> <meta charset="utf-8"> <title&
HTML5 Canvas图表库精选：18款优秀库解析
这些基于Canvas的图表库简化了数据可视化的过程，使得非图形设计背景的开发者也能轻松创建出专业级的图表。 1. Visualize：该库允许开发者从HTML表格中提取数据并将其转化为Canvas上的可视化图表。 2. rGraph：提供...
评论 4
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值