00:00
哈喽,各位小伙伴们大家好,那接下来啊,咱们呢,去聊一下子一叉4.0当中新增的一个特性叫做data site数据集。那首先说啊,一叉四开始支持了数据集。组建了用于单独的数据。从而呢,数据呢,可以单独管理。被多个组件复用。并且啊,可以自由指定数据到视觉的映射。这一特性呢?将逻辑和数据进行分离,带来呢更好的复用并易于理解。那咱们呢,可以看一下的下面的这个案例。其实啊,下面这个案例不就是咱刚刚所做的嘛,只不过数据是放在每一个系列的里面。那么这一回如果是用数据集去完成,那你会发现咱们的这些图表的数据啊,是要单独进行管理的。
01:06
那所以说啊,咱们看一下子怎么使用来咱们呢,搞一下子。这个是零几呢,这是咱们的一个零四,这个呢叫做数据集,哎,数据集data set的一个使用。那当然啊,老师呢,直接把零三的这个DEMO,咱呢就直接给他拿过来了。那么数据集到底是怎么回事呢?你看啊,咱们呢,先把咱们的这个项目先给他跑起来。对吧,眼睛看见了你再说。走。数据集是什么意思呢?就是把你这些图表的数据啊集中在一起,放到一个二维的数组里面。举一个例子,你看啊,比如说那这块呢,咱来一个叫做数据集老师呢,Let一个date等于什么一个数组,但是要注意这个数组务必是一个二维数组。
02:07
对不,那么这个二维数组里面放置的就是什么呢?放置的就是相应你这些图表的数据。比如说X轴有什么有衣服。对不,哎,衣服。比如说那咱们再来,比如说将来咱们的折线图。对吧,或者是柱状图第一个数据是多少呢?比如说咱给他来个十。对不十。对不20还有多少30。对,不但是你要注意啊,你要注意十,你可以理解为什么呢,理解为是这个呃,柱状图的数据。他是屎。那么20呢,你可以理解为什么呢,理解为是折线图的这个数据啊,从20开始,但是你要注意丙图。他一条数据可不够,因为一条数据呢,它只是占这么大,但是别忘了去拍文字。
03:00
所以说咱们这个数据呢,老师给他来一个,那这个呢叫做什么叫做X值是多少呢?比如说是30。那咱们呢,可以多来几个二维数组,因为咱们的X轴是几个呢?数数是不是四个,所以说咱们的也来四个数据,你看啊第二个。第三个第四个,那这里呢,咱们分别改一下衣服,那这个是什么呢?是直播。对不,还有这个咱们表演叫游戏。以及还有电影。对吧,那这块老师改啊叫XY,那这个呢叫做Z,那这个呢,咱就叫做T。对不,那当然,现在咱们的只是声明了一个全局变量,对,是个二维数组,但是这个数据根本没有。那么咱们呢,可以怎么办呢?可以把原来的哎这一些图表的数据啊贝,你可以给它怎么的注释掉。在这都给它注掉,就这个date也给它注释掉。
04:01
那你会发现咱们的这个,呃图表,那是不是就没数据了。对吧,啥都没了。那所以说咱们的字符集就派到用场了。对不,那咱们呢,就可以设置咱们的字符集,写一下设置字符集。怎么设置呢?叫做data side,它们右侧需要的是一个对象,当然怎么写咱们不知道,那你可以怎么办呢?你可以看一下子,人家相应的这个官网叫E。找你。那咱们呢,去看一下它的一个配置项,当然找谁呢?找咱们的这个字符集,找一下data set就不在这儿了。对不,那么data set怎么用呢?那咱们呢,可以往上看看啊,它其中呢,有一个东西很好用,就叫做south啊south呢就是相应字符集的属性的属性值。对吧,咱们这里呢,可以来一个叫做S啊,叫做呃数据源吧,叫做so,为什么呢,为这个二维数组,那咱们呢,先保存一下,先刷新你看一下的数据有没有。
05:12
哎,是不是有了一部分,但是你会发现一件事,什么事儿,你看啊,现在这么玩他不对。你现在这么玩,你看所有的柱状图,它的数据都是多少。都是十,你看嘛,没发现都是十吗?对不,那折线图呢,都是多少呢?都是20,你看嘛,这不都是20对吧,以及丙图这儿它也不对。对吧,那所以说你字符集要这么设置它是不对的。那怎么玩呢?你看一下子在这儿。还是看他的这个官网,咱们呢,先聊聊谁呢,先聊聊这个柱状图啊,就聊聊这个柱状图。那咱们去找一下serious,找一下这个柱状图,应该是这个棒。它其中啊有一个字段叫什么叫做UN扣啊按扣。
06:03
这玩意儿可以干什么呢?可以定义贝的哪个维度被编码成什么?可能你这么读,你读不明白啥意思呢,说白了,咱先找到咱的这个棒啊,就是它呢,可以来一个叫做安扣的这样的一个属性。它的它是干什么,就是指定你这个饼图啊,这个柱状图用的是字符集当中的哪一个数据。对不对,当然咱这个数据吧,最好呢,给他调一调,你不这么搞吧,你要是这么搞吧,看着太怪了,对吧,这咱给来个20啊行,来个12,来个16,来个19。那这个呢,咱也都改改吧,22对吧,哎,五十五四十四对吧,32这个咱也稍微改改,13对吧,六十三七十,呃五十三七十三数据都稍微改改。对不?那老师呢,先给他去掉,咱们回首再看一下子。
07:03
你回首再看一下子对吧,哎,再看一下你看啊,咱们呢,还是得研究,你看啊,你盯住这儿。来看这。你看,首先说衣服。衣服的数据你看有没有对应上。咱们先瞄演十十,26,还有一个是接近于19,差不多20,这是没问题的,以及咱们的折线图,那应该是22也没问题,对吧,22完了之后呢,是55也差不多,以及44以及32,但是你会发现一件事,啥事呢?你看这这是对吗。这是他不对,你看咱的文字根本不是游戏衣服什么什么的,对吧,所以说呢,咱们要指定指定什么,指定每一个图表到底用的是哪一个数据。对不,所以说这里面呢,咱们要用到刚刚所说的这个叫做安扣,你看咱搞一下子看一下它的这个,呃,官网。
08:00
你看按扣的是用来干什么的呢?是用来定义你这个图到底是用的是哪是是那个二维数当中的哪一条数据。对不对,你看它的写法嘛,比如说按扣的Y等于二代表啥,它代表Y轴用的是索引值为二的这条数据。对不,你看咱你你看一下子,你比如说看下咱们这个图标,咱们这个图标就比如说这个这个这个柱状图水平轴的数据已经有了,衣服直播,游戏电影没问题,但是它的Y轴咱们可以指定一下数据。对不,咱们一个一个调你看啊,就比如说他的安扣。啊,它的Y轴用的是啥?用的是这个字符集当中索引值为几呢?011的这个数据。Y等于一代表什么?代表的用的是字符集当中所引值为一的这些元素。当然现在没有任何变化,你看嘛,还是这个样子。
09:00
对吧,那以及还有谁呢,还有咱们的这个折线图,那也一样。这呢,咱给他来个叫安后,那它的Y呢,应该为多少呢?为三。啊,不是二,你数一下子嘛,零。一二,那现在应该也没有什么变化。对,不但是饼图这块呢,你看一下他该怎么写,那还是得看文档,看他的这个饼图,咱们呢,还是找一下子这个安扣的,你看他该怎么写,因为它设置的可不是一条数据,你像丙图像那个柱状图像,这折线图一条数据就行,但是饼图是两个,所以咱们还是得看文档,看它怎么写,你看。按扣当中呢,还有一种写法叫什么叫item name啊,就是你这个饼图的名字用的是谁?啊,应该咱们用的应该是XYZ,对不?所以这块呢,咱们得去调一下子,那这也是一样,叫an code,比如说它的item name,饼图的name啊,这块写一下,这是啥呢?就是饼图旁边的文字。
10:05
饼图。哎,旁边不是叛变啊,旁边的文字用的是谁,它用的呢,应该是索引值为几呢?咱数数啊0123。对,不应该用的是三,以及它的那个饼图的Y6应该是多少,应该是4VA啊Lu y1,四,那这样那文字才对。所以说咱们刷新你看一下子,这回是不是XY啊啊,当然这个Y没有出来,那可能这个大小还要调。对吧,比如咱给他调个二百五啊,二百五对吧,半径的是25对吧,那你今晚上得调了。对吧,XYZ是不是就出来了,对吧,所以说这玩意儿叫什么,叫做字符集,说白了就是数据独立出来,而且它必须是一个二维数组。那么首先说你丙图对吧,比如说你柱状图需要用到的字符集是哪一列数据,那你就给你指定,比如说Y轴,我用的都是这一列。
11:08
对吧,比如说折线图,Y轴用的都是这一列,那以及像这个柱状图它比较特殊啊,丙图比较特殊,因为它不仅仅要指定数据,还有指定什么,指定这个name,那name怎么指定的,就按照人家写法name对吧,Name等于三,那就就是写就是XYZY6是谁,是16 15~70。对吧,所以说这里呢,咱们也要对于字符集也有一个大概的了解,所以说这是咱们的E叉4.0当中新增的一个叫做字符集。对不这不这儿嘛,字符集。所以说数据是独立出来的。对吧。
我来说两句