eCharts 最后一个数据点无法显示symbol

option = {
title: {
text: '折线图堆叠'
},
tooltip: {
trigger: 'axis'
},
legend: {
data:[{name:'邮件营销',icon:'rect'}]
},
grid: {
left: '10%',
right: '10%',
containLabel: true
},
toolbox: {
feature: {
saveAsImage: {}
}
},

xAxis: {
    type: 'category',
               name: "日期",
            nameLocation: 'end',
            nameGap: 38,
    boundaryGap: true,
                    axisLine: {
                show: false,
                onZero: false
            },
    data: [

"2016-01-09",
"2016-01-10",
"2016-01-11",
"2016-01-12",
"2016-01-13",
"2016-01-14",
"2016-01-15",
"2016-01-16",
"2016-01-17",
"2016-01-18",
"2016-01-19",
"2016-01-20",
"2016-01-21",
"2016-01-22",
"2016-01-23",
"2016-01-24",
"2016-01-25",
"2016-01-26",
"2016-01-27",
"2016-01-28",
"2016-01-29",
"2016-01-30",
"2016-01-31",
"2016-02-01",
"2016-02-02",
"2016-02-03",
"2016-02-04",
"2016-02-05",
"2016-02-06",
"2016-02-07",
"2016-02-08",
"2016-02-09",
"2016-02-10",
"2016-02-11",
"2016-02-12",
"2016-02-13",
"2016-02-14",
"2016-02-15",
"2016-02-16",
"2016-02-17",
"2016-02-18",
"2016-02-19",
"2016-02-20",
"2016-02-21",
"2016-02-22",
"2016-02-23",
"2016-02-24",
"2016-02-25",
"2016-02-26",
"2016-02-27",
"2016-02-28",
"2016-02-29",
"2016-03-01",
"2016-03-02",
"2016-03-03",
"2016-03-04",
"2016-03-05",
"2016-03-06",
"2016-03-07",
"2016-03-08",
"2016-03-09",
"2016-03-10",
"2016-03-11",
"2016-03-12",
"2016-03-13",
"2016-03-14",
"2016-03-15",
"2016-03-16",
"2016-03-17",
"2016-03-18",
"2016-03-19",
"2016-03-20",
"2016-03-21",
"2016-03-22",
"2016-03-23",
"2016-03-24",
"2016-03-25",
"2016-03-26",
"2016-03-27",
"2016-03-28",
"2016-03-29",
"2016-03-30",
"2016-03-31",
"2016-04-01",
"2016-04-02",
"2016-04-03",
"2016-04-04",
"2016-04-05",
"2016-04-06",
"2016-04-07",
"2016-04-08",
"2016-04-09",
"2016-04-10",
"2016-04-11",
"2016-04-12",
"2016-04-13",
"2016-04-14",
"2016-04-15",
"2016-04-16",
"2016-04-17",
"2016-04-18",
"2016-04-19",
"2016-04-20",
"2016-04-21",
"2016-04-22",
"2016-04-23",
"2016-04-24",
"2016-04-25",
"2016-04-26",
"2016-04-27",
"2016-04-28",
"2016-04-29",
"2016-04-30",
"2016-05-01",
"2016-05-02",
"2016-05-03",
"2016-05-04",
"2016-05-05",
"2016-05-06",
"2016-05-07",
"2016-05-08",
"2016-05-09",
"2016-05-10",
"2016-05-11",
"2016-05-12",
"2016-05-13",
"2016-05-14",
"2016-05-15",
"2016-05-16",
"2016-05-17",
"2016-05-18",
"2016-05-19",
"2016-05-20",
"2016-05-21",
"2016-05-22",
"2016-05-23",
"2016-05-24",
"2016-05-25",
"2016-05-26",
"2016-05-27",
"2016-05-28",
"2016-05-29",
"2016-05-30",
"2016-05-31",
"2016-06-01",
"2016-06-02",
"2016-06-03",
"2016-06-04",
"2016-06-05",
"2016-06-06"
],
axisLabel:{
show:true,
formatter: function (value) {
return value;
},
showMinLabel: true,
showMaxLabel: true
}
},
yAxis: {
type: 'value'
},
series: [
{
name:'邮件营销',
type:'line',
symbol:"none",
data: [
{
"value": "67.8100",
"symbol": "rect",
"symbolSize": 11
},
"67.9000",
"67.9800",
"68.0700",
"68.0100",
"67.9600",
"67.8600",
"67.7400",
"67.6100",
"67.6600",
"67.7400",
"67.8600",
"67.9100",
"67.9600",
"68.0700",
"68.2100",
"68.2200",
"68.1600",
"68.0700",
"67.9300",
"67.9100",
"67.9200",
"67.9000",
"67.9600",
"67.9600",
"67.9700",
"68.0000",
"68.0700",
"68.2200",
"68.2800",
"68.3300",
"68.3600",
"68.3300",
"68.2400",
"68.1700",
"68.0900",
"68.1700",
"68.0800",
"67.9600",
"67.8700",
"67.7700",
"67.7500",
"67.8400",
"67.9500",
"68.0200",
"68.1500",
"68.2900",
"68.3000",
"68.2300",
"68.1300",
"68.0200",
"68.0100",
"67.8700",
"67.6900",
"67.5400",
"67.4700",
"67.3900",
"67.3700",
"67.3300",
"67.2800",
"67.4400",
"67.5100",
"67.5300",
"67.5200",
"67.5100",
"67.6000",
"67.5400",
"67.4600",
"67.3100",
"67.2400",
"67.2400",
"67.2100",
"67.2200",
"67.1700",
"67.2100",
"67.3700",
"67.4800",
"67.6100",
"67.7200",
"67.7700",
"67.7700",
"67.7800",
"67.6400",
"67.6600",
"67.5900",
"67.5000",
"67.4600",
"67.3700",
"67.2000",
"67.1500",
"67.1100",
"67.0600",
"67.1100",
"67.2400",
"67.2800",
"67.2800",
"67.3500",
"67.3200",
"67.1000",
"67.1000",
"67.0400",
"66.9300",
"66.7400",
"66.6900",
"66.6900",
"66.7400",
"66.7900",
"66.7900",
"66.7100",
"66.7100",
"66.8000",
"66.8600",
"66.8700",
"66.8900",
"66.8900",
"66.9700",
"67.0500",
"67.0200",
"67.0300",
"67.0800",
"67.1100",
"67.1200",
"67.1400",
"67.2200",
"67.2900",
"67.3900",
"67.4500",
"67.4400",
"67.5500",
"67.6200",
"67.6900",
"67.7000",
"67.7300",
"67.7700",
"67.8200",
"67.8200",
"67.8600",
"67.8800",
"67.8900",
"67.9100",
"67.9100",
"67.9500",
"68.1000",
"68.1400",
"68.1600",
"68.2900",
"68.3200",
"68.3600",
"68.4400",
{
"value": "68.4700",
"symbol": "rect",
"symbolSize": 11
}
],
}
]
};


