Starting Here.js Creating new MapView Get TypeError - here-api

Question

I am trying to use harp.gl and used following tutorial.
tutorial:https://developer.here.com/tutorials/harpgl/
But I am getting following errors.
MapView.ts:919 Uncaught TypeError: Cannot read property 'addEventListener' of null
at new MapView (MapView.ts:919)
at JavaScript.js:2

Answer 1

You tried to use the method 2 of tutorial on https://developer.here.com/tutorials/harpgl/
I made the same followed tutorial method2 and into the file index.ts implemented the mapView.addEventListener as you can see what contains my index.ts below:
/*
* Copyright (C) 2017-2019 HERE Europe B.V.
* Licensed under Apache 2.0, see full license in LICENSE
* SPDX-License-Identifier: Apache-2.0
*/
import { GeoCoordinates } from "#here/harp-geoutils";
import { View } from "./View";
import { MapViewEventNames } from "#here/harp-mapview";
const app = new View({
canvas: document.getElementById("map") as HTMLCanvasElement
});
const mapView = app.mapView;
const options = { tilt: 45, distance: 3000 };
const coordinates = new GeoCoordinates(1.278676, 103.850216);
let azimuth = 300;
mapView.addEventListener(MapViewEventNames.Render, () => {
mapView.lookAt(coordinates, options.distance, options.tilt, (azimuth += 0.1))
});
mapView.beginAnimation();
// make map full-screen
mapView.resize(window.innerWidth, window.innerHeight);
// react on resize events from the browser.
window.addEventListener("resize", () => {
mapView.resize(window.innerWidth, window.innerHeight);
});
// center the camera to New York
mapView.lookAt(new GeoCoordinates(40.70398928, -74.01319808), 1500, 40, 0);
// make sure the map is rendered
mapView.update();
This code and mapView.addEventListener works for me properly without any errors.
Please check your hardware, Operation System, browser version.
Please test all examples on http://harp.gl.s3-website-us-east-1.amazonaws.com/docs/master/examples/ on your device and others.