<?xml version="1.0" encoding="utf-8" ?><rss version="2.0"><channel><title><![CDATA[Lingfur的博客]]></title><description><![CDATA[]]></description><link>https://blog.youkuaiyun.com/Lingfur</link><language>zh-cn</language><generator>https://blog.youkuaiyun.com/</generator><copyright><![CDATA[Copyright &copy; Lingfur]]></copyright><item><title><![CDATA[MaLiangWow马良屋]]></title><link>https://blog.youkuaiyun.com/Lingfur/article/details/123111307</link><guid>https://blog.youkuaiyun.com/Lingfur/article/details/123111307</guid><author>Lingfur</author><pubDate>Thu, 24 Feb 2022 14:37:38 +0800</pubDate><description><![CDATA[我们对世界的体验是多模态的——我们看到物体、听到声音、感觉到纹理、闻到气味、尝到味道。模态是指某件事情发生或经历的方式，一个研究问题如果包含多个模态，就被称为多模态。为了让人工智能在理解我们周围的世界方面取得进展，它需要能够一起解释这种多模态信号。多模式机器学习旨在建立能够处理和关联来自多种模式的信息的模型。这是一个日益重要和具有非凡潜力的充满活力的多学科领域。

如同厨师、小说家和电影制作人必须比食客、读者或电影观众更深刻地理解食物、写作和电影，如果我们的计算机视觉系统要真正理解视觉世界，它们不仅必须能够]]></description><category></category></item><item><title><![CDATA[Echarts 源码解读 十三]]></title><link>https://blog.youkuaiyun.com/Lingfur/article/details/122159973</link><guid>https://blog.youkuaiyun.com/Lingfur/article/details/122159973</guid><author>Lingfur</author><pubDate>Sun, 26 Dec 2021 20:16:54 +0800</pubDate><description><![CDATA[2021SC@SDUSC

单轴 SingleAxis





SingleCreator

SingleCreator文件主要为创建单轴的逻辑代码，主要代码如下：


function create(ecModel, api) {
  var singles = [];
  ecModel.eachComponent('singleAxis', function (axisModel, idx) {
    var single = new Single(axisModel, ecModel, api.]]></description><category></category></item><item><title><![CDATA[Echarts 源码解读 十二]]></title><link>https://blog.youkuaiyun.com/Lingfur/article/details/122159590</link><guid>https://blog.youkuaiyun.com/Lingfur/article/details/122159590</guid><author>Lingfur</author><pubDate>Sun, 26 Dec 2021 20:03:21 +0800</pubDate><description><![CDATA[2021SC@SDUSC

平行坐标轴 ParallelAxis



ParallelAxisAction

parallelAxisAction中注册了axisAreaSelected以及parallelAxisExpand API，主要代码如下：


var actionInfo = {
  type: 'axisAreaSelect',
  event: 'axisAreaSelected' // update: 'updateVisual'

};
export function installP]]></description><category></category></item><item><title><![CDATA[Echarts 源码解读 十一]]></title><link>https://blog.youkuaiyun.com/Lingfur/article/details/122032299</link><guid>https://blog.youkuaiyun.com/Lingfur/article/details/122032299</guid><author>Lingfur</author><pubDate>Sun, 19 Dec 2021 23:27:02 +0800</pubDate><description><![CDATA[2021SC@SDUSC

雷达坐标轴

RadarView



RadarView通过extendComponentView方法扩展自Component View，重写了render、_buildAxes、_buildSplitLineAndArea，主要代码如下：


RadarView.prototype.render = function (radarModel, ecModel, api) {
    var group = this.group;
    group.removeAll();.]]></description><category></category></item><item><title><![CDATA[Echarts 源码解读 十]]></title><link>https://blog.youkuaiyun.com/Lingfur/article/details/121894951</link><guid>https://blog.youkuaiyun.com/Lingfur/article/details/121894951</guid><author>Lingfur</author><pubDate>Sun, 12 Dec 2021 22:40:45 +0800</pubDate><description><![CDATA[2021SC@SDUSC

直角坐标轴 Axis

