vmars316 Posted January 11, 2016 Share Posted January 11, 2016 Hellol & Thanks , Having trouble with getting local image from javascript . So I would like to get the image in Html , then pass it to js . So , How to pass 'html *.png' to javascript ? Thanks..Vern Link to comment Share on other sites More sharing options...
thescientist Posted January 11, 2016 Share Posted January 11, 2016 are you talking in the context of using <canvas>? I'm not sure what you are asking for, or hoping to accomplish. Link to comment Share on other sites More sharing options...
vmars316 Posted January 11, 2016 Author Share Posted January 11, 2016 I am running pixi.js To get html to run i user would have to : In chrome , I have to add command line switchw=es , "C:\Program Files (x86)\Google\Chrome\Application\chrome.exe" --allow-file-access-from-files In IE , i have to click on the BLOCKED button So i was thinking , i could load image fine with html *.png and then grab it in js from html , maybe something like document.GetElementById . But I don't know how exactly to write that code . Possible ? Thanks..vm Link to comment Share on other sites More sharing options...
justsomeguy Posted January 11, 2016 Share Posted January 11, 2016 You're trying to load and run Javascript code as an image? Or trying to put an image on the page, then access the binary data of that file through Javascript? Link to comment Share on other sites More sharing options...
vmars316 Posted January 12, 2016 Author Share Posted January 12, 2016 (edited) Hello & Thanks , No probs getting an image file off internet or server with javascript, BUT Getting a LOCAL image file with javascript causes an "File access violation" . No problem with html5 getting a LOCAL file : <div id="images"> <br><img id="truth02id" name="truth02png" src="truth02.png"> </div> But If I use either of the two javascript code below , the browser considers it an "File access violation" : // Add our image as a sprite // OR loader .add("images/truth02.png") .load(setup); I have seen examples of using something like this (I don't know how to put it all together -need HELP) : var truth02 = new PIXI.Sprite.fromImage(document.getElementById("truth02id").src = "truth02.png"); Here is my working code (except for the "access violation") : <!doctype html> <html> <head> <meta charset="utf-8"> <title>Pixi.js goose.png</title> <style> body { margin: 0; padding: 0; background-color: #000; } </style> </head> <body> <script src="C:\pixi.js\bin\pixi.min.js"></script> <script> //////////////// var renderer = PIXI.autoDetectRenderer(160, 144); // Set the background color of the renderer to a baby-blue'ish color renderer.backgroundColor = 0x3498db; // Append the renderer to the body of the page document.body.appendChild(renderer.view); // Create the main stage for your display objects var stage = new PIXI.Container(); //////////////// // Add our image as a sprite // Set the anchor in the center of our sprite goose.anchor.x = 0.5; goose.anchor.y = 0.5; // Position our goose in the center of the renderer goose.position.x = renderer.width / 2; goose.position.y = renderer.height / 2; // Add the goose to the stage stage.addChild(goose); //////////////// // Start animating animate(); function animate() { requestAnimationFrame(animate); //////////////// // Rotate our goose clockwise goose.rotation += 0.1; // Rotate our goose counter-clockwise // goose.rotation -= 0.1; //////////////// // Render our container renderer.render(stage); } //////////////// </script> </body> </html> Edited January 12, 2016 by vmars316 Link to comment Share on other sites More sharing options...
justsomeguy Posted January 12, 2016 Share Posted January 12, 2016 If you're going to write a local file and load it in your browser locally, it runs in a different security context. Local file access isn't allowed through Javascript. You can't use ajax to read arbitrary local files. Link to comment Share on other sites More sharing options...
vmars316 Posted January 12, 2016 Author Share Posted January 12, 2016 Thanks : Yes , I am beginning to understand that I wonder how Enchant.js does it then . It works great ! Trouble is , they stopped updating it . Oh , here is a working example : http://liesandcowpies.com/testMe/~cat-source-WIP-experiment.html That means that no one can do a "save as" for the page above and have it run on their computer , Unless they specify saveAs "html only" option , and then to run it they must be connected to internet . justsomeguy , Thanks for sticking with me . ..Vern Link to comment Share on other sites More sharing options...
justsomeguy Posted January 13, 2016 Share Posted January 13, 2016 Well, they probably don't use ajax to load local files. Regular links still work locally, but ajax loading does not. Modern browsers also have the FileReader API, I'm not sure what changes if any to that happen when the file is run locally. Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now