Winny 发表于 2021-5-18 16:36:21

SpreadJS V14 Update1 新特性 - 迷你图增强 - 直方图

本帖最后由 Winny 于 2021-5-18 16:51 编辑

直方图是数值数据分布的精确图形表示,在日常数据分析展示中有较高的使用频率,因此SpreadJS V14 Update1在迷你图中新增了直方图,直方图包含两种类型,分别为离散直方分布图及连续直方分布图。

1. 在设计器中插入迷你直方图
    step1: 点击插入 -->迷你图;
   
    step2: 选择数据源位置与迷你图放置位置;
   
    step3: 点击设置,对迷你图进行各部分进行设置。
   

2. 代码实现插入迷你图
    首先对直方图各模块进行简单的介绍:
   
    具体设置API如下:
/**
*@dataRange: 必须,数据源区域;
*@continuous: 可选,为true时表示连续直方图,false表示离散型直方图,默认为true;
*@paintLabel: 可选,底部数据轴,为true时显示数据轴,false时不显示,默认为false;
*@scale: 可选,当为连续型直方图时,用于设置bin width,数值类型,默认值为1,需要大于0;
*@barWidth: 可选;用于设置barWidth,barWidth = auto calc width * barWdth,数值类型,默认值为1,取值范围0<value<=1
*@barColor: 可选,用于设置直方图数据项颜色,默认为“5B9BD5”,支持css的颜色设置方式;
*@labelFontStyle: 可选,用于设置底部数据轴字体风格,默认9pt Caribl,支持css字体属性的设置,但仅支持font-style,font-weight,font-size,font-family;
*@labelColor: 可选,底部数据轴数据颜色,默认为'silver',支持css颜色设置方式;
*@edgeColor: 可选,设置数据项边框颜色
**/
HISTOGRAMSPARKLINE(dataRange,continuous?,paintLabel?,scale?,barWidth?,barColor?,labelFontStyle?,labelColor,edgeColor?)    在单元格添加迷你直方图:
sheet.setFormula(1, 1, "HISTOGRAMSPARKLINE(A1:A10,TRUE,TRUE,3)" );
// show a continuous histogram sparkline .
sheet.setFormula(1, 2, "HISTOGRAMSPARKLINE(A1:A10,TRUE,,3)");
// show a continuous histogram sparkline without data label.
sheet.setFormula(1, 3, "HISTOGRAMSPARKLINE(A1:A10,FALSE)");
// show a discrete histogram sparkline without data label    直方图底部数据轴内容为什么不显示?
    当单个数据轴宽度大于平均数据项宽度时,底部的数据轴不会显示,因此在使用的时候尽量将单元格的宽度调大一些,避免发生数据轴无法显示的问题。

   


页: [1]
查看完整版本: SpreadJS V14 Update1 新特性 - 迷你图增强 - 直方图