timdream / wordcloud2.js

Tag cloud/Wordle presentation on 2D canvas or HTML

Home Page:https://wordcloud2-js.timdream.org/

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

TypeError: Cannot read property 'tagName' of null

WenukaGTX opened this issue · comments

I am trying to implement wordcloud2.js into a ReactJS project as below.

import React, { Component } from 'react'

const list = [['foo', 12], ['bar', 6]]

class QuestionResults extends Component {
  constructor (props, context) {
      super(props, context)
  }

  componentDidMount () {
      WordCloud(document.getElementById('word-cloud-content'), { list:list } )
  }
}

I am getting the following error.

react-dom.production.min.js:61 Uncaught TypeError: Cannot read property 'tagName' of null
    at wordcloud2.js:174
    at Array.forEach (<anonymous>)
    at WordCloud (wordcloud2.js:168)
    at QuestionResults.componentDidMount (QuestionResults.js:49)
    at oj (react-dom.production.min.js:127)
    at Aj (react-dom.production.min.js:160)
    at unstable_runWithPriority (react.production.min.js:25)
    at Da (react-dom.production.min.js:60)
    at ab (react-dom.production.min.js:154)
    at Te (react-dom.production.min.js:146)

react-dom.production.min.js:125 TypeError: Cannot read property 'tagName' of null
    at wordcloud2.js:174
    at Array.forEach (<anonymous>)
    at WordCloud (wordcloud2.js:168)
    at QuestionResults.componentDidMount (QuestionResults.js:49)
    at oj (react-dom.production.min.js:127)
    at Aj (react-dom.production.min.js:160)
    at unstable_runWithPriority (react.production.min.js:25)
    at Da (react-dom.production.min.js:60)
    at ab (react-dom.production.min.js:154)
    at Te (react-dom.production.min.js:146)

I am using the following versions.

"react": "^16.13.0",
"react-addons-test-utils": "^15.5.1",
"react-dom": "^16.13.0",
"babel-cli": "^6.26.0",
"babel-core": "^6.25.0",
"wordcloud": "^1.1.1"

I tried different ways but keep getting the same error.

Your example is missing the DOM representation. I would switch to a selector that does not require uniqueness.