In [1]:
from jupyter_scisheets_widget import scisheets_widget
In [2]:
scisheets_widget.SciSheetTable()
In [ ]:
%%javascript
import Handsontable from 'handsontable/dist/handsontable.full.js';
In [ ]:
from IPython.display import display
In [ ]:
%%javascript
var
data1 = [
['', 'Kia', 'Nissan', 'Toyota', 'Honda', 'Mazda', 'Ford'],
['2012', 10, 11, 12, 13, 15, 16],
['2013', 10, 11, 12, 13, 15, 16],
['2014', 10, 11, 12, 13, 15, 16],
['2015', 10, 11, 12, 13, 15, 16],
['2016', 10, 11, 12, 13, 15, 16]
],
settings1 = {
data: data1
},
hot1;
hot1 = new handsontable(element, settings1);
data1[0][1] = 'Ford'; // change "Kia" to "Ford" programmatically
hot1.render()
In [ ]:
%%html
<div id="element">Testing</div>
In [ ]:
%%javascript
var el = document.getElementById('element');
var body = document.getElementsByTagName('body');
el.innerHTML = '<p><a id="clickme" href="#">Click me</a></p>';
In [ ]:
%%javascript
var handsontable = require(["handsontable"]);
In [ ]:
%%javascript
var el = document.getElementById('element');
this.el.handsontable({data:datatest});
In [ ]:
%%javascript
element.handsontable({data:datatest});
In [ ]:
%%javascript
require(['handsontable'], function(handsontable) {
console.log("in require->handsontable");
var data = [
["", "Maserati", "Mazda", "Mercedes", "Mini", "Mitsubishi"],
["2009", 0, 2941, 4303, 354, 5814],
["2010", 5, 2905, 2867, 412, 5284],
["2011", 4, 2517, 4822, 552, 6127],
["2012", 2, 2422, 5399, 776, 4151]
];
var test = document.getElementById('element');
test.innerHTML='poo'
var hot = new handsontable(test, {
data: data,
minSpareRows: 1,
colHeaders: true,
contextMenu: true
});
function bindDumpButton() {
$('body').on('click', 'button[name=dump]', function () {
var dump = $(this).data('dump');
var $container = $(dump);
console.log('data of ' + dump, $container.handsontable('getData'));
});
}
bindDumpButton();
});
In [ ]:
In [ ]:
In [ ]:
In [3]:
import numpy as np
import pandas as pd
In [ ]:
from jupyter_scisheets_widget import scisheets_widget
In [4]:
tbl = scisheets_widget.SciSheetTable()
In [5]:
data = [{"name": "Lisp", "value": 1}, {"name": "Scala", "value": 2}, {"name": "Perl", "value": 4}, {"name": "Java", "value": 5}, {"name": "C++", "value": 8}, {"name": "Python", "value": 10}]
tbl.set_data(data)
In [23]:
tbl.set_data(df.to_json(
orient='values',
date_format='iso',
))
In [24]:
tbl._model_data
Out[24]:
In [25]:
tbl
In [ ]:
%%javascript
this.$table = $('<div />').appendTo(this.$el);
var view = this;
// Get the model's value (JSON)
var json = this.model.get('_model_data');
// Get the model's JSON string, and parse it.
var datamod = JSON.parse(json);
// Create the Handsontable table.
this.$table.handsontable({
{data: datamod}
});
In [6]:
data = np.random.randint(size=(3, 5), low=100, high=900)
df = pd.DataFrame(data)
df
Out[6]:
In [ ]:
widget_df = scisheets_widget.HandsonDataFrame(df)
In [ ]:
widget_df.show()
In [ ]:
import ipywidgets as widgets
In [ ]:
widgets.IntSlider()
In [ ]:
In [ ]:
%%javascript
var output_area = this;
// find my cell element
var cell_element = output_area.element.parents('.cell');
// which cell is it?
var cell_idx = Jupyter.notebook.get_cell_elements().index(cell_element);
// get the cell object
var cell = Jupyter.notebook.get_cell(cell_idx);
In [ ]:
%%javascript
var div = document.createElement('div');
div.innerHTML = '<span class="msg">Hello world.</span>';
In [ ]:
%%javascript
var table_id = 0;
this.$table = $('<div />')
.attr('id', 'table_' + (table_id++))
.appendTo(element);
this.$table.handsontable({data:data1});
// this.element.handsontable({data:data1});
// console.log('how?')
In [ ]:
%%javascript
element.text('Hi')
console.log('There')
In [ ]:
%%javascript
$element.handsontable({data:data1});
In [ ]:
In [ ]:
df = pd.DataFrame({'a':[1,3,5,7,4,5,6,4,7,8,9],
'b':[3,5,6,2,4,6,7,8,7,8,9]})
In [ ]:
data = np.random.randint(size=(3, 5), low=100, high=900)
df = pd.DataFrame(data)
In [ ]:
In [ ]:
display(hdf)
In [ ]:
hdf = scisheets_widget.HandsonDataFrame(df)
hdf.show()
In [ ]:
display(hdf._widget)
In [ ]:
%%javascript
require(['handsontable'], function (handsontable){
console.log("in require->handsontable");
var data = [
["", "Maserati", "Mazda", "Mercedes", "Mini", "Mitsubishi"],
["2009", 0, 2941, 4303, 354, 5814],
["2010", 5, 2905, 2867, 412, 5284],
["2011", 4, 2517, 4822, 552, 6127],
["2012", 2, 2422, 5399, 776, 4151]
];
$('#hs_example').handsontable({
data: data,
minSpareRows: 1,
colHeaders: true,
contextMenu: true
});
function bindDumpButton() {
$('body').on('click', 'button[name=dump]', function () {
var dump = $(this).data('dump');
var $container = $(dump);
console.log('data of ' + dump, $container.handsontable('getData'));
});
}
bindDumpButton();
});