vsmjs

Translating any knowledge into a computable form, made easy.
Here we collect all information about VSM:



Overview and examples: how to create and read computable knowledge in a vsm-box.


vsm-box example animation


vsm-box examples part 1 sep vsm-box examples part 2 sep vsm-box examples part 3 sep vsm-box examples part 4 sep vsm-box examples part 5 sep vsm-box examples part 6 sep vsm-box examples part 7





It is easy to use a vsm-box in your project. For example: paste this in a file called 'test.html', and open it in your browser:


<!doctype html>
<html>
<head>
  <!-- 1) Load the vsm-box module, and a vsm-dictionary to provide terms+identifiers. -->
  <script src="https://unpkg.com/vsm-box@^1.0.0/dist/vsm-box.standalone.min.js"></script>
  <script src="https://unpkg.com/vsm-dictionary-local@^2.6.0/dist/vsm-dictionary-local.min.js"></script>
</head>


<body>
  <!-- 2) Place a vsm-box element on the web page. -->
  <vsm-box id=vsmbox autofocus=true></vsm-box>

  <br> <textarea id=textarea readonly rows=31 cols=45></textarea>  <!-- (Textfield to show vsm-box data). -->
</body>


<script>
  // 3) Connect the vsm-box to a vsm-dictionary. Here we make one that provides demo-data.
  //    Or we could use online vocabulary data, like with vsm-dictionary-bioportal etc.
  vsmbox.vsmDictionary = new VsmDictionaryLocal({
    refTerms: ['it'],
    dictData: [
      { id: 'http://dem.o/A',  name: 'Demo dictionary A',
        entries: [
          { id: 'http://dem.o/A/A:01', terms: [{ str: 'Jo' }, { str: 'Joanna' }] },  // Synonyms.
          { id: 'http://dem.o/A/A:02', terms: [{ str: 'eats' }], descr: 'an eating activity' }
        ]
      }
    ]
  });


  // 4) Optional: Fill the vsm-box with a VSM-template.  Uncomment this to do so:
  /*vsmbox.initialValue = {
    terms: [ { placeholder: 'name' },  { str: 'eats', classID: 'http://dem.o/A/A:02', instID: null },  {} ],
    conns: [ { type: 'T',  pos: [ 0, 1, 2 ] } ]
  };*/


  // 5. Receive vsm-box content updates. Here we show its data-content live in the textfield below it.
  vsmbox.addEventListener('change', showData);
  function showData(event) {  textarea.value = JSON.stringify(event.detail[0], null, 2)  }
  showData({ detail: [vsmbox.initialValue || { terms: [], conns: [] }] });
</script>
</html>