包括xAxis, yAxis

CartesianAxisView

CartesianAxisView扩展自AxisView，重写了render，定义了splitLine以及splitArea方法，并扩展了xAxis yAxis View。主要代码如下：


CartesianAxisView.prototype.render = function (axisModel, ecModel, api, payload) {
    this.group.r]]></description><category></category></item><item><title><![CDATA[Echarts 源码解读 九]]></title><link>https://blog.youkuaiyun.com/Lingfur/article/details/121733958</link><guid>https://blog.youkuaiyun.com/Lingfur/article/details/121733958</guid><author>Lingfur</author><pubDate>Sun, 05 Dec 2021 19:57:41 +0800</pubDate><description><![CDATA[2021SC@SDUSC



AxisBuilder

AxisBuilder中定义了axisLine、axisTickLabel以及axisName的渲染方法，主要代码如下：


var builders = {
  axisLine: function (opt, axisModel, group, transformGroup) {
    var shown = axisModel.get(['axisLine', 'show']);

    if (shown === 'auto' &amp.]]></description><category></category></item><item><title><![CDATA[Echarts 源码解读 八]]></title><link>https://blog.youkuaiyun.com/Lingfur/article/details/121595239</link><guid>https://blog.youkuaiyun.com/Lingfur/article/details/121595239</guid><author>Lingfur</author><pubDate>Sun, 28 Nov 2021 18:40:37 +0800</pubDate><description><![CDATA[2021SC@SDUSC

CartesianAxisPointer

用extend扩展自BaseAxisPoointer,重写了makeEiOption、getHandleTransform以及updateHandleTransform方法，主要源码如下：


import BaseAxisPointer from './BaseAxisPointer';

CartesianAxisPointer.prototype.makeElOption = function (elOption, value, ]]></description><category></category></item><item><title><![CDATA[Echarts 源码解读 七]]></title><link>https://blog.youkuaiyun.com/Lingfur/article/details/121452931</link><guid>https://blog.youkuaiyun.com/Lingfur/article/details/121452931</guid><author>Lingfur</author><pubDate>Sun, 21 Nov 2021 14:21:13 +0800</pubDate><description><![CDATA[2021SC@SDUSC

AxisPointer

AxisPointer为echarts中的坐标指示器，包括直角坐标以及极坐标等

install.js

install.js文件中注册了axisPointer对外api，主要代码如下:


registers.registerAction({
    type: 'updateAxisPointer',
    event: 'updateAxisPointer',
    update: ':updateAxisPointer'
  }, axis.]]></description><category></category></item><item><title><![CDATA[ECharts 源码解读 六]]></title><link>https://blog.youkuaiyun.com/Lingfur/article/details/121316371</link><guid>https://blog.youkuaiyun.com/Lingfur/article/details/121316371</guid><author>Lingfur</author><pubDate>Sun, 14 Nov 2021 13:18:13 +0800</pubDate><description><![CDATA[2021SC@SDUSC

Scroll legend.scroll 为可滚动的legend图例组件，主要包括ScrollableLegendAction、ScrollableLegendModel、ScrollableLegendView文件。

ScrollableLegendAction中注册了legend对外API：legendScroll


registers.registerAction('legendScroll', 'legendscroll', function (payload, ec]]></description><category></category></item><item><title><![CDATA[ECharts 源码解读 五]]></title><link>https://blog.youkuaiyun.com/Lingfur/article/details/121197900</link><guid>https://blog.youkuaiyun.com/Lingfur/article/details/121197900</guid><author>Lingfur</author><pubDate>Sun, 07 Nov 2021 22:25:54 +0800</pubDate><description><![CDATA[2021SC@SDUSC

Component源码解读---接上篇

plain

legend.plain为平面的legend图例组件，主要包含LegendAction、LegendModel和LegendView文件。


import LegendModel from './LegendModel';
import LegendView from './LegendView';
import legendFilter from './legendFilter';
import { installLe.]]></description><category></category></item><item><title><![CDATA[ECharts 源码解读 四]]></title><link>https://blog.youkuaiyun.com/Lingfur/article/details/121070041</link><guid>https://blog.youkuaiyun.com/Lingfur/article/details/121070041</guid><author>Lingfur</author><pubDate>Sun, 31 Oct 2021 22:43:30 +0800</pubDate><description><![CDATA[2021SC@SDUSC

