我正在制作一个项目,three.js
用户可以动态地更改模型的尺寸.问题与我发布的这个问题非常相似,但是我担心它不起作用,因为这次我正在使用平面形状的挤压.我遇到问题的代码片段如下:
cubeY.onChange(function(value){
cube.scale.y = value;
cube.position.y = (cubeHeight * value) / 2;
roof.position.y = (roofHeight * roof.scale.y) / 2 + cube.position.y * 2 - roofHeight;});;
roofY.onChange(function(value){
roof.scale.y = value;
roof.position.y = ((roofHeight * value) + cube.position.y * 2) - value * roofHeight;
});
Run Code Online (Sandbox Code Playgroud)
正如您所观察到的,当我改变时roof.scale.y
,对象也在移动,但它应该固定在立方体的上部.你知道我做错了什么吗?这是一个完整代码的jsfiddle.
提前感谢您的回答!
正如标题所示,我正在构建一个项目,ionic
我无法复制/粘贴input
字段iOS 10
.根据这个问题,通过应用这些属性来css
解决问题:
input {
user-select: auto !important;
}
Run Code Online (Sandbox Code Playgroud)
但不幸的是它仍然无法正常工作.正如此 引用所暗示的那样,它可能是由它引起的$ionicLoading
,但我并没有在我的控制器中使用它.
你知道如何解决这个问题吗?提前感谢您的回复!
我建立类似项目的这个例子有jsartoolkit5
,我想能够选择我的设备的背面摄像头,而不是让的Chrome
上Android
选择前一个为默认值.
根据本演示中的示例,如果设备有后置摄像头,我已添加以下代码自动切换摄像头.
var videoElement = document.querySelector('canvas');
function successCallback(stream) {
window.stream = stream; // make stream available to console
videoElement.src = window.URL.createObjectURL(stream);
videoElement.play();
}
function errorCallback(error) {
console.log('navigator.getUserMedia error: ', error);
}
navigator.mediaDevices.enumerateDevices().then(
function(devices) {
for (var i = 0; i < devices.length; i++) {
if (devices[i].kind == 'videoinput' && devices[i].label.indexOf('back') !== -1) {
if (window.stream) {
videoElement.src = null;
window.stream.stop();
}
var constraints = {
video: {
optional: [{
sourceId: …
Run Code Online (Sandbox Code Playgroud) 我正在研究一个平行坐标图,d3.js
我试图从外部json
文件中绘制一些多维数据.
这是json文件中数据的结构:
[
{
"timestamp": 1437571117.035159,
"dimension": 10,
"value": [
{
"value": 0.13347661474528993,
"label": "A"
},
{
"value": 0.8677079004784608,
"label": "B"
},
{
"value": 0.7757451827314333,
"label": "C"
},
{
"value": 0.9614725817942508,
"label": "D"
},
{
"value": 0.5259754037241577,
"label": "E"
}
{
"value": 0.9683208234943124,
"label": "F"
},
{
"value": 0.9256394748794468,
"label": "G"
},
{
"value": 0.8749624261426282,
"label": "H"
},
{
"value": 0.6171642160674041,
"label": "I"
},
{
"value": 0.9933299503850428,
"label": "J"
}
]
}
]
Run Code Online (Sandbox Code Playgroud)
这就是我到目前为止处理域以及图表如何绘制项目数据的方式:
d3.json("json/10dim.json", function(error, …
Run Code Online (Sandbox Code Playgroud) 我正在创建一个球体,Three.js
每当它移动时必须跟随鼠标,如本例所示.处理鼠标移动的功能如下:
function onMouseMove(event) {
// Update the mouse variable
event.preventDefault();
mouse.x = (event.clientX / window.innerWidth) * 2 - 1;
mouse.y = - (event.clientY / window.innerHeight) * 2 + 1;
// Make the sphere follow the mouse
mouseMesh.position.set(event.clientX, event.clientY, 0);
};
Run Code Online (Sandbox Code Playgroud)
我附上一个JSFiddle,其中包含完整的代码,根据DOM,你可以看到它mouseMesh
是未定义的.你知道我做错了什么吗?
提前感谢您的回复!
我需要drag&drop
在移动设备上添加事件,touchstart
事件按预期触发,但没有明显的效果.
那么,是否有可能启动本机拖放事件touchstart
或者您是否知道一个示例,例如with @HostListener
,其中显示了如何处理此问题?
this.htmlElement.ontouchstart = (touchEvent: TouchEvent) => {
// here I check if user intend starting a drag&drop or if there are some other touch behaviours
if (dragging) {
// What to do here to start drag and drop
}
}
Run Code Online (Sandbox Code Playgroud)
提前感谢您的回复!
我正在构建一个应用程序Ionic
,我试图在其中找到四个row
元素和button
一个div
. 该div
有一个height: 100%
覆盖整个屏幕,并且内容已延伸到其全高。
我尝试了以下解决方案,但显然它不起作用:
ion-content {
position: relative;
height: auto;
width: 100%;
}
.boxes-container {
position: absolute;
height: 100%;
width: 100%;
}
Run Code Online (Sandbox Code Playgroud)
这是完整的代码。你知道有什么可能的方法来解决它吗?
提前感谢您的回复!
我正在尝试编写一个regex
在一个<input>
领域中使用的,其中接受 0 到 60 的数字。这是我现在拥有的:
<input type="number" min="0" max="60" pattern="^([0-5]?[0-9]|60)$">
Run Code Online (Sandbox Code Playgroud)
它工作正常,但问题是02
不应验证诸如此类的输入。你知道如何改进这个表达吗?
提前感谢您的回复!
我一直在尝试使用leaflet
地图缩放的不同策略,忽略库的默认固定缩放步骤,但到目前为止没有任何运气。通过以下函数:
window.addEventListener('mousewheel', function(e){
if (!e) e = event;
var direction = (e.detail<0 || e.wheelDelta>0) ? 1 : -1;
},
false);
Run Code Online (Sandbox Code Playgroud)
我想实现像 中的那样的平滑缩放效果,它根据鼠标滚动事件Google Maps
跟踪缩放。deltaY
您知道如何解决这个问题或者您知道我可以查看的参考资料吗?
提前感谢您的回复!
我有一个平坦的表面,我已经爆炸并镶嵌成三角形.我想获得每张脸的位置来应用动画,但显然我无法做到这一点.
if (intersects.length > 0) {
// if the closest object intersected is not the currently stored intersection object
if (intersects[0].object != INTERSECTED) {
if (INTERSECTED) {
INTERSECTED.face.color.setHex(INTERSECTED.currentHex);
}
INTERSECTED = intersects[0];
INTERSECTED.currentHex = INTERSECTED.face.color.getHex();
INTERSECTED.face.color.setHex(0xc0392b);
INTERSECTED.object.geometry.colorsNeedUpdate = true;
var position = new THREE.Vector3();
position.setFromMatrixPosition( INTERSECTED.matrixWorld );
alert(position.x + ',' + position.y + ',' + position.z);
}
}
Run Code Online (Sandbox Code Playgroud)
我尝试使用INTERSECTED.face.matrixWorld.getPosition()
,如本例中所指定的,但它抛出了一个错误.在这里,您可以找到包含完整代码的JSFiddle.你知道我的代码有什么问题吗?
提前感谢您的回复!
大家好,我想<button>
在我的代码中插入一个间隙border-top
和border-bottom
.我已经看到了一些可以用它删除零件的例子,但这并不是我想要的.您是否知道如何获得上述图片?
提前感谢您的回复!
编辑:
我添加了更多信息:最好的是按钮的背景是透明的,border-size
可以自定义.
javascript ×6
css ×3
html ×3
three.js ×3
angular ×2
aframe ×1
android ×1
angular-cli ×1
angularjs ×1
canvas ×1
cordova ×1
d3.js ×1
drag ×1
html5 ×1
ios10 ×1
jsartoolkit ×1
json ×1
leaflet ×1
mobile ×1
mouseevent ×1
regex ×1
scroll ×1
touch ×1
typescript ×1