18211103738
18211103738

使用MorphAnimMesh实现ThreeJS动画

效果：
使用MorphAnimMesh实现ThreeJS动画
 

 

代码：

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8"/>
		<title>Morph-Bird</title>
		<style>body{background:#eeeeee;margin:0;padding:0;overflow:hidden;}</style>
		<script src="js/three.min.js"></script>
		<!--<script src="js/stats.min.js"></script>
		<script src="js/Detector.js"></script>-->
	</head>
	<body>
		<script>
		var morphs = [];
		var clock = new THREE.Clock();	//创建一个时针/秒表
		
		var width = window.innerWidth;
		var height = window.innerHeight;
		
		var scene = new THREE.Scene();
		
		var camera = new THREE.PerspectiveCamera( 40, width/2 / height, 1, 10000 );
		camera.position.y = 300;
		camera.target = new THREE.Vector3( 0, 150, 0 );
		//scene.add(camera);
		
		var loader = new THREE.JSONLoader();
		loader.load("models/animated/flamingo.js", function(geometry){
			morphColorsToFaceColors( geometry );
			geometry.computeMorphNormals();		//计算面的每一个法线（这样才能得到正确的关照效果）
			
			var material = new THREE.MeshLambertMaterial( { color: 0xffffff, morphTargets: true, morphNormals: true, vertexColors: THREE.FaceColors, shading: THREE.FlatShading } );
			/*MorphAnimMesh类是Mesh的扩展类，封装了对mesh.morphTargetInfluences的处理*/
			var morphAnimMesh = new THREE.MorphAnimMesh( geometry, material );	//动画网格模型（本质和Mesh一样，都表示一个可以显示的对象，所不同的是他包含几个动画帧，可以通过播放帧来看到动画）
			//morphAnimMesh.playAnimation();
			
			morphAnimMesh.duration = 1500;		//持续时间（单位ms）

			morphAnimMesh.scale.set( 1.5, 3.0, 1.5 );	//设置模型比例（放大了一些）
			morphAnimMesh.position.y = 150;		//设置位置（在y轴上）

			scene.add( morphAnimMesh );
			morphs.push( morphAnimMesh );
		});
		
		/*将geometry.morpColors中存储的颜色复制到geometry.faces信息中，因为绘制的时候会用到faces中的颜色*/
		function morphColorsToFaceColors( geometry ) {

			if ( geometry.morphColors && geometry.morphColors.length ) {

				var colorMap = geometry.morphColors[ 0 ];

				for ( var i = 0; i < colorMap.colors.length; i ++ ) {

					geometry.faces[ i ].color = colorMap.colors[ i ];
					geometry.faces[ i ].color.offsetHSL( 0, 0.3, 0 );	//模型的饱和度提高0.3

				}

			}

		}
		
		var upLight = new THREE.DirectionalLight(0xffffff, 1.3);
		upLight.position.set(1, 1, 1);
		scene.add(upLight);
		
		var downLight = new THREE.DirectionalLight(0xffffff, 0.1);
		//downLight.position.set(0.25, -1, 0);
		downLight.position.set(-1, -1, -1);
		scene.add(downLight);
		
		var renderer = new THREE.WebGLRenderer({antialias:true});
		renderer.setSize(width, height);
		renderer.setClearColor(0xeeeeee, 1.0);
		
		renderer.sortObjects = false;
		renderer.autoClear = false;

		renderer.gammaInput = true;
		renderer.gammaOutput = true;
		
		document.body.appendChild(renderer.domElement);
		
		var theta = 0;
		var delta = null;
		var radius = 600;
		function render() {

			theta += 0.1;	//每帧0.1度（如果1秒钟60帧，那么1秒钟就是6度）
			
			/*相机绕y轴以半径为600的圆旋转*/
			camera.position.x = radius * Math.sin( THREE.Math.degToRad( theta ) );
			camera.position.z = radius * Math.cos( THREE.Math.degToRad( theta ) );

			camera.lookAt( camera.target );		//相机聚焦于相机的焦点（一般为(0,0,0)）

			delta = clock.getDelta();		//得到距离上一次调用render()过去的时间（单位秒）
			
			for ( var i = 0; i < morphs.length; i ++ ) {
				morph = morphs[ i ];
				//console.log(i);		//永远是0
				morph.updateAnimation( 1000 * delta );		//更新动画的每一帧，并在其中渲染动画
			}		

			renderer.clear();		//清空渲染器

			renderer.setViewport( 0, 0, width, height ); //设置视口（等于窗口的位置和大小）
			renderer.render( scene, camera );
			
			requestAnimationFrame(render);
		}
		render();
		</script>
	</body>
</html>

 附注：笔者当前使用的three.js版本是r69

你可能感兴趣的:(WebGL,three.js)

  • 使用 WebP 优化 GPU 纹理占用 泫凝 javascript前端
    WebP格式相比JPEG/PNG文件更小，可以减少GPU纹理内存占用，提高WebGL/Three.js/3D渲染的性能。为什么WebP能减少GPU内存占用？文件更小→WebP比JPG/PNG压缩率更高，减少纹理上传带宽，提高渲染速度。支持透明度（RGBA）→比PNG更小，适用于UI贴图/透明纹理。减少Mipmaps体积→WebP生成的mipmap纹理占用的GPU内存更少。⚠️但WebP仍然是8-b
  • 指纹浏览器：隐私保护利器与技术实践指南——从身份隐匿到多账号管理的核心解析 Hotlogin 前端
    一、浏览器指纹：数字身份追踪的底层逻辑浏览器指纹通过收集设备参数（如Canvas渲染特征、字体列表、WebGL硬件信息等）生成用户唯一标识，无需Cookie即可实现精准追踪。根据EFF研究，其识别准确率可达90%以上。▶核心技术解析Canvas指纹：不同设备的抗锯齿算法差异生成唯一哈希值，成为主流追踪手段WebGL指纹：提取GPU驱动版本等硬件信息，构建设备画像环境参数交叉验证：时区、屏幕分辨率、
  • 《突破性能瓶颈，用 Rust + WASM 实现浏览器端FFT加速300%实战》 煜bart 人工智能机器人
    引言：当JavaScript遇上硬核计算**“为什么我的音频分析页面卡到崩溃？”这是前端工程师在实现实时频谱可视化时最常见的噩梦。传统JavaScript的FFT计算在万级数据点时就会引发严重卡顿，但今天我们将用**Rust+WebAssembly**的组合拳，在浏览器中实现**零依赖、300%加速的傅里叶变换**。无需WebGL黑魔法，直接上硬核代码！---###**一、血腥现场：JS的Type
  • 学习threejs，dds格式图片文件贴图 2301_81121233 学习贴图pythontornadoflaskscikit-learnplotly
    要在Three.js中使用DDS格式的图片文件作为贴图，你需要加载和解析该文件，并将其应用于你的模型或材质。首先，确保你已经引入了DDSLoader.js文件，它是Three.js的一个扩展插件，用于加载和解析DDS格式的图片文件。然后，创建一个新的DDSLoader实例，并使用它来加载DDS图片文件。varloader=newTHREE.DDSLoader();loader.load('path
  • Cesium：开源的三维地球可视化引擎 ZD1 信息可视化
    简介：Cesium是一款开源的三维地球可视化引擎，为开发者和用户提供了强大且易于使用的工具，用于创建令人惊叹的虚拟地球场景。它基于WebGL技术，能够在现代的Web浏览器上运行，并支持各种平台和设备。本文将详细介绍Cesium的特点和应用领域。特点：a.高性能：Cesium利用GPU加速和流式处理技术，能够处理大规模的地理数据，并实时渲染出逼真的三维地球场景。b.开放性：Cesium是一个开源项目
  • Cesium在三维模型中的应用 IT邦少 前端贴图
    Cesium在三维模型中的应用Cesium简介Cesium介绍Cesium是一个跨平台,跨浏览器的展示三维地球和地图的javascript库Cesium使用WebGL来进行硬件加速图形,使用时不需要任何插件支持,但是浏览器必须支持WebGLCesium是基于Apache2.0许可的开源程序,它可以免费的用于商业和非商业用途Cesium特点支持2D,2.5D,3D形式的地图展示可以绘制各种几何图形,
  • Cesium-三维地球可视化应用 程序员_三木 Web3dwebglThree.js
    什么是CesiumJS？CesiumJS是一个强大的开源JavaScript库，用于构建高性能的3D地图和地球可视化应用。无论你是从事地理信息系统（GIS）开发、数据可视化，还是需要展示空间数据，CesiumJS都能提供灵活的解决方案。它以WebGL为核心，专注于大规模地理空间数据的实时渲染。CesiumJS是Cesium平台的核心部分，与Cesiumion等服务无缝集成，支持从数据管理到可视化的
  • Three.js 阴影 (Shadow) 知识点整理 泫凝 javascriptthree.jsnpm前端
    阴影主要由castShadow和receiveShadow控制，并通过不同类型的光源(DirectionalLight、SpotLight、PointLight)生成。我们将系统地整理与阴影相关的知识点。1️⃣基础概念castShadow：物体是否投射阴影。receiveShadow️：物体是否接收阴影。renderer.shadowMap.enabled=true✅：全局开启阴影渲染。rende
  • 【前端拓展】Canvas性能革命！WebGPU + WebAssembly混合渲染方案深度解析 爱上大树的小猪 前端js
    为什么需要混合方案？真实场景痛点分析：传统WebGL在高频数据更新时存在CPU-GPU通信瓶颈JavaScript的垃圾回收机制导致渲染卡顿复杂物理模拟（如SPH流体）难以在单线程中实现技术选型对比：graphLRA[计算密集型任务]-->B[WebAssembly]C[图形渲染任务]-->D[WebGPU]B-->E[共享内存]D-->E️环境搭建全流程1.WebGPU环境配置#启用Chrome
  • webgl threejs 云渲染(服务器渲染、后端渲染)解决方案 allenjiao Threejswebglthreejs云渲染后端渲染服务器渲染云流化三维云渲染
    云渲染和流式传输共享三维模型场景1、本地无需高端GPU设备即可提供三维项目渲染云渲染和云流化媒体都可以让3D模型共享变得简单便捷。配备强大GPU的远程服务器早就可以处理密集的处理工作，而专有应用程序，用户也可以从任何个人设备查看全保真模型并与之交互。2、云流媒体实现多终端联动共享价值更高在项目应用场景中，在大屏、电脑、平板、手机和其它移动终端，可以实现多屏联动、远程协助，三维云流化让客户访问时可以
  • Python, Springboot 开发基于人类指令生成机器人3D可视化动态模型app Geeker-2025 pythonspringboot
    开发一个基于人类指令生成机器人3D可视化动态模型的APP是一个复杂且多层次的项目，涉及前端和后端的多个技术栈。以下是一个高层次的设计概述，涵盖主要的技术栈和功能模块，并提供使用Python和SpringBoot进行联合开发的示例。##技术栈概述###前端-**框架**：React.js或Vue.js（用于构建用户界面）-**3D可视化**：Three.js或React-Three-Fiber（用于
  • WebGPU 为什么会取代 WebGL，看看 WebGPU 都做了啥？ 贝格前端工场 webglUI设计大数据
    WebGPU被普遍认为是WebGL的继任者，并有望在未来逐步取代WebGL，这一趋势主要由以下技术、生态和行业因素推动，本文带着大家看WebGPU针对WebGL提升了啥，改进了啥。1.技术层面的必然性（1）硬件能力的演进需求现代GPU功能支持：WebGL基于OpenGLES（设计于2000年代初），无法利用现代GPU的并行计算、光线追踪、网格着色器等高级功能。WebGPU直接对接Vulkan/Me
  • 指纹浏览器与代理IP的协同技术解析：从匿名性到防关联实现 Hotlogin 火云指纹浏览器指纹浏览器tcp/ip网络协议网络
    一、技术背景与核心需求指纹浏览器通过模拟独立浏览器环境（包括User-Agent、Canvas指纹、WebGL参数等）实现多账号防关联，而代理IP通过隐藏真实IP地址提供网络匿名性。两者结合可解决以下技术痛点：双重身份隔离：单一指纹修改无法完全规避IP关联风险；动态环境模拟：代理IP支持地理位置切换，增强指纹浏览器模拟真实用户行为的能力；反检测能力提升：对抗网站基于IP黑名单或指纹追踪的风控策略。
  • 造价算量审图多元化融合软件开发实战：技术架构与核心代码解析 夏末之花 架构
    ——从BIM模型解析到AI智能审图的完整实现路径1.技术架构设计该软件需融合以下模块：BIM/CAD模型解析引擎（支持Revit/DWG文件一键导入）智能算量核心算法（基于规则引擎与机器学习）协同审图平台（多人实时标注与版本控制）AI辅助决策系统（材料价格预测、工程量误差检测）技术栈推荐：前端：Three.js（3D模型渲染）+React（协同界面）后端：Python（算量算法）+Java（业务逻
  • 9.3 智谱AI大模型生态爆发！中文准确率89.2%+代码生成67.3%，全面碾压GPT-4！ 少林码僧 掌握先机！从0起步实战AI大模型微调打造核心竞争力人工智能语言模型gpt
    智谱AI大模型生态爆发！中文准确率89.2%+代码生成67.3%，全面碾压GPT-4！1.WebGLM：联网检索增强大模型智谱AI于2022年推出的WebGLM是基于GLM-10B打造的检索增强生成（RAG）模型，其创新性地将大语言模型与搜索引擎深度整合，构建了独特的四阶段处理架构：
  • 【threejs实战教程一】初识Three.js，场景Scene、相机Camera、渲染器Renderer 编码七号 数码相机javascript开发语言
    Three.js是一个基于WebGL的JavaScript3D图形库，用于在浏览器中创建和显示3D内容Three.js中最基础的三个关键要素就是场景Scene、相机Camera、渲染器Renderer通俗一点理解，场景就是我们生活中一个具体的场景，比如自然环境中的一栋建筑，环境和内容构成了一个场景，相机就类比于人类的眼睛，渲染器就好比我们的中枢神经视觉处理器那我们的一个网页端3D场景就是把人类观察
  • 14道web前端工程师面试题及答案解析 蚂蚁小搬运工 web前端
    1.什么是HTML5？它有哪些新特性？答案：HTML5是HTML的第五个版本，引入了很多新的语法和特性，如语义化标签、多媒体支持、Canvas、地理定位、离线存储等。2.什么是WebGL？它有什么作用？答案：WebGL是一种用于在浏览器中渲染3D图形的API。它可以在浏览器中展示流畅和高质量的3D游戏和应用程序。3.什么是Canvas？它有什么作用？答案：Canvas是一种HTML5标签，用于在浏
  • Laya前端开源框架深度解析与实践应用 徐子贡
    本文还有配套的精品资源，点击获取简介：Laya前端开源框架是一个高效的跨平台JavaScript库，专注于2D/3D游戏及互动应用开发。它利用WebGL引擎提供原生级别的性能，同时兼容包括老旧IE在内的广泛浏览器环境。Laya框架具备强大的组件系统、资源管理、易用性，以及丰富的社区资源支持。实时编译和多平台发布能力让开发更加高效。通过LayaYKFramework-master项目，开发者可以深入
  • 为什么说Unity引擎支持跨平台 你一身傲骨怎能输 编程语言unity游戏引擎
    Unity引擎支持跨平台的主要理由包括以下几点：多平台发布：Unity引擎允许开发人员使用相同的代码和资源来构建应用程序和游戏，并在多个平台上发布，包括Windows、Mac、Linux、iOS、Android、WebGL、PlayStation、Xbox等。这种跨平台发布的能力使开发人员能够将他们的应用程序和游戏带到更广泛的受众中。统一开发环境：Unity提供了一个统一的开发环境，使开发人员可以
  • three.js 鼠标点击获取模型对象 lucky_zouzou javascript开发语言ecmascript
    three.js创建模型后，想要实现点击模型获取模型对象触发相应事件。可以使用它提供的APITHREE.Raycaster()https://threejs.org/docs/index.html?q=Raycaster#api/en/core/Raycaster//监听点击事件window.addEventListener('click',(event)=>{event.preventDefau
  • three.js 在 webGL 添加纹理 belldeep javascriptthree.jsjavascriptwebglthree.jsp5.js
    在我们生成了3D设计之后，我们可以添加纹理使其更加吸引人。在webGL和p5.js中，可以使用gl.texImage2D()和texture()API来为形状应用纹理。使用webGL在webGL中，gl.texImage2D()函数用于从图像文件生成2D纹理。该函数接受许多参数，包括目标，细节级别，内部格式，图像的宽度和高度，以及图像数据的格式和类型。为了方便，我将使用vite搭建一个原生js项目
  • Laya2.x游戏引擎入门系列（二）：UI界面开发 安也 i 游戏
    前端开发和游戏开发相信选择laya游戏引擎这类h5游戏引擎的开发者或多或少都有一些前端的开发经验，在开始开发小游戏之后会努力寻找和过往开发经历相似的地方。最后会发现二者之间的关系类似于网页开发和node.js服务端开发之间的关系，虽然都是使用了前端的开发语言（JS或TS），但是背后涉及的知识点却完全不同。小游戏全部是通过canvas或者webgl画在页面中，而网页开发是通过浏览器去做的渲染。我们在
  • 高斯溅射融合之路（一）- webgl渲染3d gaussian splatting 山海鲸可视化 数字孪生GIS系统webgl数字孪生GIS高斯泼溅AI重构
    大家好，我是山海鲸的技术负责人。之前已经写了一个GIS融合系列。其实CesiumJS的整合有相当的难度，同时也有很多方面的工作，很难在几篇文章内写完，整个山海鲸团队也是投入了接近两年的时间，才把周边整套工具链进行了完善，后续有新的内容也会持续分享，隔壁系列传送门：GIS融合之路一坑未平，一坑又起。去年年末，我们的AI合作伙伴突然给山海鲸技术团队丢来了一个新技术-3DGaussianSplattin
  • 可视化学习：WebGL实现简易的局部“马赛克”
    前言接触过Canvas的小伙伴应该都知道，在Canvas2D中我们要加载一个图片很简单，通过调用drawImageAPI就能将图像绘制到画布上，当然在WebGL中我们也可以绘制图像，在绘制时我们需要用到WebGL中的纹理对象，在之前WebGL实现网格背景的文章中，我使用了一个叫做纹理坐标的配置，现在要完成纹理的加载我们也需要用到纹理坐标，并且我们可以通过对纹理坐标处理实现简单的”马赛克“效果。通过
  • 可视化学习：使用WebGL绘制圆形，实现色盘
    前言在Canvas2D中实现圆形的绘制比较简单，只要调用arc指令就能在Canvas画布上绘制出一个圆形，类似的，在SVG中我们也只需要一个标签就能在页面上绘制一个圆形。那么在WebGL中我们要怎么去绘制呢？WebGL只能绘制三种形状：点、线段和三角形，它没有提供直接绘制圆形的功能，当然也无法像SVG一样使用标签，所以我们是无法直接绘制圆形曲线的，这个时候我们可以借助相关的数学知识，来实现圆形的绘
  • Three.js 入门(补间动画Tween.js) 庸俗今天不摸鱼 three.Js学习javascript开发语言ecmascript
    本篇主要学习内容:Tween.Js补间动画点赞+关注+收藏=学会了1.什么是Tween.Js?TweenJS是一个由JavaScript语言编写的补间动画库，如果需要tweenjs辅助你生成动画，对于任何前端web项目，你都可以选择tweenjs库。如果你使用three.js开发web3d项目，使用tween.js辅助three.js生成动画效果也是比较好的选择。1.1)引入tween.Jsimp
  • Three.js（0.165.0）入门到实战 郭宝 Web前端javascriptvue.js前端
    Three.js是什么？Three.js是一款开源的主流3D绘图JS引擎（名字Three就是3D的含义）。Three.js是一款运行在浏览器中的3D引擎，你可以用它创建各种三维场景，包括摄像机、光影、材质等各种对象。Three.js是一款WebGL框架，Three.js在WebGL的API接口基础上，又进行了一层封装。Three.js以简单的、直观的方式封装了3D图形编程中常用的对象。Three.
  • Three.js windows 环境搭建 恋恋西风 javajavascriptthree.jsnode.js
    要在Windows环境下搭建three.js开发环境，你需要遵循以下步骤。这里我将分别提供环境搭建、示例代码和一些常见错误及其解决方案。1.环境搭建步骤1:安装Node.js首先，确保你的Windows机器上安装了Node.js。你可以从Node.js官网下载并安装。步骤2:创建项目文件夹在Windows资源管理器中，创建一个新的文件夹用于你的three.js项目。步骤3:初始化npm项目打开命令
  • 《基于WebGPU的下一代科学可视化——告别WebGL性能桎梏》 Eqwaak00 matplotlibwebgl微服务架构云原生分布式
    引言：科学可视化的算力革命当WebGL在2011年首次亮相时，它开启了浏览器端3D渲染的新纪元。然而面对当今十亿级粒子模拟、实时物理仿真和深度学习可视化需求，WebGL的架构瓶颈日益凸显。WebGPU作为下一代Web图形标准，通过显存直存、多线程渲染和计算着色器三大革新，将科学可视化性能提升至10倍以上。本文将深入解析如何利用WebGPU突破大规模数据渲染的极限。一、WebGPU核心架构解析1.1
  • ThreeJS入门（140）：THREE.Mouse 知识详解，示例代码 还是大剑师兰特 #ThreeJS中文API全解大剑师threejs教程threejs示例threejs入门1024程序员节
    作者：还是大剑师兰特，曾为美国某知名大学计算机专业研究生，现为国内GIS领域高级前端工程师，CSDN知名博主，深耕openlayers、leaflet、mapbox、cesium，webgl，ThreeJS，canvas，echarts等技术开发，欢迎加微信（gis-dajianshi），一起交流。查看本专栏目录-本文是第140篇入门文章文章目录常量使用场景示例常量的使用总结THREE.MOUSE
  • mongodb3.03开启认证 21jhf mongodb
    下载了最新mongodb3.03版本，当使用--auth 参数命令行开启mongodb用户认证时遇到很多问题，现总结如下： （百度上搜到的基本都是老版本的，看到db.addUser的就是，请忽略） Windows下我做了一个bat文件，用来启动mongodb，命令行如下： mongod --dbpath db\data --port 27017 --directoryperdb --logp
  • 【Spark103】Task not serializable bit1129 Serializable
    Task not serializable是Spark开发过程最令人头疼的问题之一，这里记录下出现这个问题的两个实例，一个是自己遇到的，另一个是stackoverflow上看到。等有时间了再仔细探究出现Task not serialiazable的各种原因以及出现问题后如何快速定位问题的所在，至少目前阶段碰到此类问题，没有什么章法 1.   package spark.exampl
  • 你所熟知的 LRU(最近最少使用) dalan_123 java
    关于LRU这个名词在很多地方或听说，或使用，接下来看下lru缓存回收的实现 1、大体的想法     a、查询出最近最晚使用的项     b、给最近的使用的项做标记 通过使用链表就可以完成这两个操作，关于最近最少使用的项只需要返回链表的尾部；标记最近使用的项，只需要将该项移除并放置到头部，那么难点就出现 你如何能够快速在链表定位对应的该项？ 这时候多
  • Javascript 跨域 周凡杨 JavaScriptjsonp跨域cross-domain
                                       
  • linux下安装apache服务器 g21121 apache
    安装apache 下载windows版本apache，下载地址：http://httpd.apache.org/download.cgi   1.windows下安装apache Windows下安装apache比较简单，注意选择路径和端口即可，这里就不再赘述了。 2.linux下安装apache： 下载之后上传到linux的相关目录，这里指定为/home/apach
  • FineReport的JS编辑框和URL地址栏语法简介 老A不折腾 finereportweb报表报表软件语法总结
      JS编辑框： 1.FineReport的js。 作为一款BS产品，browser端的JavaScript是必不可少的。 FineReport中的js是已经调用了finereport.js的。 大家知道，预览报表时，报表servlet会将cpt模板转为html，在这个html的head头部中会引入FineReport的js，这个finereport.js中包含了许多内置的fun
  • 根据STATUS信息对MySQL进行优化 墙头上一根草 status
    mysql  查看当前正在执行的操作，即正在执行的sql语句的方法为:      show processlist 命令   mysql> show global status;可以列出MySQL服务器运行各种状态值，我个人较喜欢的用法是show status like '查询值%';一、慢查询mysql> show variab
  • 我的spring学习笔记7-Spring的Bean配置文件给Bean定义别名 aijuans Spring 3
    本文介绍如何给Spring的Bean配置文件的Bean定义别名？ 原始的 <bean id="business" class="onlyfun.caterpillar.device.Business"> <property name="writer"> <ref b
  • 高性能mysql 之 性能剖析 annan211 性能mysqlmysql 性能剖析剖析
    1 定义性能优化 mysql服务器性能，此处定义为 响应时间。 在解释性能优化之前，先来消除一个误解，很多人认为，性能优化就是降低cpu的利用率或者减少对资源的使用。 这是一个陷阱。 资源时用来消耗并用来工作的，所以有时候消耗更多的资源能够加快查询速度，保持cpu忙绿，这是必要的。很多时候发现 编译进了新版本的InnoDB之后，cpu利用率上升的很厉害，这并不
  • 主外键和索引唯一性约束 百合不是茶 索引唯一性约束主外键约束联机删除
    目标;第一步;创建两张表 用户表和文章表         第二步;发表文章       1,建表; ---用户表 BlogUsers --userID唯一的 --userName --pwd --sex create
  • 线程的调度 bijian1013 java多线程thread线程的调度java多线程
    1.       Java提供一个线程调度程序来监控程序中启动后进入可运行状态的所有线程。线程调度程序按照线程的优先级决定应调度哪些线程来执行。   2.       多数线程的调度是抢占式的（即我想中断程序运行就中断，不需要和将被中断的程序协商） a) 
  • 查看日志常用命令 bijian1013 linux命令unix
    一.日志查找方法，可以用通配符查某台主机上的所有服务器grep "关键字" /wls/applogs/custom-*/error.log   二.查看日志常用命令1.grep '关键字' error.log：在error.log中搜索'关键字'2.grep -C10 '关键字' error.log：显示关键字前后10行记录3.grep '关键字' error.l
  • 【持久化框架MyBatis3一】MyBatis版HelloWorld bit1129 helloworld
    MyBatis这个系列的文章，主要参考《Java Persistence with MyBatis 3》。   样例数据 本文以MySQL数据库为例，建立一个STUDENTS表，插入两条数据，然后进行单表的增删改查     CREATE TABLE STUDENTS ( stud_id int(11) NOT NULL AUTO_INCREMENT,
  • 【Hadoop十五】Hadoop Counter bit1129 hadoop
       1. 只有Map任务的Map Reduce Job File System Counters FILE: Number of bytes read=3629530 FILE: Number of bytes written=98312 FILE: Number of read operations=0 FILE: Number of lar
  • 解决Tomcat数据连接池无法释放 ronin47 tomcat 连接池　优化
    近段时间，公司的检测中心报表系统(SMC)的开发人员时不时找到我，说用户老是出现无法登录的情况。前些日子因为手头上 有Jboss集群的测试工作，发现用户不能登录时，都是在Tomcat中将这个项目Reload一下就好了，不过只是治标而已，因为大概几个小时之后又会 再次出现无法登录的情况。 今天上午，开发人员小毛又找到我，要我协助将这个问题根治一下，拖太久用户难保不投诉。 简单分析了一
  • java-75-二叉树两结点的最低共同父结点 bylijinnan java
    import java.util.LinkedList; import java.util.List; import ljn.help.*; public class BTreeLowestParentOfTwoNodes { public static void main(String[] args) { /* * node data is stored in
  • 行业垂直搜索引擎网页抓取项目 carlwu LuceneNutchHeritrixSolr
    公司有一个搜索引擎项目，希望各路高人有空来帮忙指导，谢谢！ 这是详细需求： （1） 通过提供的网站地址(大概100-200个网站)，网页抓取程序能不断抓取网页和其它类型的文件（如Excel、PDF、Word、ppt及zip类型），并且程序能够根据事先提供的规则，过滤掉不相干的下载内容。 （2） 程序能够搜索这些抓取的内容，并能对这些抓取文件按照油田名进行分类，然后放到服务器不同的目录中。
  • [通讯与服务]在总带宽资源没有大幅增加之前,不适宜大幅度降低资费 comsci 资源
          降低通讯服务资费，就意味着有更多的用户进入，就意味着通讯服务提供商要接待和服务更多的用户，在总体运维成本没有由于技术升级而大幅下降的情况下，这种降低资费的行为将导致每个用户的平均带宽不断下降，而享受到的服务质量也在下降，这对用户和服务商都是不利的。。。。。。。。     &nbs
  • Java时区转换及时间格式 Cwind java
    本文介绍Java API 中 Date, Calendar, TimeZone和DateFormat的使用，以及不同时区时间相互转化的方法和原理。   问题描述： 向处于不同时区的服务器发请求时需要考虑时区转换的问题。譬如，服务器位于东八区（北京时间，GMT+8:00），而身处东四区的用户想要查询当天的销售记录。则需把东四区的“今天”这个时间范围转换为服务器所在时区的时间范围。
  • readonly,只读，不可用 dashuaifu jsjspdisablereadOnlyreadOnly
    readOnly 和 readonly 不同，在做js开发时一定要注意函数大小写和jsp黄线的警告！！！我就经历过这么一件事： 使用readOnly在某些浏览器或同一浏览器不同版本有的可以实现“只读”功能，有的就不行，而且函数readOnly有黄线警告！！！就这样被折磨了不短时间！！！（期间使用过disable函数，但是发现disable函数之后后台接收不到前台的的数据！！！）  
  • LABjs、RequireJS、SeaJS 介绍 dcj3sjt126com jsWeb
    LABjs 的核心是 LAB（Loading and Blocking）：Loading 指异步并行加载，Blocking 是指同步等待执行。LABjs 通过优雅的语法（script 和 wait）实现了这两大特性，核心价值是性能优化。LABjs 是一个文件加载器。RequireJS 和 SeaJS 则是模块加载器，倡导的是一种模块化开发理念，核心价值是让 JavaScript 的模块化开发变得更
  • [应用结构]入口脚本 dcj3sjt126com PHPyii2
    入口脚本 入口脚本是应用启动流程中的第一环，一个应用（不管是网页应用还是控制台应用）只有一个入口脚本。终端用户的请求通过入口脚本实例化应用并将将请求转发到应用。 Web 应用的入口脚本必须放在终端用户能够访问的目录下，通常命名为 index.php，也可以使用 Web 服务器能定位到的其他名称。 控制台应用的入口脚本一般在应用根目录下命名为 yii（后缀为.php），该文
  • haoop shell命令 eksliang hadoophadoop shell
    cat chgrp chmod chown copyFromLocal copyToLocal cp du dus expunge get getmerge ls lsr mkdir movefromLocal mv put rm rmr setrep stat tail test text
  • MultiStateView不同的状态下显示不同的界面 gundumw100 android
    只要将指定的view放在该控件里面，可以该view在不同的状态下显示不同的界面，这对ListView很有用，比如加载界面，空白界面，错误界面。而且这些见面由你指定布局，非常灵活。 PS：ListView虽然可以设置一个EmptyView，但使用起来不方便，不灵活，有点累赘。 <com.kennyc.view.MultiStateView xmlns:android=&qu
  • jQuery实现页面内锚点平滑跳转 ini JavaScripthtmljqueryhtml5css
    平时我们做导航滚动到内容都是通过锚点来做，刷的一下就直接跳到内容了，没有一丝的滚动效果，而且 url 链接最后会有“小尾巴”，就像#keleyi，今天我就介绍一款 jquery 做的滚动的特效，既可以设置滚动速度，又可以在 url 链接上没有“小尾巴”。   效果体验：http://keleyi.com/keleyi/phtml/jqtexiao/37.htmHTML文件代码： &
  • kafka offset迁移 kane_xie kafka
    在早前的kafka版本中（0.8.0），offset是被存储在zookeeper中的。   到当前版本（0.8.2）为止，kafka同时支持offset存储在zookeeper和offset manager（broker）中。   从官方的说明来看，未来offset的zookeeper存储将会被弃用。因此现有的基于kafka的项目如果今后计划保持更新的话，可以考虑在合适
  • android > 搭建 cordova 环境 mft8899 android
      1 , 安装 node.js        http://nodejs.org      node -v   查看版本   2, 安装 npm   可以先从  https://github.com/isaacs/npm/tags  下载 源码 解压到
  • java封装的比较器，比较是否全相同，获取不同字段名字 qifeifei
     非常实用的java比较器，贴上代码： import java.util.HashSet; import java.util.List; import java.util.Set; import net.sf.json.JSONArray; import net.sf.json.JSONObject; import net.sf.json.JsonConfig; i
  • 记录一些函数用法 .Aky. 位运算PHP数据库函数IP
    高手们照旧忽略。 想弄个全天朝IP段数据库，找了个今天最新更新的国内所有运营商IP段，copy到文件，用文件函数，字符串函数把玩下。分割出startIp和endIp这样格式写入.txt文件，直接用phpmyadmin导入.csv文件的形式导入。（生命在于折腾，也许你们觉得我傻X，直接下载人家弄好的导入不就可以，做自己的菜鸟，让别人去说吧） 当然用到了ip2long()函数把字符串转为整型数
  • sublime text 3 rust wudixiaotie Sublime Text
    1.sublime text 3 => install package => Rust 2.cd ~/.config/sublime-text-3/Packages 3.mkdir rust 4.git clone https://github.com/sp0/rust-style 5.cd rust-style 6.cargo build --release 7.ctrl
按字母分类： ABCDEFGHIJKLMNOPQRSTUVWXYZ其他