第70页,共224页。 显示 2,235 条结果 (0.034 秒)
Echarts图形-扩展属性:Y轴实现坐标梯度增加
(本文档仅供参考) 问题 如何实现Y轴坐标轴梯度增加,如10 100 1000这种。 解决方案 可以用以下扩展属性实现: { "yAxis": { "logBase": 10, "type": 'log', "min": 1 } } 效果图如下: image2020-8-5_16-2-10.png 注:logBase为log的底数,可自行去设置,并且最小值不能为0,因为对数的指数不能为0(min属性),当最小值为0的时候,图形效果会不美观。 y轴递增 y轴梯度 调整y轴刻度标签对数显示Echarts图形-扩展属性:Y轴刻度值个数固定
(此文档仅供参考) 问题 希望Y轴刻度值个数可以自定义设置 实现方案 可以用以下扩展属性实现: { "yAxis": { type: 'value', "splitNumber": 5 } } 注意:这个分割段数只是个预估值,最后实际显示的段数会在这个基础上根据分割后坐标轴刻度显示的易读程度作调整。 Echarts官网关于此属性的解释:https://echarts.apache.org/zh/option.html#yAxis.splitNumber https://echarts.apache.org/zhEcharts图形-扩展属性:堆积柱图+线图
(此文档仅供参考) 问题 希望双Y联合图,可以实现堆积柱图+线图的效果。 实现方案 可以用以下扩展属性实现: { "series": [{ "stack": "aaa", "z": 2 }, { "stack": "aaa", "z": 2 }, { "z": 3 }] } 最终效果: image2022-5-17_16-33-25.png 属性解析说明:数据堆叠,同个类目轴上系列配置相同dataMin扩展属性调整折线图的Y轴最小值起始点,数据小数点后出现多位小数
(此文档仅供参考) 问题 用dataMin扩展属性去修改折线图的Y轴最小值起始点,数据小数点后为什么会出现多位小数? QQ截图20190409110529.jpg 1.jpg 原因 这是由于java计算浮点数造成的误差 解决方案 1.写宏来避免浮点数计算误差,参考文档 https://history.wiki.smartbi.com.cn/pages/viewpage.action?pageId=35751269 https://history.wiki.smartbi.com.cn/pages/viewpage.action?pageId=35751269 2.若采用自助仪表盘,无法写宏,建议在扩展Echarts图形-扩展属性:散点 - 地图自定义散点的图标
(本文档仅供参考) 问题 希望自定义散点地图中的图标 2022-01-19_170108.png 解决方案 参考以下扩展属性设置 对于散点地图需要个性化数据点样式效果,从echarts官网配置项说明中有两个方式: 1、直接采取dataURI 显示: { "visualMap": [{ "inRange": { "symbol": 'image://data:image/gif;base64,R0lGODlhEAAQAMQAAORHHOVSKudfOulrSOp3WOyDZu6QdvCchPGolfO0o/XBs/fNwfjZ0frl3/zy7Echarts图形-扩展属性:柱图鼠标提示保留3位小数
(本文档仅供参考) 问题 如何实现柱图鼠标提示保留3位小数的效果 解决方案 可以用以下扩展属性实现: { "tooltip": { "show": true, "formatter": "function(a){ return a.name+':'+parseFloat(a.value).toFixed(3)}" } } 效果如下图示: image2022-4-7_17-35-2.png 鼠标提示小数位数Echarts图形-扩展属性:X轴坐标轴名称与轴线之间的距离调整
(此文档仅供参考) 问题 希望调整x轴坐标轴名称与轴线的距离,避免重叠,如下图 image2021-11-3_11-29-30.png 实现方案 可以用以下扩展属性实现:(具体值设置大小可结合实际调整) { "xAxis": { "nameGap": 30 } } image2021-11-3_11-32-12.png x轴名称距离标线距离删除标签Echarts图形-扩展属性:如何自定义图形标题和图例位置
(本文档仅供参考) 问题 如何自定义图形标题和图例位置: QQ截图20181108101829.png 实现方案 可在图形中加扩展属性: { "legend": { "left": 300 }, "title": { "text": "标题", "padding": [20, 0, 0, 50], //上 右 下 左 } } padding属性具体说明可见Echarts官网:https://echarts.apache.org/zh/option.html#title.padding httpsEcharts图形-扩展属性:Y轴刻度标签与轴线之间的距离
(本文档仅供参考) 问题 如何调整y轴的标签值距离轴线向左偏移? worddav0b0d24883355eed55d709a260164dbf2.png 解决方案 可以写扩展属性实现: { "yAxis": { "axisLabel": { "margin": 20, //刻度标签与轴线之间的距离。 "left": -8, //整个echart位置 "textStyle": { "align": "left" } } } } 最终效果: worddave561b3233e37e8a4c3d641cf102b3247.png 轴标签和轴线距离Echarts图形-扩展属性:图例分页按钮、文字自定义大小
(本文档仅供参考) 问题 如何实现自定义图例分页按钮、文字大小 2023-10-10_134301.png 解决方案 可参考以下扩展属性 option = { legend: { pageIconSize: 30, pageTextStyle: { fontSize: 15 } } } 2023-10-10_133834.png 相关属性具体见Echarts官网:https://echarts.apache.org/zh/option.html#legend.pageIconSize https://echarts.apache.org/zh