0

4个回答

再次不好意思,我把数据增加到n条后,也出现了该问题,是鼠标在这个点上才会出现symbol.
但是更换了js的版本后,该问题再也复现不出了,估计在api里也有这个情况的解决办法,再看看api吧,不好意思.

0
chaoyue1397
Edison_kon 回复yfyu: showAllSymbol:true,嗯 我也看到了,在doc的[配置项]中series的showAllSymbol:true,我把整个这个echart的doc看的差不多了,哈哈 感谢你提的问题,让我学了个新技能
一年多之前 回复
YYF_CS
yfyu 最终解决方法是设置系列showAllSymbol:true 可解决,特别感谢你的回答!
一年多之前 回复
chaoyue1397
Edison_kon 回复yfyu: 我用的是cdn上 3.8.5的版本 https://cdn.bootcss.com/echarts/3.8.5/echarts.min.js你看看是不是可以解决这个问题.
一年多之前 回复
YYF_CS
yfyu 请问你更换的是哪个版本的js,api中我没找到这类问题的解决方法
一年多之前 回复

我把你的数据格式化了一下...发现好像不对

yAxis: {
type: 'value'
},

这个,的位置,你检查一下...

0

不好意思,好像没有什么问题,不过 你还是格式化一下数据,仔细捋一下,我也忘了修改哪了,将数据减少到3条呈现效果如图图片说明

0

ECharts 图表设置标记的大小 symbolSize 和获取标记的值

ECharts 是百度出品,一个纯 Javascript 的图表库,可以流畅的运行在 PC 和移动设备上,兼容当前绝大部分浏览器(IE8/9/10/11,Chrome,Firefox,Safari等),底层依赖轻量级的 Canvas 类库 ZRender,提供直观,生动,可交互,可高度个性化定制的数据可视化图表