Component源码解读

主要介绍各component的渲染过程以及其使用的zrender graphic

echarts对Component的定义呢，可以认为是除Series外的其他配置项。

组件类型
series             系列，
legend        图例组件
tooltip       提示框组件，
toolbox      工具栏组件，
xAxis     直角...]]></description><category></category></item><item><title><![CDATA[ECharts 源码解读 三]]></title><link>https://blog.youkuaiyun.com/Lingfur/article/details/120939287</link><guid>https://blog.youkuaiyun.com/Lingfur/article/details/120939287</guid><author>Lingfur</author><pubDate>Sun, 24 Oct 2021 19:57:16 +0800</pubDate><description><![CDATA[2021SC@SDUSC

SetOption

前面已经用init方法初始化过echarts，接下来只需配置option即可。

setOption调用顺序为：

echarts.setOption-&gt;GlobalModel.setOption(GlobalModel.js)-&gt;OptionManager.setOption(OptionManager.js)

源码主要部分如下


/**
 * @param {Object} option 配置项
 * @param {boolean} n]]></description><category></category></item><item><title><![CDATA[ECharts 源码解读 二]]></title><link>https://blog.youkuaiyun.com/Lingfur/article/details/120808152</link><guid>https://blog.youkuaiyun.com/Lingfur/article/details/120808152</guid><author>Lingfur</author><pubDate>Sun, 17 Oct 2021 11:19:44 +0800</pubDate><description><![CDATA[2021SC@SDUSC

源码结构和打包

源码使用webpack打包，查看文件webpack.config.js可知，将echarts源码编译成三个版本，分别为常用版本,精简版本，完整版本，分别对应webpack入口文件为：index.common.js、index.simple.js、index.js。

执行命令：


npm install //安装所有依赖包
webpack //打包
web pack -p//打包成压缩包（.min.js）

最后生成的文件在dist文件夹下

源码结构

ch]]></description><category></category></item><item><title><![CDATA[Echarts 源码解读 一：zrender源码分析1var zr = zrender.init(document.getElementById(‘main‘))；]]></title><link>https://blog.youkuaiyun.com/Lingfur/article/details/120680135</link><guid>https://blog.youkuaiyun.com/Lingfur/article/details/120680135</guid><author>Lingfur</author><pubDate>Sat, 09 Oct 2021 23:25:28 +0800</pubDate><description><![CDATA[2021SC@SDUSC

  因为Echarts是基于zrender进行实现的，所以解读echarts源码前，首先要对zrender有基本的了解。

  zrender是canvas的一个类库，zrender是基于canvas实现的。

目录



zrender的src文件夹

文件夹：

animation动画相关

contain包含判断

core核心代码，包含一些工具（util.js）、事件（event.js）、唯一ID（guid.js)、矩阵运算有关(matrix.js）等

dom...]]></description><category></category></item><item><title><![CDATA[Echarts源码分析项目综述]]></title><link>https://blog.youkuaiyun.com/Lingfur/article/details/120570654</link><guid>https://blog.youkuaiyun.com/Lingfur/article/details/120570654</guid><author>Lingfur</author><pubDate>Thu, 30 Sep 2021 19:26:47 +0800</pubDate><description><![CDATA[Echarts简介



  ECharts（Apache ECharts），一个使用 JavaScript 实现的开源可视化库，可以流畅的运行在 PC 和移动设备上，兼容当前绝大部分浏览器（IE9/10/11，Chrome，Firefox，Safari等），底层依赖矢量图形库ZRender，提供直观，交互丰富，可高度个性化定制的数据可视化图表。

  Echarts提供丰富的可视化类型，多种数据格式无需转换就可直接使用，拥有千万数据的前端展示、深度的交互式数据探索、多维数据的支持以及丰富的视...]]></description><category></category></item></channel></rss>