发表于

机器学习的术语：

1.标签：标签指的是我们要对其作出预测的目标。比如说小麦的价格，鱼的种类
2.特征：特征是输入变量。我们通过特征来判断标签。比如判断一件东西是不是叶子。可以通过它的颜色，形状等等
3.样本：有标签样本&无标签样本
有标签样本：已明确表明为垃圾邮件的信件；使用有标签样本训练模型
无标签样本：使用无标签样本来检测模型的正确性
4.模型：通过上述方式，可以定义特征和标签之间的关系 这就是模型。它包括两个生命周期：训练和判断
回归模型：连续的。股票的价格
分离模型：离散的。
深入了解机器学习：
1.线性回归：Y = WX+b W是斜率。W和X可能有小下标，因为它有多个维度
2.误差：用方差来表示。 （标准值-预测值）^2 有时是(（标准值-预测值）^2 )/D
3经验风险最小化：使整体误差达到最小
4损失：损失即误差
减小误差的方法：
1.寻找一个合适的学习梯度，使其以更少的步数达到最低点。该学习梯度不能太大也不能太小。太大将造成永远无法到达最低点。太小造成步数过多
2.小批量梯度下降法：使用10-1000个样本
3.迭代方法
4.梯度下降法（凸型结构）：
1）起点并不重要，可选择0或随机值
2）梯度是偏导数的矢量，可以让我们了解到哪个方向离目标值更远或更近
5.学习速率
6.超参数：编程人员在机器学习算法中用于调整的旋钮；学习速率就是一个超参数

编程案例

根据加尼福利亚洲的数据，基于单个输入特征预测各城市街区的房屋中位数，通过调整模型的超参数提高模型准确率。

引入需要的包
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
from __future__ import print_function
import math
from IPython import display
#matplotlib——画图
from matplotlib import cm
from matplotlib import gridspec
from matplotlib import pyplot as plt
import numpy as np
#pandas——读取数据
import pandas as pd
from sklearn import metrics
import tensorflow as tf
from tensorflow.python.data import Dataset
tf.logging.set_verbosity(tf.logging.ERROR)
pd.options.display.max_rows = 10
pd.options.display.float_format = '{:.1f}'.format
加载数据集
1
california_housing_dataframe = pd.read_csv("G:/python/houseValue/california_housing_train.csv",sep=",")
处理数据和获取数据
1
2
3
4
5
6
7
8
9
10
#对数据进行随机排列
california_housing_dataframe = california_housing_dataframe.reindex(
        np.random.permutation(california_housing_dataframe.index))
california_housing_dataframe["median_house_value"] /= 1000.0
#使用房屋总数作为特征
my_feature = california_housing_dataframe[['total_rooms']]
feature_columns = [tf.feature_column.numeric_column("total_rooms")]
#使用房屋价格中位数作为标签
targets = california_housing_dataframe['median_house_value']
优化器
1
2
3
4
5
6
7
8
9
10
11
#tf.train.GradientDescentOptimizer——实现梯度下降算法的优化器
#Gradient Descent 梯度下降法，不断迭代调整参数，找到权重和偏差的最佳组合，将损失将到最低
my_optimizer=tf.train.GradientDescentOptimizer(learning_rate=0.0000001)
#设置梯度上限，防止其过大，造成梯度爆炸
my_optimizer = tf.contrib.estimator.clip_gradients_by_norm(my_optimizer, 5.0)
#LinearRegressor类用来训练一个线性回归模型，来预测该特征值对应的标签值
linear_regressor = tf.estimator.LinearRegressor(
    feature_columns=feature_columns,
    optimizer=my_optimizer
)
定义输入函数
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
def my_input_fn(features, targets, batch_size=1, shuffle=True, num_epochs=None):
    #把features变成一个字典形式为：“key":xxxx yyyyy zzzz... ，把它变成一个新的字典，后面的数据是被numpy变成数组形式
    features = {key:np.array(value) for key,value in dict(features).items()}
    # 创建了一个数据集
    ds = Dataset.from_tensor_slices((features,targets))
    # 将batch_size个元素组成batch；repeat的功能就是将整个序列重复多次
    ds = ds.batch(batch_size).repeat(num_epochs)
    
    # Shuffle：打乱数据
    if shuffle:
      ds = ds.shuffle(buffer_size=10000)
    
    # 返回下一个批次的数据；make_one_shot_iterator迭代器读取数据
    features, labels = ds.make_one_shot_iterator().get_next()
    return features, labels
