Probably the best printed circuit board viewer on the internet
This particular PCB viewer takes your Gerber and drill files and gives you individual layer renders as well as very fancy renders of what your completed boards are going to look like.
The tracespace viewer accomplishes all this locally (nothing gets sent to any server!) by converting your files to SVGs. Thanks to the "Scalable" and "Vector" in "SVG", the renders are easy to examine and quite accurate.
Because you should always check your design files for problems! Existing Gerber viewers are good, but tend not to give you a full picture of what your board will look like, meaning you can miss important details (shout out to OSH Park for super cool renders by default). Gerber files (i.e. your PCB manufacturing files) are vector image files, so it makes sense to convert them into a scalable, web-friendly vector format.
See something that doesn't look right? Open an issue! Screenshots and Gerber files help if you're able to. If you're not comfortable publicly posting your designs, you can also email [email protected] with your issue.
If you're technically inclined, PR's are always welcome!
This site is written in ES2040 and uses babel and webpack to build for the browser. The state layer is build using redux and the view layer is built with deku. Rendering is accomplished with web workers, gerber-to-svg, and the tracespace pcb stackup builder.
Tests are run with ava and code is linted with eslint. Please make sure any PRs are accompanied by unit tests. We use travis as our CI server.
This app is hosted on GitHub Pages.
Nothing fancy here, just npm scripts. See package.json for the full list. These are the important ones:
$ npm start- starts an HMR dev server at localhost:8080$ npm test- run tests$ npm run test:watch- run tests on code changes
The site is deployed automatically by Travis if the commit is tagged (and tests pass). To deploy:
$ npm version ...- Use the npm version command to bump the version and tag the commit$ git push --tags- Push the tag to trigger a build
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent