关于echarts画地图遇到的问题
1. 散点图画不上
其实很简单,我的业务需要做切换,我需要在点击按钮后在地图上画上所需的数据,在配置项中即需要两个series,一个是map的series ,另一个就是散点的series。
画上的原因主要是echarts的要求:data格式必须是有value的字段而且其值是坐标,再 coordinateSystem: ‘geo’ ,就可以实现了
2.关于symbol使用Function时控制台提示symbolType.indexOf is not a function
在官方文档中写到,
在series[i].scatter.symbol 后面明明是可以跟函数的。根据我的业务要求是,要求根据数据的情况来变化symbol的样式。如果在这里写个函数的更改的话,似乎是个很好的设置,可是我真正咋这里写上函数,却会报错:
不管后面是什么写法(如下两图),或是直接return,都会同样的报错
去github上查了原因,由于版本问题嘛,网上提的回答需要修改js文件,想了想有没有简单的办法来解决这个问题呢?
我发现data里面也有symbol这个属性
由于我在渠道数据的时候就遍历整理了数据,那就随便都加的symbol属性吧
这样就很好的解决了问题!(所以说,要多再看看,一定会有更简易的方式来解决)
初步的样式结果:
关于我以为的居中对齐和他实际不居中对齐的问题
我的业务要求是想要这样的效果
我右侧的布局是这样的
css如下:
我以为flex布局肯定很标准嘛,再加上我text-align:center 一定就没问题,肯定能居中,实际上的结果却是:
我愁死了,我想没有对齐的就是四个字的嘛,那我加个padding 让他左移一点就很好了噻,结果padding,margin均不生效。这个居中问题就把我愁住了,后来我突然想到,flex布局咋布的,他是根据计算总长减去所有元素的宽度,来计算的,由于我里面的span没有给固定宽度,所以他是根据span里面文字的长度来计算宽度,所以字多的span宽度长,字少也就少,所以我给span家里个宽度便解决了这个我以为能居中的问题。
(其实我之前也遇到过这个我以为居中实际不居中的问题,当时解决了但是没放在心上,也没有总结。。。所以多总结,哪怕多沙雕的问题都写下来,哭。。。)
关于数据渲染成功,但是控制台却报错undefined的问题
由于业务有点复杂,简单来说就是我点击切换后就发起请求获取数据,再往页面渲染数据。我就想写个函数用来获取数据嘛,然后将获取的数据渲染到页面就行了,可是切换到某个位置控制台就报错undefined,可是只看页面没发现哪里有问题,而且数据也是正确的。
这就是异步的问题,在数据回来之前我就渲染页面了,所以报错undefined了,报错后,异步数据又回来了,所以页面又是正常显示的。
解决:搞个变量,必须在数据回来后才渲染页面(每种业务写法可能有需求,我的只是一种)
这个viewIndex就是来作为标识渲染页面的
由于我存在viewIndex=0的情况,要多写一点 否则会viewIndex会被渲染为false,导致页面不显示。
暂时到这里 未完待续。。。。。。。
父组件取到查询数据再让子组件画图,子组件会有不同的数据维度切换
我本来想父组件取到数据,传给子组件,子组件就绘图就行了,可是得在monted里面执行函数
可是。monted一开始就要执行。。。。。。就可能没有查询之前他就画图了 。。。。。所以不行
换个思维:
在子组件写个函数来进行初始化(包括拿数据,整理数据,画图等),在父组件拿到数据之后调用执行子组件的函数就行,这样一定保证在查到数据之后再执行
换个思维就行了。。。。。。。。。。思维不要局限
关于地图画不上散点的问题
我在市级地图上画不上散点,而在省级地图上却能看见散点,我的图表对象的series里面也确实有一个map对象和一个scatter的对象。数据也是正确的
解决:注意地图数据是否正确,是否已转换成为经纬度的格式,否则就会发生这样的错误
关于echarts地图取消地图鼠标悬浮高亮的问题
需求是 不要地图高亮:
方法一:
嘻嘻嘻嘻嘻吧emphasis里面的样式设置跟normal一样,就可以没有高亮的效果了。嘻嘻嘻嘻不过还是不推荐。
方法二:
this.myChart.dispatchAction({
type: 'downplay'
})
这样就能取消掉了
关于标签图标更改后没有变化的问题
我是直接更改了index.html的中link的herf
<link rel="shortcut icon" type="image/x-icon" href="./static/img/favicon.ico">
结果却是 本地变化了,可是部署后就还是原来的图标
结局:我后来发现要把新图标的名字改成favicon.ico 才可以
关于公司老项目修改scss文件起作用的问题
由于新项目需要跟老项目对接,而客户觉得老项目需要修改一下,于是我便去修改老项目。以前的项目用了layui,而且没有前后端分离。
在我修改样式的时候,发现找到对应的scss文件进行修改后,却没有任何效果,清除浏览器缓存以及tomcat的缓存,都没有任何变化。后来突然想到scss是需要经过编译变成css才可以的。于是就去下载ruby以及给webstorm配置watcher。(教程不写,网上一搜很多)