训练模型
1
2
3
4
5
# my_input_fn存在return dataset.make_one_shot_iterator().get_next()；它将一批样本传回调用方（train方法)
 _ = linear_regressor.train(
    input_fn = lambda:my_input_fn(my_feature, targets),
    steps=100
)

发表于

cookie是浏览网页时，记录在计算机本地文件夹的一些资料。

基本语法

1.设置cookie
document.cookie=’名称=值’;

1
document.cookie='username=rexana';

2.设置cookie过期时间，默认是关闭浏览器时
expires=字符串时间

1
2
3
var oDate = new Date(); //获取当前时间
oDate.setDate(oDate.getDate()+5); //getDate()获取月份的第几号，+5表示5天后过期。setDate修改oDate的值。
document.cookie='age=18;expires='+oDate.toGTMString();//oDate.toGTMString()把oDate转换成字符串形式

3.信息编码
encodeURI(“信息”);

1
document.cookie='username='+encodeURI("REXANA")+';expires='+oDate.toGTMString();

4.信息解码
decodeURI(“信息”);
5.获取cookie

1
2
3
4
5
6
7
var arr = document.cookie.split("; ");  //分隔标志是一个分号加上一个空格，不能把空格遗漏
for(var i=0;i<arr.length;i++){
    var arr2 = arr[i].split("=");
    if(arr2[0] == 'age'){
        alert(decodeURI(arr2[1]));
    }
}

具体代码见：https://github.com/rexana3/drag 中的cookie.html文件

对代码进行封装

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
window.onload = function(){
    setCookie("user","rexana",5);
    getCookie("user");
    function setCookie(key,value,time){
        var oDate = new Date();
        oDate.setDate(oDate.getDate()+time);
        document.cookie=key+'='+value+';expires='+oDate.toGMTString();
    }
    function getCookie(key){
        var arr = document.cookie.split("; ");
        for(var i=0;i<arr.length;i++){
            var arr2 = arr[i].split("=");
            if(arr2[0] ==key){
                console.log(arr2[1]);
            }
        }
    }
}

具体代码见：https://github.com/rexana3/drag 中的cookie封装.html文件

cookie实例

通过cookie记住用户名
具体代码见：https://github.com/rexana3/drag 中的cookie实例.html文件

发表于

对鼠标滚轮事件的绑定

谷歌和IE浏览器： onmouseWheel
火狐浏览器： addEventListener() + DOMMouseScroll；使用前应先判断该事件是否存在

上下滚动的判断

谷歌和IE浏览器：上滚为正，下滚为负，事件名：wheelDelta ；使用前应先判断该事件是否存在
火狐浏览器： 上滚为负，下滚为正，事件名：detail；使用前应先判断该事件是否存在

禁止事件默认行为带来的默认事件

谷歌和IE浏览器 ：return false;
火狐浏览器： preventDefault;使用前应先判断该事件是否存在

通过鼠标滚轮改变div的高度

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
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>鼠标滚轮</title>
    </head>
    <style>
        #myDiv{
            width: 100px;
            height: 100px;
            background: #577909;
        }
        body{
            height: 2000px;
            /*会产生事件的默认行为*/
        }
    </style>
    <body>
        <div id="myDiv"></div>
    </body>
    <script>
        window.onload = function(){
            //获取元素
            var oDiv = document.getElementById('myDiv');
            
            //谷歌和IE，绑定鼠标滚轮事件
            oDiv.onmousewheel = fn;
            
            //火狐浏览器，绑定鼠标滚轮事件
            if(oDiv.addEventListener){
                oDiv.addEventListener('DOMMouseScroll',fn,false);
            }
            
            function fn(ev){
                var ev = ev ||event;
                var b = true;
                //判断是否存在该事件
                if(ev.wheelDelta){
                    //如果大于0，b=true，表示鼠标上滚，小于零，表示鼠标下滚
                    b = ev.wheelDelta > 0 ? true :false;
                }else{
                    //如果小于0，b=true，表示鼠标上滚，大于零，表示鼠标下滚
                    b = ev.detail < 0 ?true :false;
                }
                if(b){
                    //改变div的高度
                    this.style.height =this.offsetHeight + 10+"px"; 
                }else{
                    this.style.height = this.offsetHeight - 10 +"px";
                }
                //禁止默认行为
                //火狐
                if(ev.preventDefault){
                    ev.preventDefault();
                }
//              //谷歌
                return false;
            }
        }
    </script>
