随笔分类 - echart
摘要：需求需要在echarts tooltip点击跳转对应的页面，效果如下 背景项目是用vue3和echarts实现的，echarts版本（^5.3.3），并不能把点击事件绑定在window上 且echarts 没有提供点击tooltip的方法（因为当前是基于qiankun的一个微应用）参考其他解决方法比
阅读全文
摘要：如上图所示，H类标签位于环形图底部偏左，我想把它调整到环形图的右下角的位置。 解决：利用label的padding可以调整位置，效果如下图所示： 但是padding只能调整左右方向，不能调整上下方向（写了之后不生效）所以利用label的指引线来调整上下方向的位置，比如我想把H类调高，就可以把leng
阅读全文
摘要：解决方法：给series赋值后，再设置yAxis.max和yAxis.min函数，看代码↓↓↓ //先给series赋值 series[0].data = [1,2,4,5,6] series[1].data = [4,5,6,7,8] //再设置function 的 max,min yAxis.m
阅读全文
摘要：需求： 页面上加载一个echarts环形图。 来由： 身为一个Java开发人员，被项目经理拉过来写页面，心里也是很苦逼~可是也没办法，只能硬着头皮干啊，直接上代码 // 基于准备好的dom，初始化echarts实例 var myChart = echarts.init(document.getEle
阅读全文
摘要：解决办法1：xAxis.axisLabel 属性 axisLabel的类型是object ,主要作用是： 坐标轴刻度标签的相关设置。（当然yAxis也是一样有这个属性的） [html] view plain copy axisLabel: { interval:0, rotate:40 }
阅读全文
摘要："yAxis": [ { //就是一月份这个显示为一个线段，而不是数轴那种一个点点 "show" : true, "boundaryGap": true, "type": "category", "name": "时间", "data": ["1月", "2月", "3月", "4月", "5月",
阅读全文
摘要：原文地址为： Echarts-柱状图柱图宽度设置 先看两张图 图中柱图只需要设置series中的坐标系属性barWidth就可以， 这种图柱状图，折叠柱状图都适应 eg： /** * 堆积柱状图 * @param xaxisdata x轴：标签（数组） * @param serieszs 柱状图图数
阅读全文
摘要：Y轴添加标签，可以保留1位小数 axisLabel: { formatter:function (value, index) { return value.toFixed(1); } } 效果如图： <!DOCTYPE html><html><head> <meta charset="utf-8">
阅读全文
摘要：纵坐标 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 yAxis : [ { type : 'category', data : nam
阅读全文
摘要：3D地图图表效果如下: 具体代码如下： <!DOCTYPE html><html><head> <meta charset="UTF-8"> <title>铜仁市3D地图(点击地图区域跳转到相应页面)</title> <script type="text/javascript" src="js/jq
阅读全文
摘要：最近遇到些Echarts迁徙图问题，在实现二维地图的迁徙图后开始开发3D迁徙图，在网上一查，发现3D版本迁徙图资料较少，自己研究并借鉴一些资料后写了一个小demo，希望能帮大家少走些弯路，共同学习。 一、效果图 二、准备引用文件1、Echarts：Echarts4下载2、Echarts GL：Ech
阅读全文
摘要：<!DOCTYPE html><html><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=EDGE"> <title>3D中国</title> <script src="js/jquery.mi
阅读全文
摘要：itemStyle // itemStyle 设置饼状图扇形区域样式 itemStyle: { // emphasis：英文意思是 强调;着重;（轮廓、图形等的）鲜明;突出，重读 // emphasis：设置鼠标放到哪一块扇形上面的时候，扇形样式、阴影 emphasis: { shadowBlur:
阅读全文
摘要：只需要 在xAxis 中加入 axisLabel:{ interval:0,//横轴信息全部显示 rotate:-40,//-30度角倾斜显示 } , 比如下面这样 xAxis : [ { type : 'category', axisLabel:{ interval:0,//横轴信息全部显示 ro
阅读全文
摘要：ps: 以下针对option操作 文章目录 图例过多加上滚动条图例形状图例自定义显示图例过多加上滚动条 legend:{ top:'50', bottom:'50', type:'scroll',} 避免可能出现的翻页下标错乱,加上间距top / bottom属性图例形状 legend:{ data
阅读全文
摘要：问题如图： 问题解决：将stack去掉或注释 如下图：
阅读全文
摘要：起因 实现对 label 的样式定制，自定义字体颜色、大小等属性；效果如下图 实现 itemStyle: { itemStyle: { normal: { normal: { color: '#f7ba0e', color: '#f7ba0e', label: { label: { show: tr
阅读全文
摘要：var colors = ['rgba(251,210,73,0.7)', 'rgba(124,213,253,0.7)', '#7958de', '#01d3e3'];var aCategorys = ['', '常住人口', ' 农村脱贫', ' 基本养老保险参保', '新增就业\n人数', '
阅读全文
摘要：dataZoom=[ //区域缩放 { id: 'dataZoomX', show:true, //是否显示 组件。如果设置为 false，不会显示，但是数据过滤的功能还存在。 backgroundColor:"rgba(47,69,84,0)", //组件的背景颜色 type: 'slider',
阅读全文
浙公网安备 33010602011771号