1.Echarts绘图库引入

学习演示过程不涉及大型工程，只需要下载Echarts的js文件在html中引用即可。使用echarts.js进行数据分析，在本人体验来看，要比python提供的绘制库强大的多。

1.1下载Echarts.js

下载链接https://www.jsdelivr.com/package/npm/echarts

选择第一个“echarts.min.js”打开

将内容拷贝到本地js文件中

1.2 测试Echarts.js

用Echarts画一个线性回归需要用到的分析图

<html lang="en">
<head><meta charset="UTF-8"><title>Title</title><script src="echarts.js"></script>
</head>
<body><div id="main" style="height: 600px; width: 1000px;"></div><script>function draw(data, realData) {// 画图前先绑定目标对象let chart = echarts.init(document.querySelector("#main"))let option = {// 必须初始化X轴和Y轴xAxis: {},yAxis: {},// 表示数据部分，如果有多个对象，那么表示在一个画板上叠加画图series: [// 在该画板上绘制散点图{symbolSize: 5,data: data,type: 'scatter'},// 在该画板上叠加绘制折线图{data: realData,type: "line",symbol: "none",color: "red"}]}// 绘制chart.setOption(option)}// 制造数据function randomMaker() {// data是经过混淆的数据, realData是真实数据let data = [], realData = []// 创造数据依据的函数function y(x) {return 2 * x + 17}// 创造100条随机数据for(let i = 0; i < 100; i++) {// 横坐标范围是0~500let x = Math.random() * 500// 数据混淆，对函数值进行波动处理let hx = y(x) + (Math.random() - 0.5) * 100data.push([x, hx])realData.push([x, y(x)])}return [data, realData]}// 画图draw(...randomMaker())</script>
</body>
</html>

绘制效果如下：

2.Sylvester矩阵库引入

2.下载Sylvester.js(西尔维斯特)矩阵库

机器学习和深度学习涉及到线性代数的矩阵操作非常多，这里使用github上star第二高的西尔维斯特矩阵库来辅助我们矩阵运算。

2.1 下载矩阵库

下载地址：http://sylvester.jcoglan.com/#download (VPN)

选择Download下载即可。下载完进行解压，把sylvester.js拷贝到你需要的地方，这个js仅仅支持浏览器环境，不支持CommonJS规范，所以不能在nodejs中使用，如果想使用支持CommonJS，AMD或CMD规范的矩阵库，可以到上图所示的矩阵库的github网址上找到支持对应模块化规范的矩阵库。

2.2 测试矩阵库

<html lang="en">
<head><meta charset="UTF-8"><title>Title</title><script src="sylvester.js"></script>
</head>
<body><script>var M1 = $M([[1,7,3],[9,4,0],[2,7,1]]);var M2 = $M([[6,2,8],[9,1,3],[0,7,6]]);var M = M1.x(M2);console.log(M)</script>
</body>
</html>

输出结果如下图：

JavaScript机器学习的图形可视化和矩阵库相关推荐

前 15 个 JavaScript 机器学习库
机器学习领域新技术的迅猛发展帮助软件开发人员以前所未有的方式构建新的人工智能应用程序. 目前,大多数 AI 爱好者利用 Python 框架进行 AI 和机器学习开发. 但环顾四周,人们可能还会发现基于 ...
IEC61131, IEC61499图形可视化，PLC图形可视化，PLC组态，VBScript和JavaScript脚本，解决方案源代码, 开发平台100% VC++源码2018!
IEC61131, IEC61499图形可视化,PLC图形可视化,PLC组态,VBScript和JavaScript脚本,解决方案源代码, 开发平台100% VC++源码2018! -- 全球领先. ...
js 只准输入数字_基于TensorFlow.js的JavaScript机器学习
Credits: aijs.rocks 虽然python或r编程语言有一个相对容易的学习曲线,但是Web开发人员更喜欢在他们舒适的javascript区域内做事情.目前来看,node.js已经开始向每 ...
基于TensorFlow.js的JavaScript机器学习
Credits: aijs.rocks 虽然python或r编程语言有一个相对容易的学习曲线,但是Web开发人员更喜欢在他们舒适的javascript区域内做事情.目前来看,node.js已经开始向每 ...
百度大数据可视化产品矩阵
百度数据可视化实验室的产品矩阵如下图所示,内容涵盖基础库.各种可视化产品以及应用产品. 在官网中,百度数据可视化实验室分享了其发展和规划: 基于基础的可视化规范,依托 ZRender.ClayGL 基 ...
vue-threeJS数据驱动的三维图形可视化
数据驱动的三维图形可视化在信息暴涨的2010-2016年间,冷暴力的扁平化确实有效降低用户的信息焦虑感,使有限的精力更高效处理过多的信息流.二维平面化扁平化在苹果等大头引领下,成为大众用户机器交流默 ...
JavaScript机器学习之线性回归
译者按: AI时代,不会机器学习的JavaScript开发者不是好的前端工程师. 原文: Machine Learning with JavaScript : Part 1 译者: Fundebug ...
python数据可视化库动态的_Python数据可视化：Pandas库，只要一行代码就能实现...
本文的文字及图片来源于网络,仅供学习.交流使用,不具有任何商业用途,如有问题请及时联系我们以作处理. 以下文章一级AI入门学习 ,作者小伍哥刚接触Python的新手.小白,可以复制下面的链接去免费观 ...
用python画熊_Python数据可视化：Pandas库，只要一行代码就能实现
本文的文字及图片来源于网络,仅供学习.交流使用,不具有任何商业用途,如有问题请及时联系我们以作处理. 以下文章一级AI入门学习 ,作者小伍哥刚接触Python的新手.小白,可以复制下面的链接去免费观 ...

JavaScript机器学习的图形可视化和矩阵库