自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(12)
  • 收藏
  • 关注

原创 OpenLayers6学习笔记(四)—— 使用XYZ的方式加载高德地图

        OpenLayers提供ol.source.XYZ类来加载在线瓦片地图数据源,通常情况下,要加载不同的在线瓦片地图源,只需要更改ol.source.XYZ的参数url即可。高德在线瓦片地址:http://wprd0{1-4}.is.autonavi.com/appmaptile?x={x}&y={y}&z={z}&lang=zh_cn&size=1&scl=1&

2021-11-04 14:29:04 3913

原创 OpenLayers6学习笔记(三)—— 瓦片地图基础知识

一. 数据加载OpenLayers的地图数据通过图层(Layer)进行组织渲染,通过数据源(Source)设置具体的地图数据来源。Layer可以看作渲染地图的容器,具体的数据需要通过Source设置,Source和Layer是一对一的关系,有一个Source必然需要有一个Layer。地图数据根据数据源(Source)可分为Image、Tile、Vector三大类型的数据源,对应设置到地图图层(Layer)的Image、Tile、Vector三大类型的图层上,其中矢量图层Vector通过样式(Style

2021-11-04 09:42:27 2458

原创 OpenLayers6学习笔记(二)—— 地图控件

一. 控件简介归属控件(Attribution):展示地图资源的版权或归属,默认加入到地图中。全屏控件(FullScreen):控制地图全屏展示。坐标拾取控件(MousePosition):显示鼠标所在地图位置的坐标。鹰眼控件(OverviewMap):地图的一个概览图。比例尺控件(ScaleLine):地图比例尺。旋转控件(Rotate):控制地图旋转,默认加入到地图中,alt+shift+左键旋转地图。缩放控件(Zoom):控制地图缩放,默认加入到地图中。滑块缩放控件(ZoomSlid

2021-11-03 09:26:16 1964

原创 OpenLayers6学习笔记(一)—— 初始化一个地图

一. OpenLayers概述Map、Layer、Source和View是OpenLayers框架体系中的核心类,几乎所有的动作都围绕这几个核心类展开,以实现地图的加载与其相关操作。在OpenLayers的体系框架中:把整个地图看作一个容器(Map),核心为地图图层(Layer),每个图层有对应的数据源(Source),并且由地图视图(View)控制地图表现。地图容器上还支持一些与用户交互的控件(Control和Interaction),另外,OpenLayer还支持事件机制。二. 简单的地图展示

2021-11-02 10:59:01 883

原创 JS笔记——数据类型

一. 数据类型1.数据类型指的就是字面量的类型,在JS中一共有六种数据类型:String:字符串Number:数值Boolean:布尔值Null:空值Undefined:未定义Object:对象2.其中String、Number、Boolean、Null、Undefined属于基本数据类型,而Object属于引用数据类型3. String字符串在JS中字符串需要使用引号引起来2.使用双引号或单引号都可以,但是不要混着用3.引号不能嵌套,双引号中不能放双引号,单引号中不能放单引号

2020-08-24 16:18:18 81

原创 三列布局

一. 三列布局的要求两边固定,中间自适应中间列要完整显示中间列要优先加载二. 三列布局的实现圣杯布局<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Docume

2020-08-19 15:34:50 262

原创 CSS笔记——flex

一. flex简介flex是CSS中的又一种布局手段,主要用来代替浮动来完成页面的布局flex可以使元素具有弹性,让元素可以跟随页面的大小的改变而改变弹性容器(1) 要使用弹性盒,必须先将一个元素设置为弹性容器(2) 可以通过display来设置弹性容器①设置为块级弹性容器 —— display:flex②设置为行内的弹性容器 —— display:inline-flex弹性元素(1) 弹性容器的子元素是弹性元素(2) 一个元素可以同时是弹性容器和弹性元素...

2020-08-16 14:48:45 86

原创 CSS笔记——定位

一. 定位(position)定位就是将指定的元素摆放到页面的指定位置,通过定位可以任意的摆放元素通过position属性来设置元素的定位(1) static: 元素没有开启定位(默认值)(2) relative: 开启元素的相对定位(3) absolute: 开启元素的绝对定位(4) fixed: 开启元素的固定定位(也是绝对定位的一种)(5) sticky:开启元素的粘滞定位当开启了元素的定位(position属性值是一个非static的值)时,可以通过left、right、top、b

2020-08-07 09:01:58 146

原创 CSS笔记——浮动

一. 浮动块元素在文档流中默认垂直排列,如果希望块元素在页面中水平排列,可以通过float来使元素浮动,从而脱离文档流可选值:(1) none: 元素默认在文档流中排列(默认值)(2) left: 元素会立即脱离文档流,向页面的左侧浮动(3) right: 元素会立即脱离文档流,向页面的右侧浮动当为一个元素设置浮动以后(float属性是一个非none的值),水平布局的等式便不需要强制成立,元素会立即脱离文档流,不再占用文档流的位置。元素浮动以后,会尽量向页面的左上或右上漂浮,直到遇到父元素的边

2020-08-06 10:04:23 117

原创 CSS笔记——盒子模型

一. 盒子模型简介CSS将页面中的所有元素都设置成了一个矩形的盒子将元素设置为矩形的盒子后,对页面的布局就变成了将不同的盒子摆放到不同的位置每一个盒子都由以下几个部分组成:内容区(content)、内边距(padding)、边框(border)、外边距(margin)二. 内容区(content)使用width来设置盒子内容区的宽度使用height来设置盒子内容区的高度三. 边框(border)边框属于盒子的边缘,边框里边属于盒子的内容,出了边框都是盒子的外部要为一个元素设置边框

2020-08-04 19:55:14 336

原创 CSS笔记——选择器

一. 常用的选择器通配选择器作用:可以用来选中页面中的所有的元素.语法:*{}*{ background-color:skyblue;}元素选择器作用:通过元素选择器可以选择页面中的所有指定元素语法:标签名{}p{ background-color:skyblue;}id选择器作用:通过元素的id属性值选择唯一的一个元素语法:#id属性值{}#p1{ background-color:skyblue;}类选择器作用:通过元素的cla

2020-07-22 11:36:27 155

原创 HTML笔记——表单

<! DOCTYPE html><html> <head> <meta charset="UTF-8" /> <title>网页标题</title> </head> <body><!--1.表单用于将本地的数据提交给远程的服务器--><!--**form标签用来创建一个表单**1.form标签中必须指定一个action属性,该属性指向的是表单要提交的服务器地址--&

2020-07-17 10:18:25 89

空空如也

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除