It seems THREE.JS MTLLoader cannot load mtl file. It somehow take mtl file as JSON file, and tries to parse mtl file.
Here is the code:
var objLoader = new THREE.ObjectLoader();
var mtlLoader = new THREE.MaterialLoader();
mtlLoader.load("istuff.mtl",function (materials) {
materials.preload();
objLoader.setMaterial(materials);
objLoader.load("istuff.obj", function ( object ) {
scene.add(object);
}, onProgress, onError)
});
Here is the error:
VM64:1 Uncaught SyntaxError: Unexpected token # in JSON at position 0
at JSON.parse (<anonymous>)
at Object.onLoad (three.js:35569)
at XMLHttpRequest.<anonymous> (three.js:30803)
Blender MTL File: 'istuff.blend' //error here
Update:
Error:
GET http://localhost:63342/Users/yuqingyang/Downloads/imac%20(1)/mac_keyb.jpg 404 (Not Found)
It's trying to get image in my mac, but it's supposed to get the image from url.
That's because you are using an instance of ObjectLoader. What you need is OBJLoader. Have a closer look at the following example:
https://threejs.org/examples/#webgl_loader_obj_mtl
Related
I am trying to get geojson data (point coordinates of a track) using the arcgis online REST API.
var data = {
};
// sends AJAX request and forwards the returned data to the visualiser
data.requestJSON = function(requestParameters) {
$.ajax({
url: "https://services.arcgis.com/........=*&f=geojson" ,
method: 'GET',
success: function(response) {
visualizer.sendDataToMap(response);
},
error: function(error) {
}
});
};
The geojson data should the be processed in another .js and added to a map.
But I cannot turn the data in a vector.
I found some helpful answers here in the forum, but it still does not work.
var visualizer = {}
//prepare the data for visualisation
visualizer.sendDataToMap = function(jsonData) {
console.log("jsondata",jsonData);
var track = new ol.source.Vector({
features: new ol.format.GeoJSON().readFeatures(jsonData)
});
console.log("track",track);
}
The geojson data from the ajax request shown in the console looks as if the right data is passed.
But turning it into a vector, according to some code line I found here in the forum, does not seem to work. I do not understand the console.log.
Can anyone give a hint how to do that?
The console error message looks like
ol.js:319 Uncaught TypeError: b.R is not a function
at mn.l.Va (ol.js:319)
at Object.visualizer.sendDataToMap (visualizer.js:40)
at Object.success (dataProvider.js:10)
at i (jquery.min.js:2)
at Object.fireWith [as resolveWith] (jquery.min.js:2)
at z (jquery.min.js:4)
at XMLHttpRequest.<anonymous> (jquery.min.js:4)
Or maybe someone has done the same and could provide an example I could try to follow.
Thanks.
I am using the google maps API to show a location. The lng/ltg values are stored in my DB. Unfortunately the values in my view are comma separated and an exception is thrown, because the values need to be separated with a point.
SequelPro shows me that the values are separated with points in my DB.
It seems that blade is doing something else with the values.
var lat = 49,3987524;
What can I do to get 49.3987524 instead of 49,3987524?
The error Message is:
4:491 Uncaught SyntaxError: Unexpected number
This is my script:
var lat = {{$restaurant->lat}};
var lng = $restaurant->lng;
var map = new google.maps.Map(document.getElementById('map-canvas'),{
center:{
lat: lat,
lng: lng
},
zoom: 15
});
var marker = new google.maps.Marker({
position:{
lat:lat,
lng: lng
},
map:map
});
Ok, In case somebody has a similar issue.
I solved it with {{str_replace(',','.',$restaurant->lat)}}.
I am trying to upload a file to the REST Api of Octoprint, which should be done by sending a POST request with Content-Type: multipart/form-data
(http://docs.octoprint.org/en/master/api/fileops.html#upload-file)
I am using NodeJS and two libraries, XmlHttpRequest and form-data. When trying:
var xhr = new xmlhttprequest() ;
var form = new formData() ;
form.append('exampleKey', 'exampleValue');
xhr.open("POST","octopi.local/api/local", true) ;
xhr.setRequestHeader("Content-Type","multipart/form-data") ;
xhr.send(form) ;
I get an error at the xhr.send line :
TypeError: first argument must be a string or Buffer
If I make a synchronous request by using xhr.open("POST",url,false), this error disappears.
Why is it so ? Is there a way to turn it into an asynchronous request ?
EDIT Actually, I don't really understand the documentation. I suppose that I should set the file I want to upload by using form.append("filename", filepath, "exampleName"), but I am not sure about that. The fact is that I noticed that I get the TypeError even if I try a simplified request, without sending any file.
EDIT2 This is the modified code, which returns the same error :
var XMLHttpRequest=require('xmlhttprequest').XMLHttpRequest ;
var FormData = require('form-data');
var data = new FormData();
data.append("key","value" );
var xhr = new XMLHttpRequest();
xhr.open('POST', "octopi.local/api/files/");
xhr.send(data);
After a long time working on this, I finally managed to upload a file. If you use NodeJS, don't rely on the MDN documentation: it tells what the libraries should do, not what they can actually do on the node platform. You should only focus on the docs available on GitHub.
It seems that it is not currently possible to send a form with XMLHttpRequest : I tried using JSON.stringify(form) but then wireshark tells me that the request is not a multipart/formdata request.
If you want to upload a file, you should rather use the 'request' module. The following has worked for me :
exports.unwrappeduploadToOctoprint = function(){
"use strict" ;
var form ={
file: {
value: fs.readFileSync(__dirname+'/test2.gcode'),
options: { filename: 'test2.gcode'}
}
};
var options = {
method: 'POST',
url: 'http://192.168.1.24/api/files/local',
headers: { 'x-api-key': 'E0A2518FB11B40F595FC0068192A1AB3'},
formData: form
};
var req = request(options, function (error, response, body) {
if (error) throw new Error(error);
console.log(body);
});
};
Seems that you have some typos in your code. Use code snippet below instead. Replace the relevant parts according to your needs
var fileToUpload = document.getElementById('input').files[0];
var data = new FormData();
data.append("myfile", fileToUpload);
var xhr = new XMLHttpRequest();
xhr.open('POST', "upload_endpoint");
xhr.send(data);
Our team has developed a JS HTML5 canvas based paint application. In the following code, the image data is fetched from the canvas as base 64 encoding and posted to a servlet via ajax. The data post behaves erratically. If the image is simple , as in a straight line, I get Ajax status = 200 and the image gets saved. If the image is complex, then I get a status = 400 and the data is not saved.
Why should the content of the POST create issues with posting of the data itself?
function getCode(){
var canvas = document.getElementById('imageView');
var context = canvas.getContext('2d');
// draw cloud
context.beginPath();
// save canvas image as data url
var dataURL = canvas.toDataURL();
// set canvasImg image src to dataURL
// so it can be saved as an image
document.getElementById('canvasImg').src = dataURL;
var uri= document.getElementById('canvasImg').src;
uri = uri.replace('data:image/png;base64,','');
uri = uri.replace('=', '');
uri = uri.trim();
alert("uri is "+uri);
var ajaxobject ;
if(window.XMLHttpRequest){
ajaxobject = new XMLHttpRequest();
} else if(window.ActiveXObject){
ajaxobject = new ActiveXObject("Microsoft.XMLHTTP");
}else if(window.ActiveXObject){
ajaxobject = new ActiveXObject("Msxml2.XMLHTTP");
}
ajaxobject.open("POST", "SaveImageServlet?image="+uri, true);
ajaxobject.setRequestHeader("Content-type","application/x-www-form-urlencoded");
ajaxobject.onreadystatechange = function(){
if(ajaxobject.readyState==4){
alert(ajaxobject.status);
if(ajaxobject.status==200){
alert(ajaxobject.responseText);
}}
};
ajaxobject.send(null);
}
From looking at your code, the problem seems that you're passing the data in querystring instead of using the request body (as you should be doing since you're setting the POST verb).
Your uri should look like this:
SaveImageServlet
without the question mark and the parameter. The parameter should be set in the request body. Using jquery ajax your request would look like this:
$.ajax({
contentType: 'text/plain',
data: {
"image": yourBase64string
},
dataType: 'application/json', // or whatever return dataType you want
success: function(data){
// callback in case of success
},
error: function(){
// callback in case of error
},
type: 'POST',
url: '/SaveImageServlet'
});
On server side you should be reading the data from the appropriate place. For example, if you're using .Net read it like this:
Request.Form["image"]
instead of:
Request.Querystring["image"]
This should work as intended and consistently.
#Matteo, Thanks for your help and effort. However, AJAX issue never got solved. I found a way to send the base64 image data to the servlet. Just appended it to a hidden field and sent it as a regular form field.
I'm trying to upload a photo to Appcelerator Cloud Services (ACS) storage using Trigger.io.
I can't figure out the correct syntax to use for the file object.
I'm getting an error "Error: Syntax error, unrecognized expression: #[object Object]"
Here's my relevant code:
$("#photograph-record").on("click", function(){
forge.file.getImage({source:"camera", width: 280, height: 280},function(file) {
var data = {
photo: file //the ID of file input control
};
sdk.sendRequest('photos/create.json', 'POST', data, callback);
});
});
Here's the Docs for the ACS Photo class - http://cloud.appcelerator.com/docs/api/v1/photos/create
Required Parameters - photo: the attached binary file
Since it needs to be a binary I tried "photo: forge.file.string(file)" (http://docs.trigger.io/en/v1.4/modules/file.html#modules-file), but got an error on the Appcelerator side "Photo parameter required for photo upload".
I have no problem passing the image into my App page views using forge.file.url, so I know there's no problems with the file object, it's just figuring out the correct syntax to pass it as a binary to the sdk.sendRequest call.
Any ideas on what I need to be passing in the data variable to get this to work?
The Appcelerator docs are pretty good here - it looks like they're expecting a POST parameter called photo which contains the binary image data.
To do that using our request module:
$("#photograph-record").on("click", function(){
forge.file.getImage({source:"camera", width: 280, height: 280},function(file) {
file.name = 'photo'; // the magic
forge.request.ajax({
url: 'https://api.cloud.appcelerator.com/v1/photos/create.json',
files: [file],
success: function () { ... },
error: function () { ... }
});
});
});
I don't see a way to use their JS library here, because they're expecting you to pass in the id of a HTML form element to get data from, but we're interacting with the camera or gallery directly...