Sun‘刺眼的博客
Sun‘刺眼的博客

利用Canvas实现360度浏览

前言：最近几个月来到新公司，主要从事移动端方面的开发，有时候也挺忙挺累的，于是就好一段时间没写博客了。其实自己在这几个月里，自己对canvas以及createjs和egret都有了一定程度上的认识与掌握了，所以有挺多东西想总结一下的。趁着今天广州下雪的日子，就写点东西吧，先从简单的demo开始吧。因为自己在走HTML5游戏方向，所以最近都在做小游戏。后续会再写关于canvas和createjs的系列文章吧，毕竟国内的资料比较少。一旦爱上了canvas，我便逐渐嫌弃DOM了。

360度浏览效果

　　利用最简单的多张图片，让产品实现360旋转浏览效果。以往用DOM来实现图片或者背景更换，是挺方便也容易，但是在移动端上面尤其安卓系统，流畅度真让人堪忧。而且现在移动端基本上都支持canvas上下文2d，所以能用canvas实现的尽量避免使用DOM。当然，如果是数量或简单少的动画，还是用CSS3比较好。交互操作类的当下则非canvas莫属。

准备工作:

　　首先是素材问题，围绕商品的四周各拍几张图片，然后让设计师重新修一下图，最终分解成多张图片素材。多则三四十张，小则十几张，视情况而定。要说明的是，我这里用的只是替换图片的方法实现仿3D旋转，日后我会再写一个仅需几张图片的3D全景浏览效果。

　　如图所示（是不是很多，哈哈，简单的方法实现肯定要牺牲点什么的，下次再写另外的方法吧）：

利用Canvas实现360度浏览_第1张图片

HTML+CSS：

　　

复制代码 
 1 <!DOCTYPE html>
 2 <html>
 3     <head>
 4         <meta charset="UTF-8">
 5         <meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,minimum-scale=1.0,user-scalable=no" />
 6         <title>360度旋转浏览</title>
 7         <style type="text/css">
 8             *{
 9                 margin: 0;
10                 padding: 0;
11             }
12             body,html{
13                 width: 100%;
14                 height: 100%;
15                 overflow: hidden;
16             }
17             .loading{
18                 position: absolute;
19                 width: 100%;
20                 height: 100%;
21                 left: 0;
22                 top: 0;
23                 background-color: #888888;
24                 z-index: 10;
25             }
26             .loading img{
27                 position: relative;
28                 width: 32px;
29                 height: 32px;
30                 left: 50%;
31                 top: 50%;
32                 margin-left: -16px;
33                 margin-top: -16px;
34             }
35             canvas{
36                 width: 100%;
37                 height: 100%;
38                 z-index: 100;
39             }
40         </style>
41     </head>
42     <body>
43         <div class="loading">
44             <img src="img/loading.gif"/>
45         </div>
46         <canvas id="canvas" width="750" height="1254">你的浏览器太老啦，换浏览器啦！</canvas>
47         <script src="js/zepto.min.js"></script>
48     </body>
49 </html>
复制代码

JavaScript:

复制代码 
 1 var canvas = document.getElementById("canvas"),
 2                 DPR =  window.devicePixelRatio,//获取设备的物理像素比
 3                 viewW = window.innerWidth,
 4                 viewH = window.innerHeight,
 5                 cansW = viewW*DPR,//放大canvas
 6                 cansH = viewH*DPR,
 7                 ctx = canvas.getContext("2d"),
 8                 imgArr = [],//图片数组
 9                 curDeg = 1,//代表当前显示的图片下标