0
Csdn user default icon
上传中...
上传图片
插入图片
抄袭、复制答案,以达到刷声望分或其他目的的行为,在CSDN问答是严格禁止的,一经发现立刻封号。是时候展现真正的技术了!
其他相关推荐
echarts折线图最后一位不显示的问题及重影问题
1、echarts折线图最后一位无法显示数据的问题,将xAxis:  boundaryGap: false,改成true就解决了。2、在某些安卓盒子上使用echarts会有重影的问题,将animation改为false就可以了...
求教 echarts 中 symbol 图片路径问题?
用的vue框架想在地图上显示点,把点替换成图片,弄了一下午图片路径一直不对,要不然就显示的一个白色的小方块,图片老是显示不出来 symbol:''image://../../assets/images/red.png错了吗...
Echarts3里的地图标记点事件效果实现
echarts官方api:http://echarts.baidu.com/index.html
ECharts的markline自定义端点样式
在ECharts中设置markline标线,当标线type为average,max,或者min时,ECharts给出的默认样式为一条Y轴开始指向另一端的单向箭头线nnnnnnimage.pngnn代码如下:nmarkLine: {n data: [{n type: 'average'n }]n}nn有时候项目对于标线样式会有定制化...
echarts 记录一些
一,折线图n 1)xAxis ,yAxis 中:属性axisLine:false,//是否显示坐标轴轴线nseries(直角系) 中 :属性 smooth:false //是否平滑曲线显示nseries : [n                 {n                  smooth :true ,//折线为曲线n                  symbol:'non
echarts星状图节点图片自定义 && 总结图片引入的方法
我用的是图片转base64代码,做法就是let myIMG = 'data:image/png;base64,iVBORw0KGgoAAAANSUXXXX......'series.data.symbol: `image://${myIMG}`注意这里需要加上image://的前缀,与css常规的直接填上myIMG代码不同。梳理几种常用的引入图片的方法:1,img标签使用src属性在html里添加...
Echarts数据可视化series-effectscatter特效散点图,开发全解+完美注释
mytextStyle={n color:"#333",//文字颜色n fontStyle:"normal",//italic斜体 oblique倾斜n fontWeight:"normal", //文字粗细bold bolder lighter 100 | 200 | 300 | 400...n fontFamily:"sans-serif", //字体系列
echarts 绘制动态图表
之前我对数据库数据进行展示的时候已经可以利用echarts绘制了一个图表,但是我想要的图表是可以像它官网那样,动画式的,然后我看了很久它的官网和百度了很多别人的方法,最终写出来了。rn废话不多说,直接附代码:rnrnrnrnrn无标题文档rnrn -->rnrnrn-->rnrn//数组存储json数据rnvar time=[];    rnvar so2=[];   rnvar ph=[];rn
Echarts之symbolSize的大小设置
symbolSize number, Array, Functionnn[ default: 4 ]nn标记的大小,可以设置成诸如 10 这样单一的数字,也可以用数组分开表示宽和高,例如 [20, 10] 表示标记宽为20,高为10。nn如果需要每个数据的图形大小不一样,可以设置为如下格式的回调函数:nnn(value: Array|number, params: Object) => nu...
echarts中自定义图片的矢量路径设置
echarts中自定义图片的矢量路径设置欢迎使用Markdown编辑器新的改变功能快捷键合理的创建标题,有助于目录的生成如何改变文本的样式插入链接与图片如何插入一段漂亮的代码片生成一个适合你的列表创建一个表格设定内容居中、居左、居右SmartyPants创建一个自定义列表如何创建一个注脚注释也是必不可少的KaTeX数学公式新的甘特图功能,丰富你的文章UML 图表FLowchart流程图导出与导入导...
echart2.0实现折线图转折点闪烁效果
option = {rn    title : {rn        text: '某楼盘销售情况',rn        subtext: '纯属虚构'rn    },rn    tooltip : {rn        trigger: 'axis'rn    },rn    legend: {rn        data:['意向','预购','成交']rn    },rn    toolbo
ECharts参数中回调函数的用法
rn rn--------------------------------------------2016-01-26编辑---------------------------------------rn原文中的TOOLTIP展示数据格式只针对ECHARTS2.*系列实用,由于最近ECharts更新到3.0后发现上述代码会导致结果出现错误。现修正如下:rnformatter: function(p...
echarts折线图取消折线上圆点,设置线条为虚线,设置第一个点在y轴上,拐点是曲线,线条下加填充区域
series--->symbol: "none"   取消折线上的圆点nn设置线条为虚线nnn​nseries: [{n itemStyle:{n normal:{n lineStyle:{n width:2,n type:'dotted' //设置线...
Echarts 折线图出现的问题
 官网的例子的这样子的(如下图) 最大的数据的932  可是绿色的线条开始的点到了1500以上了。nnnn把代码中的stack去掉就可以了,线条就正常了 nn nn nn...
echarts折线图实现风向功能(旋转单个symbol)
n n n n最近的项目中要使用echarts实现显示风向以及风级的功能,在开发的过程中遇到了一点小问题,如何将单个symbol设置样式呢?nn需求n利用echarts组件实现出风级折线图,显示的值为风级,在每个拐点利用箭头显示当时风向。nnnnnnn需求图nn要点n本次需要展示的有两点:n1、风级n2、风向n风级在制作的过程中很简单,就说在option中设置data...
echarts自定义功能按钮图片 网络路径格式
toolbox : {n show : true,n orient : 'vertical',n x:'left',n top : '20%',n feature : {n myTool : { n show : true, n title : '自定义扩展方法', n icon : 'image://http://localhost:8080/test/skins/test.
echarts中x轴如果时间轴在ios中不显示问题
在之前做echarts折线图时,x轴采用等间隔时间轴,在ios系统中显示空白,nn发现是日期时间的格式导致的。比如这种格式“2018-12-20”就会出现,改为“2018/12/20”就能解决...
echarts 显示所有的点的方法
axisLabel :{      interval:0   }  rnrnrn很奇怪,X轴只显示了部分节点。没有显示全。rn在xAxis上加上面的配置就能解决:
【笔记】Echarts 通过自定义图标按钮,动态修改统计图颜色
效果图:nnecharts:ntoolbox: {n show : true,n feature : {n myColor:{n show : true,n title:'颜色',n icon:'image://static/assets/images/palette.png',n oncl...
highchars折线图---数据在圆点内--x轴文字竖版排列
效果如下图nnnnn<div id="container" style="width: 100%; height: 300px; margin-top: 5px;" data-highcharts-chart="0"></div>nnnvar chart = $('#contaner').highcharts({n chart: {n d...
ECharts 设置折线颜色和小圆点颜色
ECharts 设置折线颜色只需要设置lineStyle的color即可, n 设置小圆点颜色只需要设置itemStyle的颜色即可.series: [{n name: "seriesName",n type: "line",n itemStyle: {n normal: {n color: "#2ec7c9",
echarts 树节点加图片 边框
效果图如下:nnnn修改思路nn1、找到节点创建的方法nn2、对于节点是图片类型的,做特殊处理,多加一个外边框nn主要代码说明:nna、边框设置nnitemStyle:{// 设置边框的颜色和宽度n borderColor:"red",n borderWidth:2 n ...
echarts的标记线和标记点
markPoint: 标记点---------------------------markLine:标记线 看了好几天还是不太理解markPoint和markLine的作用, 昨晚看视频终于有点理解了, 比如在一个折线图形当中我们经常看到最高和最低点都会有个标记,在echarts当中markPoint就是来标记最高和最低点的,  而有的图表中会有个平均值得虚线,markLine就是用来表示平局值的...
Echarts正态曲线上加竖线
<!DOCTYPE HTML>n<html>n<head>n <style type="text/css">n #main{n height: 500px;n border: 1px red solid;n width: 100%;n }n #main1{n height: 5
MPAndroidChart 折线图只有一个数据显示问题
MPAndroidChart是一个Android图表类框架,十分强大,GitHub地址:https://github.com/PhilJay/MPAndroidChart。nn最近在使用LineChart折线图的时候,发现当折线图数据只有一个时,不会画出折线,还不显示圆圈点。所以最后搞了好久终于解决了:就是当折线图数据只有一个时,显示一个点。具体代码如下:nnn /**n * initL...
Echarts 修改地图的标示
原飞机的路径为:nvar planePath = 'path://M1705.06,1318.313v-89.254l-319.9-221.799l0.073-208.063c0.521-84.662-26.629-121.796-63.961-121.491c-37.332-0.305-64.482,36.829-63.961,121.491l0.073,208.063l-319.9,221.
echarts 详细使用方法
1,引用rnrnrn2,初始化rnvar myChart_c;rnvar dataBT;rnvar dataX;rnvar dataY;rn myChart_c = echarts.init(document.getElementById('main_c'), 'vintage');rn    var option = {rn        title: {rn            text:
Echarts扩展百度地图实例
该项目包括echarts模块化包引入,echarts与百度地图实例的结合,最新数据点的动态闪烁等功能。
echart.js 和 chart.js 改变圆点大小
nnechart改变圆点大小nnseries : [n {n name:'零售额',n type:'line',n showSymbol: true,n symbol:'emptyCircle', //设定为实心点n symbolSize: 20, //设定实心点的...
关于echarts-formatter 数据格式化小结
一、tooltip中的数据格式(数据点的悬浮框)tooltip : {ntrigger: 'axis',nformatter:function(a,b,c){nreturn a+'<br/>'+b+c;n}n},formatter格式化方法的参数说明:(下面一段话引用自https://www.cnblogs.com/ys-wuhan/p/6149265.html){string},模板...
echarts关系图节点设置头像,并使头像以圆形来显示!
核心代码出处见:https://gallery.echartsjs.com/editor.html?c=x7rk_-y1Ydnn直接贴出全部代码:nnn<!DOCTYPE html>n<html style="height: 100%">nn<head>n <meta name="viewport" content="width=device-wid...
echart 图例的样式icon 和标记的图形symbol,如何去除背景网格线
因为自己画图时用到不同的图,如何去区分他们所以就用到了以下的方法。这个是我在官网修改的例子和展示出来的图形。rn以下是代码rnoption = {rntitle: {rntext: ‘折线图堆叠’rn},rntooltip: {rntrigger: ‘axis’rn},rnlegend: {rndata:[{rnname:“邮件营销”,rnicon:“circle”//图例项的 icon。rn},{rnname:“联盟广告”...
关于ECharts在jsp页面无法显示的问题
关于ECharts在jsp页面无法显示n问题一,HTML5到底能不能在jsp页面显示nnhtml5是html标准,属于w3c,是html标准的延伸,所有浏览器展示页面基本都是html的。所以我还是不太明白nn问题二,ECharts引用的js是哪个文件n我引用了三个nnn这是百度的nnn这是官网的n下的完整版,名字是echarts.common.min.jsnnn这个也是官网的n下的常用版,名字是e...
解决echarts 坐标轴太长无法显示的问题
问题n可以很明显看出来,纵坐标的label太长了,label显示不全。n解决方法一:n如果图的大小不固定,可以随意的话,可以利用这个图来解决。设置x的大小就行。nn解决方法二:n一般在实际应用中,会给图表分配规定的区间。这时,方法一就不太实用了,所以我们可以通过根据纵坐标的字数来换行达到全部显示的效果。n在yAxis属性中添加如下代码即可。n axisLabel:{
使用echarts生成图表时总报已实例化图表实例警告
问题:点击左侧IP更新右侧图表时总报已实例化警告!nn原因:更新图表之前没有将之前的实例dispose销毁掉 又重新实例化了图表,所以报警告。n解决办法:n在echarts图表设置内实例化图表之前先将之前的实例dispose销毁掉:nthis.$echarts.dispose(this.$refs.rightCharts); //销毁上一个图表实例nlet dataChart = this.$...
Echarts折线图line-stack数值和数值显示不一致
官网的例子:nhttps://echarts.baidu.com/examples/editor.html?c=line-stackn截取一小段代码n{n name:'邮件营销',n type:'line',n stack: '总量',n data:[120, 132, 101, 134, 90, 230, 210]n},nn发现红色线条数值为0,却和覆盖了绿色的线条nn百思...
echarts改变默认标记类型
ECharts 提供的标记类型包括 ‘circle’, ‘rect’, ‘roundRect’, ‘triangle’, ‘diamond’, ‘pin’, ‘arrow’。也可以通过 ‘image://url’ 设置为图片,其中 url 为图片的链接,或者 dataURI。可以通过 ‘path://’ 将图标设置为任意的矢量路径。这种方式相比于使用图片的方式,不用担心因为缩放而产生锯齿或模糊,而且
解决Ajax获取到数据放入echarts里不显示最有效的解决方法
解决Ajax获取到数据放入echarts里不显示最有效的解决方法
ECharts的拐点样式
ECharts 雷达图拐点样式设置rnrnrnrn rnsymbol: 'circle', //设置拐点格式样式 如:实心圆,空心圆或不显示拐点等 rn itemStyle: { rn normal:...
Echarts通过svg画扇形例子,含矩形、三角形等
<svg version="1.1" id="Layer_2" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"n width="841.89px" height="595.275px" viewBox="0 0 841.89 595.275" enable-
文章热词 机器学习教程 Objective-C培训 交互设计视频教程 颜色模型 设计制作学习
相关热词 mysql关联查询两次本表 native底部 react extjs glyph 图标 echarts教程python 怎么学习互联网大数据