JessicaLi的博客

我挑出了 6 款最优秀，数据最全，免费，稳定，各类场景均适合的天气 API，并且一个个测了一遍，我把测试过程，怎么接 API 等所有细节都写在文章里了，希望对你有帮助。本文详细讲解以下 6 个免费天气 API 的特点及接入方法高德天气 API -免费、 稳定、极简，适合天气预报基础需求 知心天气 API - 免费、轻便、专业，适合的天气预报初级需求 和风天气 API - 免费和付费同权限，非商业无限免费，含空气质量、天文气象 OpenWeather - 免费 100 万次/月 分钟级实时预

效果：type:'value', axisLabel:{/自定义刻度格式，大于10000的时候，显示格式为value/10000+万/ formatter:function(value){ var txt=[]; if(value>=10000){ txt.push(value/10000+'万'); }else{ txt.push(value); }; return txt; }}, axisPointer:{ show:fals.

legend: { itemHeight: 24, itemWidth: 24, data: [ { name: '修边比例', icon: 'rect', }, { name: '平均门幅', icon: 'rect', } .

formatter: function(params) {　　var result = ''　　params.forEach(function (item) {　　　　console.log(item)　　　　result += item.axisValue + "</br>" + item.marker + item.data　　})　　return result}效果：formatter: function(params) {　　var result = ''.

效果：只需要在tooltip里设置axisPointer即可axisPointer : { type : 'shadow', shadowStyle: { color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [ { offset: 0, color: 'rgba(0, 253, 255, 0.6)' }, { offset: 1, color: 'rgba(73, 201, 229, 0)' },

效果：import echarts from 'echarts'/** * 2. 拥堵路段--carJam.vue */var option_carJam = { title: { show: false }, tooltip: { trigger: 'axis', axisPointer: { type: 'shadow' }, textStyle: { // 设置提示框的对齐方式 align: 'left

效果：yAxis: [{ type: 'category', inverse: true, splitLine: { show: false }, axisTick: { show: false }, axisLine: { show: false }, axisLabel: {.

1、断开原因WebSocket断开的原因有很多，最好在WebSocket断开时，将错误打印出来。ws.onclose = function (e) { console.log('websocket 断开: ' + e.code + ' ' + e.reason + ' ' + e.wasClean) console.log(e)}错误状态码：WebSocket断开时，会触发CloseEvent, CloseEvent会在连接关闭时发送给使用 WebSockets 的客户端. 它在

路径http://yaoxin.test.jidecai.com:10080/h/rule/ranger.html效果图传参前边的URL：window.location.origin（可用来动态获取接口）"http://yaoxin.test.jidecai.com:10080"域名 + 端口：window.location.host"yaoxin.test.jidecai.com:10080"当前URL：window.location.href"http://yaoxin.

一，客户端的简单示例var ws = new WebSocket("wss://echo.websocket.org");ws.onopen = function(evt) { console.log("Connection open ..."); ws.send("Hello WebSockets!");};ws.onmessage = function(evt) { console.log( "Received Message: " + evt.data); ws.

WebSocket是一种网络通信协议，很多高级功能都需要它一，为什么需要 WebSocket？答案很简单，因为 HTTP 协议有一个缺陷：通信只能由客户端发起。举例来说，我们想了解今天的天气，只能是客户端向服务器发出请求，服务器返回查询结果。HTTP 协议做不到服务器主动向客户端推送信息。这种单向请求的特点，注定了如果服务器有连续的状态变化，客户端要获知就非常麻烦。我们只能使用"轮询"：每隔一段时候，就发出一个询问，了解服务器有没有新的信息。最典型的场景就是聊天室。轮询的效率低，非常浪.

学习js必不可少的知识点插入

本篇文章请大家先阅读阮一峰es6 let和const命令

一、效果图由于屏幕录制的原因吧。有点卡顿，实际项目不卡顿加载视频可能有点慢,可放大查看...二、开篇个人推荐可视化插件：很强大的阿里开源antv(G2、G6、F2、L7)系列，百度图表echarts和地图mapv,大屏装饰 DataV,D3.js、three.js 大屏数据可视化需求说难挺简单的，说简单挺难的；我认为选对可视化插件可以说成功了一半；不过选型期间往往挺废时间的，因为还要不断的测试看符不符合需求； 本文分享介绍我使用vue2.x开发大屏数据可视化需求的一些套...

<template> <div> <dv-scroll-board :config="config" style="margin-left:1rem;width:95%;height:48rem" /> </div></template><script>export default { props:['AreaData'], data(){ return { confi...

效果：思路：简述：将数字按数组存，比如原来数字是2655，转为数组就是[2,6,5,5],然后循环这个数组，每个数组又创建了1-9数字，再根据数组的值来移动数字的位置具体：我是用vue来写的，但实际上思路差不多的。1.原来的数字转为数组,用split('') realTime() { return `${this.realTimeNum}`.split('') || 0 },2.循环原来的四个数字，然后写好对应的样式，每个数组，对应生成竖着排序的0-9

timeFormate(timeStamp) { let year = new Date(timeStamp).getFullYear(); let month =new Date(timeStamp).getMonth() + 1 < 10? "0" + (new Date(timeStamp).getMonth() + 1): new Date(timeStamp).getMonth() + 1; ...

1，引入百度地图api//index.html中<script src="http://api.map.baidu.com/api?v=2.0&ak=你的ak值"></script>2，安装echartsnpm install echarts --save3,在需要创建地图的组件中引入如下import echarts from "echarts"; require("echarts/extension/b

如图，当我们切换左侧菜单展示效果的时候，右侧内容会对应变宽，但此时的echarts并不能执行自适应效果，这是因为切换菜单展示效果并没有触发window.onresize，所以为解决类似此问题，我们可使用element-resize-detector1、引入element-resize-detector，npm install element-resize-detector --save2、在对应位置上引入即可let elementResizeDetectorMaker = ..

为什么需要封装echarts每个开发者在制作图表时都需要从头到尾书写一遍完整的option配置，十分冗余 在同一个项目中，各类图表设计十分相似，甚至是相同，没必要一直做重复工作 可能有一些开发者忘记考虑echarts更新数据的特性，以及窗口缩放时的适应问题。这样导致数据更新了echarts视图却没有更新，窗口缩放引起echarts图形变形问题我希望这个echarts组件能设计成什么样业务数据和样式配置数据分离，我只需要传入业务数据就行了 它的大小要完全由使用者决定 不会因为缩放出现变形问题