10                 imgTotal = 51,//图片总数
11                 imgRatio = (447/1000), //图片高宽比
12                 imgW = viewW*1.5,//图宽
13                 imgH = imgW*imgRatio;//图高
14                             
15             //重设canvas宽高
16                 //显示的宽高
17             canvas.style.width = cansW + "px";
18             canvas.style.height = cansH + "px";
19                 //画布宽高
20             canvas.width = cansW;
21             canvas.height = cansH;
22             //loading
23             $(function(){
24                 var baseURL = "img/",
25                     imgURL ="",
26                     imgObj = null,
27                     imgIndex = 1;
28                 //loading
29                 for(var i = 1;i <= imgTotal;i++){
30                     imgURL = baseURL + i + ".png";
31                     imgObj = new Image();
32                     imgObj.src = imgURL;
33                     //将所有图片对象压入一个数组,方便调用
34                     imgArr.push(imgObj);
35                     imgObj.onload = function(){
36                         imgIndex ++;
37                         if(imgIndex > 51){
38                             $(".loading").hide();
39                             //默认图
40                             drawImg(0);
41                         }
42                     }
43                 }
44                     //手指触摸起点
45                  var startPoint = 0,
46                      //滑动多长距离，这里取（canvas宽/图片总数的一半）
47                      //数值越大约灵敏
48                      distance = cansW/30;
49                 //开始
50                 $("#canvas").on({
51                     "touchstart":function(e){
52                         //记录起始触摸点
53                         startPoint = e.touches[0].clientX;
54                         //去掉默认事件，iPhone下可去除双击页面默认跳动(翻页)效果
55                         e.preventDefault();
56                     },
57                     "touchmove":function(e){
58                         var tempPoint = e.touches[0].clientX;
59                         //向右移动
60                         if((tempPoint - startPoint) > distance){
61                             drawImg(curDeg,"right");
62                             //符合距离条件移动后，将记录点设到手指最新位置
63                             startPoint = tempPoint;
64                         }else if((tempPoint - startPoint) < -distance){//左
65                             drawImg(curDeg,"left");
66                             startPoint = tempPoint;
67                         }
68                         //禁止移动页面
69                         e.preventDefault();
70                     }
71                 });
72             });
73             //绘图
74             //参数：图片对象下标，移动方向
75             function drawImg(n,type){
76                 if(type == "left"){
77                     if(curDeg > 0){
78                         curDeg--;
79                     }else{
80                         curDeg = 50;
81                     }    
82                 }else if(type == "right"){
83                     if(curDeg < 50){
84                         curDeg++;
85                     }else{
86                         curDeg = 0;
87                     }
88                 }
89                 ctx.clearRect(0,0,cansW,cansH);    
90                 //参数：图片对象，X偏移量，Y偏移量，图宽，图高
91                 ctx.drawImage(imgArr[n],-(imgW-viewW)*0.5,(viewH-imgH)*0.5,imgW,imgH);
92             }
复制代码

代码说明：

　　对于canvas，我还想说明的是，在移动端使用canvas画布，一定要记得处理DPR，DPR全称是DevicePixelRatio（设备像素比）。意思是设备上物理像素和设备独立像素(device-independent pixels (dips))的比例。也就是一个设备独立像素（可以理解为CSS中的1px）相当于多少个物理像素。假如DPR=2，那么CSS中的1px就相当于设备物理像素的2px。但是在Canvas绘图中，画布大小跟可视区域大小是不一样的。可视区域大小会根据DPR大小进行调整，但是画布大小并不会。例如DPR=2，我在retina屏中设置canvas的可视宽高等于画布宽高，那么画布里的1px会在retina屏上以2px展示，所以会导致模糊现象。

　　关于DPR和view的参考文章：移动前端开发之viewport的深入理解

　　所以为了解决模糊问题，我们需要根据DPR对画布宽高进行调整，让画布大小等于物理像素大小。也就是把canvas的宽高变成对应的物理像素大小，然后把真正需要显示的区域画在屏幕位置，其余的隐藏掉。如图所示：

利用Canvas实现360度浏览_第2张图片

　　另外，DPR通过window.devicePixelRatio即可获取，基于webkit的浏览器都支持，IE不支持。

　　再者，这里的滑动我使用了原生方法touchstart和touchmove触摸事件，通过记录手指起点以及终点的X轴坐标大小判断左右滑动。如果加入了zepto的TOUCH组件，则可以直接使用swipeLeft和swipeRight触发（拖动使用drag），从而改变相应的图片。

关于绘图：

　　使用drawImage()方法绘图，还要注意的是，一定要待图片完全加载后才能进行绘图，否则会报错。

DEMO地址：

　　360度浏览示例

　　请使用移动设备或者谷歌浏览器的手机模式打开。

