By Alexandria Phillips

Click here to watch recordings.

Hey everyone, it’s been a minute! We haven’t forgotten about you — things have, been, uh, a little crazy. How are you holding up these past two months? #2020needstoend

Good news though, we are back and super excited to tell you about our inaugural iTwin Developer Conference on November 4 and 5. Remember the JumpStart event from August? Well, DevCon is the next event the team has organized. We’ll be taking things to the next level.

Image for post

Since we still can’t hangout IRL, let’s hangout virtually. We’ve brought in the best and the brightest to talk to us from their kitchen tables/home offices/remote island. (It’s not longer WFH, it’s work from anywhere! …


By Billy Simarmata

TowerSight is a TypeScript/React web application that is built using iModel.js framework. It is a part of bigger solution called OpenTower that serves as a transformation tool for design practices of telecom towers. OpenTower is a fully integrated solution that transforms the design practices of telecom towers by encompassing the entire lifecycle management of tower engineering. From tower analysis to inspection and reality models, TowerSight, as part of OpenTower solution, completes the loop using a tower digital twin, making it easy to modify existing towers and maintain accurate models.

First Impression

Before this project started, I really didn’t know much about web programming. I built some static website using HTML and CSS before but nothing more than that. Along with me, two other developers also work in this project but they didn’t have any experience working with typescript/react either. So upon receiving this project, I felt that I would not be able to achieve it without help from other people. Luckily enough, throughout this project, I met a lot of amazing people at Bentley that helped me develop this app.


By Mike Belousov

So you want to use React with iModel.js? Great, React is a very popular web framework for very good reasons, it has a huge following, a huge community and tons of open source packages to build upon. How to deal with classes in React will be important to us in an iModel.js app, since iModel.js is chock-full of framework-agnostic vanilla TypeScript classes. In a previous article, Writing a Primitive Tool, I built a microscopic iModel.js app, which I will improve here by applying the Provider-Local Class pattern.

This is my favorite pattern for using vanilla JavaScript classes in React.

We'll also discuss the merits of Redux and why both are used in React-land. …


By Mike Belousov

This tutorial, while self-contained, also serves as context to the article, The Provider-Local Class Pattern. If you’re an experienced programmer, I’d suggest checking out that article after for some discussion on scaling iModel.js applications.

Together in this article we’ll build a primitive iModel.js app with a PrimitiveTool.

Image for post
Image for post
I call it: The Pin Tool

We’ll load an iModel, and have our tool place a ‘pin’ in the viewport where the user chooses. All of the added pins will be listed in a sidebar, and the user can “manage” their pins. We’ll fork a starting point from the iModel.js basic viewport app sample to make things quick. Each set of changes I make will feature a commit in my fork, and will be mentioned with an accompanying link. …


By Kevin Krisfalusy

The What

The iTwin Viewer is an iModel.js viewer that contains basic functionality for navigation, element selection, and measuring/clipping, as well as a basic tree view and property grid out-of-the-box.

Image for post
Image for post

It can be extended with additional functionality via iModel.js Extensions.

The Why

iModel.js contains a full featured framework for rendering models in the browser. The cost of providing such a robust framework, however, is increased complexity and startup time for new applications.

The iTwin Viewer simplifies the process of adding an iModel.js viewer to a new or existing application and decreases the amount of time that would be required to get “up and running”. In the iTwin Viewer, much of the boilerplate that is required to initialize iModel.js …


By Johannes Renner

So, here’s a quick one. This is by no means a full-blown guide on how to add Revit files to an iModel, this is simply a quick and dirty overview, guiding you through the sequence you’ll need to follow.

Some might know the famous Revit sample house. In my previous life, I often used this project to demonstrate Revit features during team training. Geolocating projects in Revit isn’t the easiest and there are multiple ways to achieve this. Almost everyone has a slightly different approach to this.

In case you have Revit available here’s where you can find the sample…


By Johannes Renner

So, here’s a quick one. This is by no means a fully blown guide on how to add Revit files to an iModel, this is simply a quick and dirty overview, guiding you through the sequence you’ll need to follow.

Some might know the famous Revit sample house. In my previous life, I often used this project to demonstrate Revit features during team training. Geolocating projects in Revit isn’t the easiest and there are multiple ways to achieve this. Almost everyone has a slightly different approach to this.

In case you have Revit available here’s where you can find the sample…


By Matt Gooding

My favorite thing about working with iModel.js is the speed and simplicity of writing small programs to understand and manipulate the data in design files. I tend to write and iterate on lots of tiny command line applications when debugging. I also think these applications are the easiest way to become acquainted with iModel.js and TypeScript when coming from a traditional desktop software background.

This blog post contains a skeleton that can be used to quickly bootstrap a command-line iModel.js application. The only prerequisite is the appropriate version of Node.js.

Start by creating a new directory for the application. In the root of the directory, create a new file named package.json. This file defines your dependencies and other information about the application. …


By Johannes Renner

Editor’s note: The following post uses MicroStation for Geolocating an iModel. Click here to find out more about this product.

Creating an iModel

Time to dive in and get started with iTwins, iModels and iModel.js. There are a couple of ways to create a new iModel. Head over to getting started and create your account. Once you registered you can create new iModel from the dashboard. Click on NEW, give your iModel a name and in this case, we want to use the iTwin Synchronizer.

Image for post
Image for post

In case you call your model simply “Test” you will notice that your model will be automatically be assigned a unique code. This ensures that there are no duplicate iModels. So be creative! The initially created iModel acts as an empty container and information models can be subsequently added as the project evolves. …


By Zachary Zhu

Hello, I am a third-year undergraduate student at Lehigh University. Since February 2020, I have been working on an open-source project with Bentley Systems Inc. The goal has been to develop an interactive campus map with Bentley’s open-source library, iModel.js, for Lehigh University. Throughout the development phases, I have come up with some important ideas to help future developers build a robust iModel.js Frontend Application.

Introduction

By the end of this reading, you will learn a powerful methodology to integrate external data with iModel elements and build an interactive system for your iModel.js frontend application.

I’ll cover these topics in the following…

iModel.js

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store