</html>

完整代码已上传至 https://github.com/rexana3/drag 文件名：鼠标滚轮.html

发表于

拖拽的应用

拖拽是一个很常用的功能，比如滚动条的拖拽，桌面图标的拖拽，以及一些小游戏上的应用。拖拽除了可以改变元素的位置，还可以改变元素的小大。下面记录拖拽功能的基本实现。

拖拽的原理

鼠标点击选中元素，鼠标移动，元素跟着移动，释放鼠标，元素不再移动。

改变位置的拖拽

元素大小已确定，改变元素的位置，可以改变margin值，也可以改变padding。不过常用的方法是给元素加一个绝对定位“position：absolute”，然后改变元素的top值和left值
1.定义一个元素,设置宽高

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
<style>
   .myDiv{
       position: absolute;  //这一句必须加上，否则无法用top和left进行定位
       top:200px;
       left:500px;
       width: 100px;
       height: 100px;
   }
</style>
<body>
   <div id="myDiv"></div>
</body>
<script>
window.onload = function(){
   var oDiv = document.getElementById('myDiv');  //获取我的DIV
   var divLeft = oDiv.offsetLeft; //得到此时div的left值
   var divTop = oDiv.offsetTop;//得到此时div的top值
}
</script>

2.点击时获取鼠标点击点的X值和Y值

1
2
3
4
5
6
7
8
oDiv.onmousedown = function(ev){
    var ev = ev||event;
    var x = ev.clientX; //获取点击点的x值
    var y = ev.clientY; //获取点击点的y值
    var disX = x - divLeft; //得到鼠标点击点与div左边缘的差值
    var disY = y - divTop;//得到鼠标点击点与div上边缘的差值
}

3.鼠标移动和释放

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
oDiv.onmousedown = function(ev){
    var ev = ev||event;
    var x = ev.clientX; //获取点击点的x值
    var y = ev.clientY; //获取点击点的y值
    var disX = x - divLeft; //得到鼠标点击点与div左边缘的差值
    var disY = y - divTop;//得到鼠标点击点与div上边缘的差值
    //此处应该为document.onmousemove,如果是oDiv.onmousemove会导致鼠标移动太快，div跟不上，而使得鼠标和div失去联系
    document.onmousemove = function(ev){
                var ev = ev || event;
                var newLeft = ev.clientX - disX;  //得到移动后div新的left值
                var newTop = ev.clientY - disX;  //得到移动后div新的top值
                oDiv.style.left = newLeft +"px";  //改变left值，一定要加上“px"
                oDiv.style.top= newTop +"px";//改变top值，一定要加上“px"
     }
     document.onmouseup = function(){
         document.onmousemove = document.onmouseup =null; //清空函数
    }
}

扩展

如果是改变div的大小的话，要分情况讨论
1.鼠标右移或下移
则增加width和height的值即可，无需改变top和left
2.鼠标左移或上移
两者均改变。
例如通过拖拽绘制方框就涉及到这两方面的考虑
具体代码可见：https://github.com/rexana3/drag

发表于

hexo new test

在博客的根目录下，点击鼠标右键，打开“git bash”，输入“hexo new 文章题目”
例如，输入 hexo new test，创建一篇题目为“test”的博客文章
例如：博主的本目录的地址是：E:\studydata\bolg
bolg下有public、source等文件夹。

打开test.md

新建的文件在E:\studydata\bolg\source\_posts下，使用sublime打开它

hexo clean

清除根目录中public 文件中的内容。如果不清除，当在本地修改旧文章的内容后，网站的内容没有改变。

hexo d -g

部署上传

hexo s -g

本地预览，地址为： http://localhost:4000/
按ctrl + c 结束预览