你可能感兴趣的:(利用Canvas实现360度浏览)

  • java文件分块上传,OkHttp文件上传（2）：实现文件分块上传 陈章玉 java文件分块上传
    前言分块上传和断点下载很像，就是讲文件分为多份来传输，从而实现暂停和继续传输。区别是断点下载的进度保存在客户端，ey往是写入数据库，分块上传的进度保存在服务器，每次可以通过文件的md5请求服务器，来获取最新的上传偏移量。但是这样明显效率偏低，客户端可以把offSet保存在内存，每上传一块文件服务器返回下一次的offSet。只不过这个offSet不需要保存在数据库，每次app关闭在打开继续上传可以请
  • ARM：使用F103纯汇编点灯 一枝小雨 ARM内核arm开发汇编
    0上节ARM体系结构解析：PC寄存器机制、三级流水线与C/汇编交互全揭秘-CSDN博客1纯汇编点灯主要是通过汇编代码实现下图逻辑：汇编代码实现：PRESERVE8THUMB;VevtorTableMappedtoAddress0atResetAREARESET,DATA,READONLYEXPORT__Vectors__VectorsDCD0DCDReset_Handler;ResetHandle
  • 题解 | 牛客周赛 Round 49 DEF Java题解 han_xue_feng java
    面试又黄了反正不是什么喜欢的工作[牛泪]面试又黄了反正不是什么喜欢的工作2024秋招数据开发第一波面试题露出#字节##滴滴##大数据##面经##秋招#引流字节阿里巴巴腾讯百度美团美团后端暑期实习体验——实习的一天早上：8点半出门坐地铁，9点下地铁到惠新西街南口地铁站，出地铁站坐班车（这一点还是不错的），9点30深圳阿里实习day1领工牌mac，认工位mentor，配环境看文档，七点就润了。看各个文
  • 牛客周赛 Round 54 题解（A~E） TCaaaaa 算法图论c++
    牛客周赛Round54题解A清楚姐姐的糖葫芦思路解析:显然只需要数字符串的字符o的个数即可。时间复杂度:O(N)O(N)O(N)代码块:voidsolve(){strings;cin>>s;intc=0;for(autov:s){c+=v=='o';}cout>a>>b>>x;llres1=x*a;llv=(x+2)/3*b;res1=min(res1,v);res1=min(res1,x/3*b
  • 基于Python的大学生思想政治教育平台mysql(Django Flask Vue Pycharm ) QQ_188083800 pythonmysqldjango
    文章目录具体实现截图项目技术介绍研究方案源码获取详细视频演示：文章底部获取博主联系方式！！！！系统设计核心代码部分展示django项目示例源码/演示视频获取方式具体实现截图项目技术介绍我国主流校园使用的是传统开发基于Java语言通过SpringBoot框架开发管理系统，开发周期长，开发人员学习成本高。使用如Django或Flask开发框架可以大量的减少开发者需要写的代码量，使开发人员可以最少的代码
  • libilibi项目优化（1）使用Redis实现缓存 Nijika... libilibi项目优化缓存redis数据库java后端spring
    第一版获取视频信息使用旁路缓存当视频信息存在缓存中时（命中），直接从缓存中获取。不存在缓存中时，先从数据库中查出对应的信息，写入缓存后再放回数据。//获取视频详细信息@RequestMapping("/getVideoInfo")publicResponseVOgetVideoInfo(@NotEmptyStringvideoId){//旁路缓存模式，先从缓存中拿VideoInfovideoInf
  • Spring Boot中Bean的 构造器注入、字段注入和方法注入 Nijika... springspringjava后端
    在Spring中，依赖注入（DI）是实现控制反转（IoC）的一种方式，Spring提供了多种注入方式来将依赖关系注入到Bean中，常见的方式有构造器注入、字段注入和方法注入。下面将详细介绍这三种注入方式。1.构造器注入（ConstructorInjection）构造器注入是通过构造函数将依赖项注入到SpringBean中。Spring容器会在创建Bean时，通过调用构造方法来注入依赖。特点：适用于
  • Python 视频爬取教程 小白教程 pythonPythonPython视频爬取教程Python视频爬取Python教程Python视频教程
    文章目录前言基本原理环境准备Python安装选择Python开发环境安装必要库示例1：爬取简单直链视频示例2：爬取基于HTML5的视频（以某简单视频网站为例）前言以下是一个较为完整的Python视频爬取教程，包含基本原理、不同网站的爬取示例以及注意事项。基本原理视频爬取本质上是模拟浏览器向服务器发送请求，获取包含视频信息的网页内容，解析出视频的真实下载地址，然后将视频文件下载到本地。一般会用到re
  • MySQL实现全量同步和增量同步到SQL Server或其他关系型库 大博士.J mysqladb数据仓库python人工智能
    在将MySQL中的两张表同步到SQLServer的过程中，全量同步和增量同步各有其优缺点。全量同步简单直接但可能耗时较长且资源消耗大，而增量同步则更加高效但需要额外的逻辑来处理数据的变更。以下是对这两种同步方式的详细解释及代码示例的完善。完整代码示例以下是一个完整的示例，包括全量同步和增量同步，以及使用schedule库来设置定时任务。importpymysqlimportpyodbcfromda
  • 从 0 到 1 掌握鸿蒙 AudioRenderer 音频渲染：我的自学笔记与踩坑实录（API 14） 李游Leo harmonyos-nextharmonyos鸿蒙音视频笔记
    最近我在研究HarmonyOS音频开发。在音视频领域，鸿蒙的AudioKit框架提供了AVPlayer和AudioRenderer两种方案。AVPlayer适合快速实现播放功能，而AudioRenderer允许更底层的音频处理，适合定制化需求。本文将以一个开发者的自学视角，详细记录使用AudioRenderer开发音频播放功能的完整过程，包含代码实现、状态管理、最佳实践及踩坑总结。一、环境准备与核
  • Search after解决ES深度分页问题 Elastic开源社区 elasticsearch大数据searchafter深度分页ES
    文章目录1、search_after的作用和意义2、search_after的工作原理3、search_after的使用方法4、注意事项5、与传统分页的对比6、总结search_after是Elasticsearch中用于实现深度分页的一种机制。相比于传统的from和size分页方式，search_after更适合处理大数据集的分页查询，因为它避免了深度分页带来的性能问题。1、search_aft
  • 基于SSM的旅游论坛设计与实现 「已注销」 java项目毕设旅游servletspringmavenspringcloudspringbootlog4j
    目录摘要ABSTRACT1绪论1.1课题背景1.2研究现状1.3研究内容2系统开发环境2.1vue技术2.2JAVA技术2.3MYSQL数据库2.4B/S结构2.5SSM框架技术3系统分析3.1可行性分析3.1.1技术可行性3.1.2操作可行性3.1.3经济可行性3.1.4法律可行性3.2系统性能分析3.3系统功能分析3.3.1角色需求3.3.2功能需求3.4系统流程分析3.4.1注册流程3.4.
  • 用python制作抢票脚本  笔记python
    本片文章给大家介绍如何使用python，仅供参考学习，不能用于其他活动，遵守社会法律法规，标题：使用Python编写抢票脚本**摘要：本文旨在介绍如何使用Python编写一个高效的抢票脚本，以帮助用户在抢票高峰期自动化购票过程，提高成功率。我们将深入讨论抢票脚本的实现原理、关键技术和实际应用场景。简介：在现代社会，随着交通网络的日益完善和人们生活水平的提高，出行已成为人们日常生活中不可或缺的一部分
  • Windows 图形显示驱动开发-WDDM 3.0功能- IOMMU DMA 重新映射（一） 程序员王马 windows图形显示驱动开发驱动开发
    概述直到WDDM3.0，Dxgkrnl仅支持通过1:1物理重新映射实现IOMMU隔离，这意味着GPU访问的逻辑页被转换为相同的物理页码。IOMMUDMA重新映射允许GPU通过不再以1:1映射的逻辑地址访问内存。相反，Dxgkrnl能够提供逻辑上连续的地址范围。Dxgkrnl对GPU施加限制：GPU必须能够访问所有物理内存才能启动设备。如果GPU的最高可见地址不超过系统上安装的最高物理地址，则Dxg
  • Windows 图形显示驱动开发-WDDM 3.0功能- D3D12 视频编码（二） 程序员王马 windows图形显示驱动开发驱动开发
    D3D12视频编码回调函数驱动程序实现以下回调函数以支持D3D12视频编码。创建表示视频编码器的驱动程序对象：PFND3D12DDI_CALCPRIVATEVIDEOENCODERSIZE_0082_0会计算D3D运行时需要为驱动程序对象分配的内存量。PFND3D12DDI_CREATEVIDEOENCODER_0082_0创建保存视频编码会话状态的实际视频编码器对象。创建表示视频编码器堆的驱动程
  • [利用RAG和Elasticsearch打造智能检索系统：详解实现过程] afTFODguAKBF elasticsearchjenkins大数据python
    引言在信息爆炸的时代，如何高效地从海量数据中提取有用信息成为了一个重要课题。通过结合RAG（Retrieval-AugmentedGeneration）和Elasticsearch，一种强大的信息检索和生成系统可以被实现。本文将详细介绍如何利用RAG和Elasticsearch打造一个智能检索系统。主要内容1.环境设置首先，我们需要设置必要的环境变量来访问Elasticsearch实例和OpenA
  • Python搭建静态web服务器 7 号 Pythonpython
    Python内置的web静态服务器Python内置的`http.server`模块可以快速启动一个简单的HTTP服务器。在Python3中，打开命令行或终端，在你想要作为静态服务器根目录的文件夹下，运行以下命令：python-mhttp.server8000这将会在当前目录启动一个HTTP服务器，监听端口8000，端口可以随意指定。你可以在浏览器中访问`http://localhost:8000`
  • auto.js_事件与监听-events(主要的)_ZHOU125disorder_ zjing125 #auto.js基础学习auto.js事件与监听
    启用按键监听events.observeKey()启用按键监听，例如音量键、Home键。按键监听使用无障碍服务实现，如果无障碍服务未启用会抛出异常并提示开启。只有这个函数成功执行后,onKeyDown,onKeyUp等按键事件的监听才有效。该函数在安卓4.3以上才能使用。注册一个按键监听函数events.onKeyDown(keyName,listener)keyName：要监听的按键名称list
  • 万字干货分享最新AI指南：用LazyLLM把Deep Research做成赛博屠龙刀！ 大模型人工智能llm
    最近OpenAI、Jina、perplexity等各大厂商纷纷推出了自家的DeepResearch应用。Deepresearch是什么？为什么这个应用引起了大家的关注？能不能使用lazyllm搭建一个属于自己的deepresearch？带着这些问题，本文将对OpenAI发布的DeepResearch进行简要介绍，并依托于lazyllm强大的能力，使用极少代码量实现一个自己的deepresearch
  • 从混乱到高效：企业如何利用CMDB优化资产管理与战略决策 运维
    在数字化转型加速的今天，企业在面对海量且日益复杂的IT资产和系统配置时，往往会出现数据混乱、信息孤岛和决策盲区等问题。对于许多企业来说，如何从混乱中抽丝剥茧，实现有效管理和科学决策，已成为一个亟待解决的问题。配置管理数据库（CMDB）就是在这样的背景下应运而生的，它为企业搭建了一个统一、权威的资产和配置管理平台，帮助企业优化运营、降低风险、提高战略决策水平。如果您的企业拥有庞大而复杂的IT环境，需
  • 扫盲系列--Web3智能合约+Solidity简介 「已注销」 前端框架
    前言这几天web3智能合约这个概念，频繁映入我的眼帘。web3.0这个概念我听说过，核心特征是去中心化、开放性、隐私保护和数据所有权回归个人。Web1.0是信息浏览时代，Web2.0是用户参与和社交网络时代，Web3.0是去中心化与智能化时代。在Web3.0这一新的互联网架构下，用户不再仅仅是内容的消费者，更是自己数字身份和数据的拥有者。Web3.0旨在构建一个更加透明、安全且高效的信息网络。我对
  • 如何使用 Python 实现简单的 Web 服务器？ 程序员黄同学 Python面试题Pythonpython
    为了实现一个简单的Web服务器，Python提供了多种方法。对于快速原型设计和学习目的来说，最简单的方法之一是使用内置的http.server模块。然而，在实际开发中，更常见的做法是使用像Flask或Django这样的框架来构建更为复杂的应用程序。下面我将介绍如何用Python创建一个基本的Web服务器，并提供一些实用建议和注意事项。我们将从最基础的开始，然后逐步深入到更复杂的场景。使用http.
  • 使用独立Ironpython 脚本运行Ansys electronics进行建模（二）————脚本自动打开项目并自动运行 加点油。。。。 Ironpython电机建模python自动化
    参考文档官方文档——Maxwellhelp—2022R1官方文档——MaxwellScriptingGuide代码实现功能通过Pycharm运行脚本，来自动打开已有程序，进行运行importsyssys.path.append(r"F:\ProgramFiles\AnsysEM\v221\Win64")sys.path.append(r"F:\ProgramFiles\AnsysEM\v221\W
  • SSL/TLS 和 SSH 区别 张紫娃 网络编程sslssh网络
    SSL/TLS干啥的？：SSL（SecureSocketsLayer）和TLS（TransportLayerSecurity）是一种用于在网络通信中提供安全性的协议。它们的主要目的是在客户端（如浏览器）和服务器之间建立加密连接，确保数据传输的安全性和隐私性。SSL是由Netscape开发的一种早期的安全协议，TLS是SSL的继任者，修复了SSL中的许多安全漏洞。提供了更安全和高效的通信机制。SSL
  • 从零到一揭秘微信小程序标签切换：tab-item、data-tab 和 bindtap 的奇妙冒险 小丁学Java 微信小程序WxMa微信小程序小程序bindtap
    从零到一揭秘微信小程序标签切换：tab-item、data-tab和bindtap的奇妙冒险作者：你的奇妙缘分日期：2025年3月12日标签：微信小程序、WXML、WXSS、JS、前端开发在微信小程序的开发世界里，标签切换（TabSwitching）是一个常见的交互场景。无论是电商列表、任务管理，还是本文中的“比对进程”页面，如何优雅地实现选项卡切换？答案藏在tab-item、data-tab和b
  • java实现XZordering算法（附带源码） Katie。 Java实战项目java算法开发语言
    Java实现XZOrdering算法详解目录项目背景与简介1.1项目概述1.2开发动机与应用场景1.3XZOrdering算法简介相关理论知识与数学基础2.1空间映射与局部性保持2.2Morton编码（Z-order）的原理2.3位交叉（BitInterleaving）技术2.4算法复杂度与性能考量系统架构与模块设计3.1整体架构设计3.2主要模块划分3.3类图与流程图项目实现思路与详细设计4.1
  • 网络协议与安全：WebSocket/WebRTC(2) 双囍菜菜 前端随记网络协议安全websocket
    前端实时通信双雄：WebSocket与WebRTC的生存实战指南文章目录前端实时通信双雄：WebSocket与WebRTC的生存实战指南一、当HTTP遇到实时场景：在线课堂的卡顿之痛二、WebSocket：双向通信的热线电话2.1协议握手过程解析2.2React实时聊天实现2.3Vue股票行情展示三、WebRTC：点对点直连的终极方案3.1核心架构三要素3.2视频会议实现（React版）3.3文件
  • 利用Excel和ArcGIS，依靠起点和终点经纬度生成河流矢量数据 YUANXLLL 笔记ArcGISarcgis经验分享
    任务需求：已有相关项目的excel表格数据，包含项目名称、内容以及河流起点和终点的经纬度信息（度分秒格式），根据起点和终点经纬度将对应项目的河流连成直线，并在arcgis中导入至地理数据库中。1、在excel中将度分秒格式的经纬度表示法转换为十进制并保存（每行都包含起点和终点经纬度）转换前：转换后：转换公式：注意公式在“分'”为一位数字时会报错，需要在前面补0。=LEFT(N9,FIND("°",
  • ubuntu双网卡连接不同网络 周陽讀書 个人经验可供分享Ubuntuubuntu网络服务器
    在ubuntu系统中插入ubs无线网卡构成双网卡设备，设想一个连外网一个连局域网。原本以为装上ubs网卡驱动即可，双网卡连接后发现不能上网，遂研究之。0前言接上一篇文章CF-955AX无线网卡LINUX驱动安装问题及解决我以为装好驱动就能实现双网卡上网，结果发现在ubuntu下还需要配置，网络是薄弱项，多亏学习交流群网友指点。1网卡信息查询参考连接：1.查看网卡信息：ifconfig命令及详细介绍
  • 【Conda与Pip的完美融合】在Conda环境中优雅使用pip指南 2401_85702623 condapippython
    标题：【Conda与Pip的完美融合】在Conda环境中优雅使用pip指南Conda是一个强大的包管理器和环境管理器，广泛用于Python社区，尤其是在数据科学和机器学习领域。尽管Conda本身可以处理大多数包的安装和管理，但有时我们可能仍需使用pip来安装特定的Python包。本文将详细解释如何在Conda环境中使用pip，包括配置、安装包、环境管理等，确保您可以充分利用这两个工具的优势。1.C
  • jQuery 跨域访问的三种方式 No 'Access-Control-Allow-Origin' header is present on the reque qiaolevip 每天进步一点点学习永无止境跨域众观千象
    XMLHttpRequest cannot load http://v.xxx.com. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:63342' is therefore not allowed access. test.html:1
  • mysql 分区查询优化 annan211 java分区优化mysql
    分区查询优化 引入分区可以给查询带来一定的优势，但同时也会引入一些bug. 分区最大的优点就是优化器可以根据分区函数来过滤掉一些分区，通过分区过滤可以让查询扫描更少的数据。 所以，对于访问分区表来说，很重要的一点是要在where 条件中带入分区，让优化器过滤掉无需访问的分区。 可以通过查看explain执行计划，是否携带 partitions
  • MYSQL存储过程中使用游标 chicony Mysql存储过程
    DELIMITER $$ DROP PROCEDURE IF EXISTS getUserInfo $$ CREATE PROCEDURE getUserInfo(in date_day datetime)-- -- 实例-- 存储过程名为：getUserInfo-- 参数为：date_day日期格式:2008-03-08--    BEGINdecla
  • mysql 和 sqlite 区别 Array_06 sqlite
    转载： http://www.cnblogs.com/ygm900/p/3460663.html mysql 和 sqlite 区别 SQLITE是单机数据库。功能简约，小型化，追求最大磁盘效率 MYSQL是完善的服务器数据库。功能全面，综合化，追求最大并发效率 MYSQL、Sybase、Oracle等这些都是试用于服务器数据量大功能多需要安装，例如网站访问量比较大的。而sq
  • pinyin4j使用 oloz pinyin4j
    首先需要pinyin4j的jar包支持；jar包已上传至附件内 方法一:把汉字转换为拼音；例如：编程转换后则为biancheng      /** * 将汉字转换为全拼 * @param src 你的需要转换的汉字 * @param isUPPERCASE 是否转换为大写的拼音； true:转换为大写；fal
  • 微博发送私信 随意而生 微博
    在前面文章中说了如和获取登陆时候所需要的cookie，现在只要拿到最后登陆所需要的cookie，然后抓包分析一下微博私信发送界面 http://weibo.com/message/history?uid=****&name=**** 可以发现其发送提交的Post请求和其中的数据， 让后用程序模拟发送POST请求中的数据，带着cookie发送到私信的接入口，就可以实现发私信的功能了。
  • jsp 香水浓 jsp
    JSP初始化     容器载入JSP文件后，它会在为请求提供任何服务前调用jspInit()方法。如果您需要执行自定义的JSP初始化任务，复写jspInit()方法就行了 JSP执行     这一阶段描述了JSP生命周期中一切与请求相关的交互行为，直到被销毁。     当JSP网页完成初始化后
  • 在 Windows 上安装 SVN Subversion 服务端 AdyZhang SVN
    在 Windows 上安装 SVN Subversion 服务端2009-09-16高宏伟哈尔滨市道里区通达街291号   最佳阅读效果请访问原地址：http://blog.donews.com/dukejoe/archive/2009/09/16/1560917.aspx   现在的Subversion已经足够稳定，而且已经进入了它的黄金时段。我们看到大量的项目都在使
  • android开发中如何使用 alertDialog从listView中删除数据？ aijuans android
    我现在使用listView展示了很多的配置信息，我现在想在点击其中一条的时候填出 alertDialog,点击确认后就删除该条数据，（ ArrayAdapter ，ArrayList，listView 全部删除），我知道在 下面的onItemLongClick 方法中 参数 arg2  是选中的序号，但是我不知道如何继续处理下去 1 2 3
  • jdk-6u26-linux-x64.bin 安装 baalwolf linux
    1.上传安装文件(jdk-6u26-linux-x64.bin) 2.修改权限 [root@localhost ~]# ls -l /usr/local/jdk-6u26-linux-x64.bin 3.执行安装文件 [root@localhost ~]# cd /usr/local [root@localhost local]# ./jdk-6u26-linux-x64.bin&nbs
  • MongoDB经典面试题集锦 BigBird2012 mongodb
    1.什么是NoSQL数据库？NoSQL和RDBMS有什么区别？在哪些情况下使用和不使用NoSQL数据库？ NoSQL是非关系型数据库，NoSQL = Not Only SQL。 关系型数据库采用的结构化的数据，NoSQL采用的是键值对的方式存储数据。 在处理非结构化/半结构化的大数据时；在水平方向上进行扩展时；随时应对动态增加的数据项时可以优先考虑使用NoSQL数据库。 在考虑数据库的成熟
  • JavaScript异步编程Promise模式的6个特性 bijian1013 JavaScriptPromise
            Promise是一个非常有价值的构造器，能够帮助你避免使用镶套匿名方法，而使用更具有可读性的方式组装异步代码。这里我们将介绍6个最简单的特性。         在我们开始正式介绍之前，我们想看看Javascript Promise的样子： var p = new Promise(function(r
  • [Zookeeper学习笔记之八]Zookeeper源代码分析之Zookeeper.ZKWatchManager bit1129 zookeeper
    ClientWatchManager接口 //接口的唯一方法materialize用于确定那些Watcher需要被通知 //确定Watcher需要三方面的因素1.事件状态 2.事件类型 3.znode的path public interface ClientWatchManager { /** * Return a set of watchers that should
  • 【Scala十五】Scala核心九：隐式转换之二 bit1129 scala
    隐式转换存在的必要性，   在Java Swing中，按钮点击事件的处理，转换为Scala的的写法如下：   val button = new JButton button.addActionListener( new ActionListener { def actionPerformed(event: ActionEvent) {
  • Android JSON数据的解析与封装小Demo ronin47
    转自：http://www.open-open.com/lib/view/open1420529336406.html package com.example.jsondemo; import org.json.JSONArray; import org.json.JSONException; import org.json.JSONObject;    impor
  • [设计]字体创意设计方法谈 brotherlamp UIui自学ui视频ui教程ui资料
      从古至今，文字在我们的生活中是必不可少的事物，我们不能想象没有文字的世界将会是怎样。在平面设计中，UI设计师在文字上所花的心思和功夫最多，因为文字能直观地表达UI设计师所的意念。在文字上的创造设计，直接反映出平面作品的主题。 如设计一幅戴尔笔记本电脑的广告海报，假设海报上没有出现“戴尔”两个文字，即使放上所有戴尔笔记本电脑的图片都不能让人们得知这些电脑是什么品牌。只要写上“戴尔笔
  • 单调队列-用一个长度为k的窗在整数数列上移动，求窗里面所包含的数的最大值 bylijinnan java算法面试题
    import java.util.LinkedList; /* 单调队列 滑动窗口 单调队列是这样的一个队列：队列里面的元素是有序的，是递增或者递减 题目：给定一个长度为N的整数数列a(i),i=0,1,...,N-1和窗长度k. 要求：f(i) = max{a(i-k+1),a(i-k+2),..., a(i)},i = 0,1,...,N-1 问题的另一种描述就
  • struts2处理一个form多个submit chiangfai struts2
    web应用中，为完成不同工作，一个jsp的form标签可能有多个submit。如下代码： <s:form action="submit" method="post" namespace="/my"> <s:textfield name="msg" label="叙述：">
  • shell查找上个月，陷阱及野路子 chenchao051 shell
    date -d "-1 month" +%F     以上这段代码，假如在2012/10/31执行，结果并不会出现你预计的9月份，而是会出现八月份，原因是10月份有31天，9月份30天，所以-1 month在10月份看来要减去31天，所以直接到了8月31日这天，这不靠谱。     野路子解决：假设当天日期大于15号
  • mysql导出数据中文乱码问题 daizj mysql中文乱码导数据
    解决mysql导入导出数据乱码问题方法： １、进入mysql，通过如下命令查看数据库编码方式： mysql>  show variables like 'character_set_%'; +--------------------------+----------------------------------------+ | Variable_name&nbs
  • SAE部署Smarty出现：Uncaught exception 'SmartyException' with message 'unable to write dcj3sjt126com PHPsmartysae
      对于SAE出现的问题：Uncaught exception 'SmartyException' with message 'unable to write file...。 官方给出了详细的FAQ：http://sae.sina.com.cn/?m=faqs&catId=11#show_213 解决方案为：   01 $path 
  • 《教父》系列台词 dcj3sjt126com
    Your love is also your weak point. 你的所爱同时也是你的弱点。   If anything in this life is certain, if history has taught us anything, it is that you can kill anyone.   不顾家的人永远不可能成为一个真正的男人。 &
  • mongodb安装与使用 dyy_gusi mongo
    一.MongoDB安装和启动,widndows和linux基本相同 1.下载数据库,     linux:mongodb-linux-x86_64-ubuntu1404-3.0.3.tgz 2.解压文件,并且放置到合适的位置     tar -vxf mongodb-linux-x86_64-ubun
  • Git排除目录 geeksun git
    在Git的版本控制中，可能有些文件是不需要加入控制的，那我们在提交代码时就需要忽略这些文件，下面讲讲应该怎么给Git配置一些忽略规则。   有三种方法可以忽略掉这些文件，这三种方法都能达到目的，只不过适用情景不一样。 1.  针对单一工程排除文件 这种方式会让这个工程的所有修改者在克隆代码的同时，也能克隆到过滤规则，而不用自己再写一份，这就能保证所有修改者应用的都是同一
  • Ubuntu 创建开机自启动脚本的方法 hongtoushizi ubuntu
    转载自： http://rongjih.blog.163.com/blog/static/33574461201111504843245/ Ubuntu 创建开机自启动脚本的步骤如下： 1) 将你的启动脚本复制到 /etc/init.d目录下 以下假设你的脚本文件名为 test。   2) 设置脚本文件的权限 $ sudo chmod 755
  • 第八章 流量复制/AB测试/协程 jinnianshilongnian nginxluacoroutine
    流量复制 在实际开发中经常涉及到项目的升级，而该升级不能简单的上线就完事了，需要验证该升级是否兼容老的上线，因此可能需要并行运行两个项目一段时间进行数据比对和校验，待没问题后再进行上线。这其实就需要进行流量复制，把流量复制到其他服务器上，一种方式是使用如tcpcopy引流；另外我们还可以使用nginx的HttpLuaModule模块中的ngx.location.capture_multi进行并发
  • 电商系统商品表设计 lkl
    DROP TABLE IF EXISTS `category`; -- 类目表 /*!40101 SET @saved_cs_client = @@character_set_client */; /*!40101 SET character_set_client = utf8 */; CREATE TABLE `category` ( `id` int(11) NOT NUL
  • 修改phpMyAdmin导入SQL文件的大小限制 pda158 sqlmysql
    　用phpMyAdmin导入mysql数据库时，我的10M的 数据库不能导入，提示mysql数据库最大只能导入2M。 　　 phpMyAdmin数据库导入出错： 　　You probably tried to upload too large file. Please refer to documentation for ways to workaround this limit.
  • Tomcat性能调优方案 Sobfist apachejvmtomcat应用服务器
    一、操作系统调优 对于操作系统优化来说，是尽可能的增大可使用的内存容量、提高CPU的频率，保证文件系统的读写速率等。经过压力测试验证，在并发连接很多的情况下，CPU的处理能力越强，系统运行速度越快。。 【适用场景】 任何项目。 二、Java虚拟机调优 应该选择SUN的JVM，在满足项目需要的前提下，尽量选用版本较高的JVM，一般来说高版本产品在速度和效率上比低版本会有改进。 J
  • SQLServer学习笔记 vipbooks 数据结构xml
    1、create database school 创建数据库school 2、drop database school 删除数据库school 3、use school 连接到school数据库，使其成为当前数据库 4、create table class(classID int primary key identity not null) 创建一个名为class的表，其有一
按字母分类： ABCDEFGHIJKLMNOPQRSTUVWXYZ其他