一、设置base64图片;

var piePatternSrc = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEMAAABECAIAAABVrR+cAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyZpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMTM4IDc5LjE1OTgyNCwgMjAxNi8wOS8xNC0wMTowOTowMSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTcgKFdpbmRvd3MpIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOjdDQUQ5QUY4NzhBMDExRUE5NjFCQzgxOEMwMzU0OTlFIiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOjdDQUQ5QUY5NzhBMDExRUE5NjFCQzgxOEMwMzU0OTlFIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6N0NBRDlBRjY3OEEwMTFFQTk2MUJDODE4QzAzNTQ5OUUiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6N0NBRDlBRjc3OEEwMTFFQTk2MUJDODE4QzAzNTQ5OUUiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz4iVig4AAAeM0lEQVR42kSb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';
var piePatternImg = new Image();
piePatternImg.src = piePatternSrc;

二、设置option;

option = {xAxis: {type: 'category',data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']},yAxis: {type: 'value'},series: [{data: [120, 200, 150, 80, 70, 110, 130],type: 'bar',label:{show:true,position:"top",},itemStyle:{barBorderRadius:[20,20,0,0,0],color: {image: piePatternImg,repeat: 'repeat'}}}]
};

三、重点代码:

itemStyle:{barBorderRadius:[20,20,0,0,0],color: {image: piePatternImg,repeat: 'repeat'}

Done!

Echarts实战案例代码(9):图表纹理填充的解决方案(柱图为例)相关推荐

  1. Echarts实战案例代码(59):geomap实现飞线、散点、引导线以及重叠label的解决

    数据格式转化 //数据格式转化var convertData = function (data) {var res = [];for (var i = 0; i < data.length; i ...

  2. Echarts实战案例代码(10):echarts结合世界所有国家地图数据集geojson的(英文翻译映射)解决方案

    国外地图,默认GeoJSON文件为英文,为了阅读友好化体验,一般需要将地区的名称翻译成中文. 一种方式是修改GeoJSON文件内部,找到对应地区的name属性,直接替换成相应的中文即可,这种方式在众多 ...

  3. Echarts实战案例代码(5):liquidFill水球组件利用svg path定制你自己的个性化图标动态图

    svg水球图演示效果 如上述的动态水球图效果,替换不同的svg图片即可实现不同的动态水球效果. svg格式说明(百度百科) SVG是一种图像文件格式,它的英文全称为Scalable Vector Gr ...

  4. Echarts实战案例代码(16):geomap地图散点图和label轮播的解决方案

    场景使用:适用于定时显示区域信息.区域警报提醒. 设置城市中心点 var center = {"南京市":[118.767413,32.041544],"无锡市" ...

  5. Echarts实战案例代码(56):geomap实现地区划分区域点击选中高亮效果

    数据格式 var zjData = [{"name": "杭州市", "value": 16596, "selected" ...

  6. Unity Shader: 理解Stencil buffer并将它用于一些实战案例(描边,多边形填充,反射区域限定,阴影体shadow volume阴影渲染)

    本文示例项目Github连接:https://github.com/liu-if-else/UnityStencilBufferUses 最近有两次被人问到stencil buffer的用法,回答的含 ...

  7. 【Pytorch神经网络实战案例】21 基于Cora数据集实现Multi_Sample Dropout图卷积网络模型的论文分类

    Multi-sample Dropout是Dropout的一个变种方法,该方法比普通Dropout的泛化能力更好,同时又可以缩短模型的训练时间.XMuli-sampleDropout还可以降低训练集和 ...

  8. Echarts( Pie,Bar)数据可视化 条形图,柱图,饼图、时间轴代码 JS-NEW

    实时代码编辑:https://gallery.echartsjs.com/editor.html?c=xPPXo1AxvB&v=1 option ={ timeline: {axisType: ...

  9. tableau应用实战案例(一)-如何通过Tableau绘制小提琴图

    前言 小提琴图 (Violin Plot)是用来展示多组数据的分布状态以及概率密度.这种图表结合了箱形图和密度图的特征,主要用来显示数据的分布形状.跟箱形图类似,但是在密度层面展示更好.在数据量非常大 ...

最新文章

  1. windows免输密码登录
  2. java 奖xls转成csv_java - 在Java中将.csv转换为.xls - 堆栈内存溢出
  3. python实现提取jira bug列表
  4. intellij修改编辑器中的注释部分的颜色
  5. 鼎信诺oracle_鼎信诺审计系统操作说明
  6. 动态规划——最长公共子序列(洛谷P1439)
  7. 编程语言对比 命名空间
  8. mt4交易系统源码_mt4周边:一款免费的数据下载工具
  9. fwoa中workflow_requestbase表currentnodetype字段含义及查看归档流程的requestid
  10. 14个新鲜的免费图标集
  11. 推荐Android中两个很好用的banner,可无限轮播,可使用第三方图片加载框架加载网络图...
  12. Linux系统结构以及用户态和核心态
  13. matlab 短时能量计算+源代码
  14. 如何用WPS在所需的页面设置奇偶数页眉
  15. 【Java二十周年】十年,二十年
  16. Pooling反向传播
  17. vue项目 webpack-dev-server 报错
  18. 隐私政策-第三方SDK汇总
  19. 关于 SONY WF1000XM3 在 Windows 10 下蓝牙连接只有 Handfree 没有 Stereo 模式
  20. springboot昆明学院档案管理系统毕业设计源码311758

热门文章

  1. 打印 上一主题 下一主题 简单讲解UEFI及MBR,及UEFI系统安装引导修复
  2. 骚扰电话不胜其烦 防止隐私泄露只能靠网友不满?
  3. 传统企业线下收益不可观,问答营销是你线上引流的好方法
  4. Oracle 10g For Windows 10.1.0和 Oracle 10g For Linux 10.1.0.3下载地址
  5. 如何卸载Visio秘钥
  6. 企业小程序开发步骤【教你创建小程序】
  7. 虚拟机Linux上网ping百度跳过的坑,亲测有效
  8. 【小白学习记录】渗透测试之信息收集
  9. LPCTSTR类型和字符串
  10. jmeter参数化之函数助手