├── BlackScholesViewer.ipynb ├── LICENSE ├── MANIFEST.in ├── README.md ├── create_api_json.ipynb ├── demo_ezvisd3.ipynb ├── ezvis3d ├── __init__.py ├── __meta__.py ├── _config.py ├── _plot.py ├── _state.py ├── _vis3d.py ├── _wrapper.py ├── api │ ├── ezvis3d_dataset.json │ ├── ezvis3d_dataset.tsv │ ├── ezvis3d_method.json │ ├── ezvis3d_method.tsv │ ├── ezvis3d_option.json │ └── ezvis3d_option.tsv └── scripts.py ├── requirements.txt ├── setup.cfg └── setup.py /LICENSE: -------------------------------------------------------------------------------- 1 | The MIT License (MIT) 2 | 3 | Copyright (c) 2015 Olivier Borderies 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in 13 | all copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN 21 | THE SOFTWARE. -------------------------------------------------------------------------------- /MANIFEST.in: -------------------------------------------------------------------------------- 1 | # necessary to push to PyPI 2 | # cf. https://tom-christie.github.io/articles/pypi/ 3 | 4 | # subfolders 5 | recursive-include ezvis3d/api * 6 | 7 | # Misc 8 | include LICENSE 9 | include README.rst 10 | include requirements.txt 11 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # ezvis3d 2 | 3 | **ezvis3d** stands for easy vis.js/Graph3d. 4 | [vis.js Graph3d](http://visjs.org/graph3d_examples.html) is a popular, flexible, versatile, user friendly 3d visualisation javascript library. 5 | 6 | **ezvis3d** is a wrapper that lets you transparently access the full configuration options of the library as described in their APIs, directly from the [Jupyter notebook](http://jupyter.org/). 7 | 8 | You just need to store the data in a [pandas](http://pandas.pydata.org/) dataframe. 9 | See the examples in these notebooks: 10 | + the [demo notebook](http://nbviewer.ipython.org/github/oscar6echo/ezvis3d/blob/master/demo_ezvisd3.ipynb). 11 | + a [Black and Scholes formula viewer](http://nbviewer.ipython.org/github/oscar6echo/ezvis3d/blob/master/BlackScholesViewer.ipynb). 12 | 13 | To install run from command line: 14 | ``` 15 | pip install ezvis3d 16 | ``` 17 | 18 | -------------------------------------------------------------------------------- /create_api_json.ipynb: -------------------------------------------------------------------------------- 1 | { 2 | "cells": [ 3 | { 4 | "cell_type": "code", 5 | "execution_count": 1, 6 | "metadata": {}, 7 | "outputs": [], 8 | "source": [ 9 | "import os, sys\n", 10 | "import pandas as pd" 11 | ] 12 | }, 13 | { 14 | "cell_type": "code", 15 | "execution_count": 2, 16 | "metadata": { 17 | "scrolled": false 18 | }, 19 | "outputs": [ 20 | { 21 | "data": { 22 | "text/html": [ 23 | "
\n", 24 | "\n", 25 | " \n", 26 | " \n", 27 | " \n", 28 | " \n", 29 | " \n", 30 | " \n", 31 | " \n", 32 | " \n", 33 | " \n", 34 | " \n", 35 | " \n", 36 | " \n", 37 | " \n", 38 | " \n", 39 | " \n", 40 | " \n", 41 | " \n", 42 | " \n", 43 | " \n", 44 | " \n", 45 | " \n", 46 | " \n", 47 | " \n", 48 | " \n", 49 | " \n", 50 | " \n", 51 | " \n", 52 | " \n", 53 | " \n", 54 | " \n", 55 | " \n", 56 | " \n", 57 | " \n", 58 | " \n", 59 | " \n", 60 | " \n", 61 | " \n", 62 | " \n", 63 | " \n", 64 | " \n", 65 | " \n", 66 | " \n", 67 | " \n", 68 | " \n", 69 | " \n", 70 | " \n", 71 | " \n", 72 | " \n", 73 | " \n", 74 | " \n", 75 | " \n", 76 | " \n", 77 | " \n", 78 | " \n", 79 | " \n", 80 | " \n", 81 | " \n", 82 | " \n", 83 | " \n", 84 | " \n", 85 | " \n", 86 | " \n", 87 | " \n", 88 | " \n", 89 | " \n", 90 | " \n", 91 | " \n", 92 | " \n", 93 | " \n", 94 | " \n", 95 | " \n", 96 | " \n", 97 | " \n", 98 | " \n", 99 | " \n", 100 | " \n", 101 | " \n", 102 | " \n", 103 | " \n", 104 | " \n", 105 | " \n", 106 | " \n", 107 | " \n", 108 | " \n", 109 | " \n", 110 | " \n", 111 | " \n", 112 | " \n", 113 | " \n", 114 | " \n", 115 | " \n", 116 | " \n", 117 | " \n", 118 | " \n", 119 | " \n", 120 | " \n", 121 | " \n", 122 | " \n", 123 | " \n", 124 | " \n", 125 | " \n", 126 | " \n", 127 | " \n", 128 | " \n", 129 | " \n", 130 | " \n", 131 | " \n", 132 | " \n", 133 | " \n", 134 | " \n", 135 | " \n", 136 | " \n", 137 | " \n", 138 | " \n", 139 | " \n", 140 | " \n", 141 | " \n", 142 | " \n", 143 | " \n", 144 | " \n", 145 | " \n", 146 | " \n", 147 | " \n", 148 | " \n", 149 | " \n", 150 | " \n", 151 | " \n", 152 | " \n", 153 | " \n", 154 | " \n", 155 | " \n", 156 | " \n", 157 | " \n", 158 | " \n", 159 | " \n", 160 | " \n", 161 | " \n", 162 | " \n", 163 | " \n", 164 | " \n", 165 | " \n", 166 | " \n", 167 | " \n", 168 | " \n", 169 | " \n", 170 | " \n", 171 | " \n", 172 | " \n", 173 | " \n", 174 | " \n", 175 | " \n", 176 | " \n", 177 | " \n", 178 | " \n", 179 | " \n", 180 | " \n", 181 | " \n", 182 | " \n", 183 | " \n", 184 | " \n", 185 | " \n", 186 | " \n", 187 | " \n", 188 | " \n", 189 | " \n", 190 | " \n", 191 | " \n", 192 | " \n", 193 | " \n", 194 | " \n", 195 | " \n", 196 | " \n", 197 | " \n", 198 | " \n", 199 | " \n", 200 | " \n", 201 | " \n", 202 | " \n", 203 | " \n", 204 | " \n", 205 | " \n", 206 | " \n", 207 | " \n", 208 | " \n", 209 | " \n", 210 | " \n", 211 | " \n", 212 | " \n", 213 | " \n", 214 | " \n", 215 | " \n", 216 | " \n", 217 | " \n", 218 | " \n", 219 | " \n", 220 | " \n", 221 | " \n", 222 | " \n", 223 | " \n", 224 | " \n", 225 | " \n", 226 | " \n", 227 | " \n", 228 | " \n", 229 | " \n", 230 | " \n", 231 | " \n", 232 | " \n", 233 | " \n", 234 | " \n", 235 | " \n", 236 | " \n", 237 | " \n", 238 | " \n", 239 | " \n", 240 | " \n", 241 | " \n", 242 | " \n", 243 | " \n", 244 | " \n", 245 | " \n", 246 | " \n", 247 | " \n", 248 | " \n", 249 | " \n", 250 | " \n", 251 | " \n", 252 | " \n", 253 | " \n", 254 | " \n", 255 | " \n", 256 | " \n", 257 | " \n", 258 | " \n", 259 | " \n", 260 | " \n", 261 | " \n", 262 | " \n", 263 | " \n", 264 | " \n", 265 | " \n", 266 | " \n", 267 | " \n", 268 | " \n", 269 | " \n", 270 | " \n", 271 | " \n", 272 | " \n", 273 | " \n", 274 | " \n", 275 | " \n", 276 | " \n", 277 | " \n", 278 | " \n", 279 | " \n", 280 | " \n", 281 | " \n", 282 | " \n", 283 | " \n", 284 | " \n", 285 | " \n", 286 | " \n", 287 | " \n", 288 | " \n", 289 | " \n", 290 | " \n", 291 | " \n", 292 | " \n", 293 | " \n", 294 | " \n", 295 | " \n", 296 | " \n", 297 | " \n", 298 | " \n", 299 | " \n", 300 | " \n", 301 | " \n", 302 | " \n", 303 | " \n", 304 | " \n", 305 | " \n", 306 | " \n", 307 | " \n", 308 | " \n", 309 | " \n", 310 | " \n", 311 | " \n", 312 | " \n", 313 | " \n", 314 | " \n", 315 | " \n", 316 | " \n", 317 | " \n", 318 | " \n", 319 | " \n", 320 | " \n", 321 | " \n", 322 | " \n", 323 | " \n", 324 | " \n", 325 | " \n", 326 | " \n", 327 | " \n", 328 | " \n", 329 | " \n", 330 | " \n", 331 | " \n", 332 | " \n", 333 | " \n", 334 | " \n", 335 | " \n", 336 | " \n", 337 | " \n", 338 | " \n", 339 | " \n", 340 | " \n", 341 | " \n", 342 | " \n", 343 | " \n", 344 | " \n", 345 | " \n", 346 | " \n", 347 | " \n", 348 | " \n", 349 | " \n", 350 | " \n", 351 | " \n", 352 | " \n", 353 | " \n", 354 | " \n", 355 | " \n", 356 | " \n", 357 | " \n", 358 | " \n", 359 | " \n", 360 | " \n", 361 | " \n", 362 | " \n", 363 | " \n", 364 | " \n", 365 | " \n", 366 | " \n", 367 | " \n", 368 | " \n", 369 | " \n", 370 | " \n", 371 | " \n", 372 | " \n", 373 | " \n", 374 | " \n", 375 | " \n", 376 | " \n", 377 | " \n", 378 | " \n", 379 | " \n", 380 | " \n", 381 | " \n", 382 | " \n", 383 | " \n", 384 | " \n", 385 | " \n", 386 | "
NameTypeDefaultDescription
0animationIntervalnumber1000The animation interval in milliseconds. This d...
1animationPreloadbooleanfalseIf false, the animation frames are loaded as s...
2animationAutoStartbooleanfalseIf true, the animation starts playing automati...
3axisColorstring'#4D4D4D'The color of the axis lines and the text along...
4backgroundColorstring or Object{fill: 'white', stroke: 'gray', strokeWidth: 1}The background color for the main area of the ...
5backgroundColor.fillstring'white'The chart fill color, as an HTML color string.
6backgroundColor.strokestring'gray'The color of the chart border, as an HTML colo...
7backgroundColor.strokeWidthnumber1The border width, in pixels.
8cameraPositionObject{horizontal: 1.0, vertical: 0.5, distance: 1.7}Set the initial rotation and position of the c...
9cameraPosition.horizontalnumber1.0Parameter horizontal is a value in radians and...
10cameraPosition.verticalnumber0.5Parameter vertical is a value in radians betwe...
11cameraPosition.distancenumber1.7Parameter distance is the (normalized) distanc...
12dataColorstring or object{fill: '#7DC1FF', stroke: '#3267D2', strokeWid...When dataColor is a string, it will set the co...
13dataColor.fillstring'#7DC1FF'The border color of the dots or bars. Applicab...
14dataColor.strokestring'#3267D2'The fill color of the dots or bars. Applicable...
15dataColor.strokeWidthnumber1The line width of dots, bars and lines. Applic...
16gridColorstring'#D3D3D3'The color of the grid lines.
17heightstring'400px'The height of the graph in pixels or as a perc...
18keepAspectRatiobooleantrueIf keepAspectRatio is true, the x-axis and the...
19showAnimationControlsbooleantrueIf true, animation controls are created at the...
20showGridbooleantrueIf true, grid lines are draw in the x-y surfac...
21showPerspectivebooleantrueIf true, the graph is drawn in perspective: po...
22showShadowbooleanfalseShow shadow on the graph.
23stylestring'dot'The style of the 3d graph. Available styles: b...
24tooltipboolean | functionfalseShow a tooltip showing the values of the hover...
25valueMaxnumbernoneThe maximum value for the value-axis. Only ava...
26valueMinnumbernoneThe minimum value for the value-axis. Only ava...
27verticalRationumber0.5A value between 0.1 and 1.0. This scales the v...
28widthstring'400px'The width of the graph in pixels or as a perce...
29xBarWidthnumbernoneThe width of bars in x direction. By default, ...
30xCenterstring'55%'The horizontal center position of the graph, a...
31xMaxnumbernoneThe maximum value for the x-axis.
32xMinnumbernoneThe minimum value for the x-axis.
33xStepnumbernoneStep size for the grid on the x-axis.
34xValueLabelfunctionnoneA function for custom formatting of the labels...
35yBarWidthnumbernoneThe width of bars in y direction. By default, ...
36yCenterstring'45%'The vertical center position of the graph, as ...
37yMaxnumbernoneThe maximum value for the y-axis.
38yMinnumbernoneThe minimum value for the y-axis.
39yStepnumbernoneStep size for the grid on the y-axis.
40yValueLabelfunctionnoneA function for custom formatting of the labels...
41zMinnumbernoneThe minimum value for the z-axis.
42zMaxnumbernoneThe maximum value for the z-axis.
43zStepnumbernoneStep size for the grid on the z-axis.
44zValueLabelfunctionnoneA function for custom formatting of the labels...
45xLabelStringxLabel on the X axis.
46yLabelStringyLabel on the Y axis.
47zLabelStringzLabel on the Z axis.
48filterLabelStringtimeLabel for the filter column.
49legendLabelStringvalueLabel for the style description.
\n", 387 | "
" 388 | ], 389 | "text/plain": [ 390 | " Name Type \\\n", 391 | "0 animationInterval number \n", 392 | "1 animationPreload boolean \n", 393 | "2 animationAutoStart boolean \n", 394 | "3 axisColor string \n", 395 | "4 backgroundColor string or Object \n", 396 | "5 backgroundColor.fill string \n", 397 | "6 backgroundColor.stroke string \n", 398 | "7 backgroundColor.strokeWidth number \n", 399 | "8 cameraPosition Object \n", 400 | "9 cameraPosition.horizontal number \n", 401 | "10 cameraPosition.vertical number \n", 402 | "11 cameraPosition.distance number \n", 403 | "12 dataColor string or object \n", 404 | "13 dataColor.fill string \n", 405 | "14 dataColor.stroke string \n", 406 | "15 dataColor.strokeWidth number \n", 407 | "16 gridColor string \n", 408 | "17 height string \n", 409 | "18 keepAspectRatio boolean \n", 410 | "19 showAnimationControls boolean \n", 411 | "20 showGrid boolean \n", 412 | "21 showPerspective boolean \n", 413 | "22 showShadow boolean \n", 414 | "23 style string \n", 415 | "24 tooltip boolean | function \n", 416 | "25 valueMax number \n", 417 | "26 valueMin number \n", 418 | "27 verticalRatio number \n", 419 | "28 width string \n", 420 | "29 xBarWidth number \n", 421 | "30 xCenter string \n", 422 | "31 xMax number \n", 423 | "32 xMin number \n", 424 | "33 xStep number \n", 425 | "34 xValueLabel function \n", 426 | "35 yBarWidth number \n", 427 | "36 yCenter string \n", 428 | "37 yMax number \n", 429 | "38 yMin number \n", 430 | "39 yStep number \n", 431 | "40 yValueLabel function \n", 432 | "41 zMin number \n", 433 | "42 zMax number \n", 434 | "43 zStep number \n", 435 | "44 zValueLabel function \n", 436 | "45 xLabel String \n", 437 | "46 yLabel String \n", 438 | "47 zLabel String \n", 439 | "48 filterLabel String \n", 440 | "49 legendLabel String \n", 441 | "\n", 442 | " Default \\\n", 443 | "0 1000 \n", 444 | "1 false \n", 445 | "2 false \n", 446 | "3 '#4D4D4D' \n", 447 | "4 {fill: 'white', stroke: 'gray', strokeWidth: 1} \n", 448 | "5 'white' \n", 449 | "6 'gray' \n", 450 | "7 1 \n", 451 | "8 {horizontal: 1.0, vertical: 0.5, distance: 1.7} \n", 452 | "9 1.0 \n", 453 | "10 0.5 \n", 454 | "11 1.7 \n", 455 | "12 {fill: '#7DC1FF', stroke: '#3267D2', strokeWid... \n", 456 | "13 '#7DC1FF' \n", 457 | "14 '#3267D2' \n", 458 | "15 1 \n", 459 | "16 '#D3D3D3' \n", 460 | "17 '400px' \n", 461 | "18 true \n", 462 | "19 true \n", 463 | "20 true \n", 464 | "21 true \n", 465 | "22 false \n", 466 | "23 'dot' \n", 467 | "24 false \n", 468 | "25 none \n", 469 | "26 none \n", 470 | "27 0.5 \n", 471 | "28 '400px' \n", 472 | "29 none \n", 473 | "30 '55%' \n", 474 | "31 none \n", 475 | "32 none \n", 476 | "33 none \n", 477 | "34 none \n", 478 | "35 none \n", 479 | "36 '45%' \n", 480 | "37 none \n", 481 | "38 none \n", 482 | "39 none \n", 483 | "40 none \n", 484 | "41 none \n", 485 | "42 none \n", 486 | "43 none \n", 487 | "44 none \n", 488 | "45 x \n", 489 | "46 y \n", 490 | "47 z \n", 491 | "48 time \n", 492 | "49 value \n", 493 | "\n", 494 | " Description \n", 495 | "0 The animation interval in milliseconds. This d... \n", 496 | "1 If false, the animation frames are loaded as s... \n", 497 | "2 If true, the animation starts playing automati... \n", 498 | "3 The color of the axis lines and the text along... \n", 499 | "4 The background color for the main area of the ... \n", 500 | "5 The chart fill color, as an HTML color string. \n", 501 | "6 The color of the chart border, as an HTML colo... \n", 502 | "7 The border width, in pixels. \n", 503 | "8 Set the initial rotation and position of the c... \n", 504 | "9 Parameter horizontal is a value in radians and... \n", 505 | "10 Parameter vertical is a value in radians betwe... \n", 506 | "11 Parameter distance is the (normalized) distanc... \n", 507 | "12 When dataColor is a string, it will set the co... \n", 508 | "13 The border color of the dots or bars. Applicab... \n", 509 | "14 The fill color of the dots or bars. Applicable... \n", 510 | "15 The line width of dots, bars and lines. Applic... \n", 511 | "16 The color of the grid lines. \n", 512 | "17 The height of the graph in pixels or as a perc... \n", 513 | "18 If keepAspectRatio is true, the x-axis and the... \n", 514 | "19 If true, animation controls are created at the... \n", 515 | "20 If true, grid lines are draw in the x-y surfac... \n", 516 | "21 If true, the graph is drawn in perspective: po... \n", 517 | "22 Show shadow on the graph. \n", 518 | "23 The style of the 3d graph. Available styles: b... \n", 519 | "24 Show a tooltip showing the values of the hover... \n", 520 | "25 The maximum value for the value-axis. Only ava... \n", 521 | "26 The minimum value for the value-axis. Only ava... \n", 522 | "27 A value between 0.1 and 1.0. This scales the v... \n", 523 | "28 The width of the graph in pixels or as a perce... \n", 524 | "29 The width of bars in x direction. By default, ... \n", 525 | "30 The horizontal center position of the graph, a... \n", 526 | "31 The maximum value for the x-axis. \n", 527 | "32 The minimum value for the x-axis. \n", 528 | "33 Step size for the grid on the x-axis. \n", 529 | "34 A function for custom formatting of the labels... \n", 530 | "35 The width of bars in y direction. By default, ... \n", 531 | "36 The vertical center position of the graph, as ... \n", 532 | "37 The maximum value for the y-axis. \n", 533 | "38 The minimum value for the y-axis. \n", 534 | "39 Step size for the grid on the y-axis. \n", 535 | "40 A function for custom formatting of the labels... \n", 536 | "41 The minimum value for the z-axis. \n", 537 | "42 The maximum value for the z-axis. \n", 538 | "43 Step size for the grid on the z-axis. \n", 539 | "44 A function for custom formatting of the labels... \n", 540 | "45 Label on the X axis. \n", 541 | "46 Label on the Y axis. \n", 542 | "47 Label on the Z axis. \n", 543 | "48 Label for the filter column. \n", 544 | "49 Label for the style description. " 545 | ] 546 | }, 547 | "execution_count": 2, 548 | "metadata": {}, 549 | "output_type": "execute_result" 550 | } 551 | ], 552 | "source": [ 553 | "df = pd.read_csv(os.path.join('ezvis3d', 'api', 'ezvis3d_option.tsv'), sep='\\t')\n", 554 | "df.to_json(os.path.join('ezvis3d', 'api', 'ezvis3d_option.json'), orient='records')\n", 555 | "df = pd.read_json(os.path.join('ezvis3d', 'api', 'ezvis3d_option.json'), orient='records')\n", 556 | "\n", 557 | "df = df[['Name', 'Type', 'Default', 'Description']]\n", 558 | "df" 559 | ] 560 | }, 561 | { 562 | "cell_type": "code", 563 | "execution_count": 3, 564 | "metadata": {}, 565 | "outputs": [ 566 | { 567 | "data": { 568 | "text/html": [ 569 | "
\n", 570 | "\n", 571 | " \n", 572 | " \n", 573 | " \n", 574 | " \n", 575 | " \n", 576 | " \n", 577 | " \n", 578 | " \n", 579 | " \n", 580 | " \n", 581 | " \n", 582 | " \n", 583 | " \n", 584 | " \n", 585 | " \n", 586 | " \n", 587 | " \n", 588 | " \n", 589 | " \n", 590 | " \n", 591 | " \n", 592 | " \n", 593 | " \n", 594 | " \n", 595 | " \n", 596 | " \n", 597 | " \n", 598 | " \n", 599 | " \n", 600 | " \n", 601 | " \n", 602 | " \n", 603 | " \n", 604 | " \n", 605 | " \n", 606 | " \n", 607 | " \n", 608 | " \n", 609 | " \n", 610 | " \n", 611 | " \n", 612 | " \n", 613 | " \n", 614 | " \n", 615 | " \n", 616 | " \n", 617 | " \n", 618 | " \n", 619 | " \n", 620 | " \n", 621 | " \n", 622 | " \n", 623 | " \n", 624 | " \n", 625 | " \n", 626 | " \n", 627 | " \n", 628 | " \n", 629 | "
MethodReturn TypeDescription
0animationStart()noneStart playing the animation. Only applicable w...
1animationStop()noneStop playing the animation. Only applicable wh...
2getCameraPosition()An object with parameters horizontal, vertical...Returns an object with parameters horizontal, ...
3redraw()noneRedraw the graph. Useful after the camera posi...
4setData(data)noneReplace the data in the Graph3d.
5setOptions(options)noneUpdate options of Graph3d. The provided option...
6setSize(width, height)noneParameters width and height are strings, conta...
7setCameraPosition (pos){horizontal: 1.0, vertical: 0.5, distance: 1.7}Set the rotation and position of the camera. P...
\n", 630 | "
" 631 | ], 632 | "text/plain": [ 633 | " Method Return Type \\\n", 634 | "0 animationStart() none \n", 635 | "1 animationStop() none \n", 636 | "2 getCameraPosition() An object with parameters horizontal, vertical... \n", 637 | "3 redraw() none \n", 638 | "4 setData(data) none \n", 639 | "5 setOptions(options) none \n", 640 | "6 setSize(width, height) none \n", 641 | "7 setCameraPosition (pos) {horizontal: 1.0, vertical: 0.5, distance: 1.7} \n", 642 | "\n", 643 | " Description \n", 644 | "0 Start playing the animation. Only applicable w... \n", 645 | "1 Stop playing the animation. Only applicable wh... \n", 646 | "2 Returns an object with parameters horizontal, ... \n", 647 | "3 Redraw the graph. Useful after the camera posi... \n", 648 | "4 Replace the data in the Graph3d. \n", 649 | "5 Update options of Graph3d. The provided option... \n", 650 | "6 Parameters width and height are strings, conta... \n", 651 | "7 Set the rotation and position of the camera. P... " 652 | ] 653 | }, 654 | "execution_count": 3, 655 | "metadata": {}, 656 | "output_type": "execute_result" 657 | } 658 | ], 659 | "source": [ 660 | "df = pd.read_csv(os.path.join('ezvis3d', 'api', 'ezvis3d_method.tsv'), sep='\\t')\n", 661 | "df.to_json(os.path.join('ezvis3d', 'api', 'ezvis3d_method.json'), orient='records')\n", 662 | "df = pd.read_json(os.path.join('ezvis3d', 'api', 'ezvis3d_method.json'), orient='records')\n", 663 | "\n", 664 | "df = df[['Method', 'Return Type', 'Description']]\n", 665 | "df" 666 | ] 667 | }, 668 | { 669 | "cell_type": "code", 670 | "execution_count": 4, 671 | "metadata": {}, 672 | "outputs": [ 673 | { 674 | "data": { 675 | "text/html": [ 676 | "
\n", 677 | "\n", 678 | " \n", 679 | " \n", 680 | " \n", 681 | " \n", 682 | " \n", 683 | " \n", 684 | " \n", 685 | " \n", 686 | " \n", 687 | " \n", 688 | " \n", 689 | " \n", 690 | " \n", 691 | " \n", 692 | " \n", 693 | " \n", 694 | " \n", 695 | " \n", 696 | " \n", 697 | " \n", 698 | " \n", 699 | " \n", 700 | " \n", 701 | " \n", 702 | " \n", 703 | " \n", 704 | " \n", 705 | " \n", 706 | " \n", 707 | " \n", 708 | " \n", 709 | " \n", 710 | " \n", 711 | " \n", 712 | " \n", 713 | " \n", 714 | " \n", 715 | " \n", 716 | " \n", 717 | " \n", 718 | " \n", 719 | " \n", 720 | " \n", 721 | " \n", 722 | " \n", 723 | " \n", 724 | "
NameTypeRequiredDescription
0xnumberyesLocation on the x-axis.
1ynumberyesLocation on the y-axis.
2znumberyesLocation on the z-axis.
3stylenumbernoThe data value, required for graph styles dot-...
4filter*noFilter values used for the animation. This col...
\n", 725 | "
" 726 | ], 727 | "text/plain": [ 728 | " Name Type Required Description\n", 729 | "0 x number yes Location on the x-axis.\n", 730 | "1 y number yes Location on the y-axis.\n", 731 | "2 z number yes Location on the z-axis.\n", 732 | "3 style number no The data value, required for graph styles dot-...\n", 733 | "4 filter * no Filter values used for the animation. This col..." 734 | ] 735 | }, 736 | "execution_count": 4, 737 | "metadata": {}, 738 | "output_type": "execute_result" 739 | } 740 | ], 741 | "source": [ 742 | "df = pd.read_csv(os.path.join('ezvis3d', 'api', 'ezvis3d_dataset.tsv'), sep='\\t')\n", 743 | "df.to_json(os.path.join('ezvis3d', 'api', 'ezvis3d_dataset.json'), orient='records')\n", 744 | "df = pd.read_json(os.path.join('ezvis3d', 'api', 'ezvis3d_dataset.json'), orient='records')\n", 745 | "\n", 746 | "df = df[['Name', 'Type', 'Required', 'Description']]\n", 747 | "df" 748 | ] 749 | }, 750 | { 751 | "cell_type": "code", 752 | "execution_count": null, 753 | "metadata": { 754 | "collapsed": true 755 | }, 756 | "outputs": [], 757 | "source": [] 758 | } 759 | ], 760 | "metadata": { 761 | "kernelspec": { 762 | "display_name": "Python 3", 763 | "language": "python", 764 | "name": "python3" 765 | }, 766 | "language_info": { 767 | "codemirror_mode": { 768 | "name": "ipython", 769 | "version": 3 770 | }, 771 | "file_extension": ".py", 772 | "mimetype": "text/x-python", 773 | "name": "python", 774 | "nbconvert_exporter": "python", 775 | "pygments_lexer": "ipython3", 776 | "version": "3.6.1" 777 | } 778 | }, 779 | "nbformat": 4, 780 | "nbformat_minor": 1 781 | } 782 | -------------------------------------------------------------------------------- /ezvis3d/__init__.py: -------------------------------------------------------------------------------- 1 | 2 | 3 | from ._config import load_js_libs 4 | from ._vis3d import Vis3d 5 | 6 | 7 | __all__ = ['Vis3d'] 8 | 9 | 10 | load_js_libs() 11 | -------------------------------------------------------------------------------- /ezvis3d/__meta__.py: -------------------------------------------------------------------------------- 1 | 2 | __name__ = 'ezvis3d' 3 | name_url = __name__.replace('_', '-') 4 | 5 | __version__ = '0.2.5' 6 | __description__ = 'easy vis.js Graph3d js library wrapper, accessible from pandas dataframes in the IPython notebook' 7 | __long_description__ = 'See github repo' 8 | __author__ = 'oscar6echo' 9 | __author_email__ = 'olivier.borderies@gmail.com' 10 | __url__ = 'https://github.com/{}/{}'.format(__author__, 11 | name_url) 12 | __download_url__ = 'https://github.com/{}/{}/tarball/{}'.format(__author__, 13 | name_url, 14 | __version__) 15 | __keywords__ = ['vis.js', 'Graph3d', 'pandas', 'notebook', 'javascript'] 16 | __license__ = 'MIT' 17 | __classifiers__ = ['Development Status :: 4 - Beta', 18 | 'License :: OSI Approved :: MIT License', 19 | 'Programming Language :: Python :: 2.7', 20 | 'Programming Language :: Python :: 3.5', 21 | 'Programming Language :: Python :: 3.6' 22 | ] 23 | __include_package_data__ = True 24 | __package_data__ = { 25 | 'api': 26 | ['api/ezvis3d_dataset.json', 27 | 'api/ezvis3d_dataset.tsv', 28 | 'api/ezvis3d_method.json', 29 | 'api/ezvis3d_method.tsv', 30 | 'api/ezvis3d_option.json', 31 | 'api/ezvis3d_option.tsv' 32 | ] 33 | } 34 | __zip_safe__ = False 35 | __entry_points__ = {} 36 | -------------------------------------------------------------------------------- /ezvis3d/_config.py: -------------------------------------------------------------------------------- 1 | 2 | import json 3 | from IPython.display import HTML, display 4 | 5 | 6 | 7 | JS_LIBS_ONE = json.dumps([ 8 | # 'https://cdnjs.cloudflare.com/ajax/libs/vis/4.7.0/vis.js', 9 | 'https://cdnjs.cloudflare.com/ajax/libs/vis/4.21.0/vis.min.js' 10 | ]) 11 | 12 | JS_LIBS_ONE_sep = ';'.join(map(lambda x: 'console.log("'+x+'")', json.loads(JS_LIBS_ONE)))+';' 13 | 14 | # CSS_LIBS_ONE = 'https://cdnjs.cloudflare.com/ajax/libs/vis/4.7.0/vis.css' 15 | CSS_LIBS_ONE = 'https://cdnjs.cloudflare.com/ajax/libs/vis/4.21.0/vis.min.css' 16 | 17 | 18 | JS_LOAD = """""" % (JS_LIBS_ONE, JS_LIBS_ONE_sep) 27 | 28 | 29 | def load_js_libs(): 30 | display(HTML(JS_LOAD)) 31 | 32 | 33 | 34 | JS_SAVE = [ 35 | 'https://cdnjs.cloudflare.com/ajax/libs/require.js/2.1.17/require.js', 36 | 'https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.4/jquery.min.js', 37 | ] 38 | 39 | 40 | API_DIR = 'api' 41 | SCRIPTS_DIR = 'scripts' 42 | 43 | VIS3D_OPTION_FILE = 'ezvis3d_option.json' 44 | VIS3D_METHOD_FILE = 'ezvis3d_method.json' 45 | VIS3D_DATASET_FILE = 'ezvis3d_dataset.json' 46 | 47 | NAME = 'Name' 48 | TYPE = 'Type' 49 | DEFAULT = 'Default' 50 | DESCRIPTION = 'Description' 51 | 52 | 53 | -------------------------------------------------------------------------------- /ezvis3d/_plot.py: -------------------------------------------------------------------------------- 1 | 2 | import os 3 | import pandas as pd 4 | import datetime as dt 5 | import uuid 6 | from IPython.display import HTML 7 | 8 | 9 | from ._config import JS_LIBS_ONE, CSS_LIBS_ONE, JS_SAVE 10 | from .scripts import JS_JSON_PARSE_OPTION, JS_JSON_PARSE_DATA 11 | 12 | 13 | def html(data, options, center=False, save=False, 14 | save_name=None, save_path='saved', dated=True, notebook=True): 15 | """ 16 | save=True will create a standalone HTML doc under localdir/saved (creating folfer save if necessary) 17 | center=True will center the plot in the output cell, otherwise left-aligned by default. 18 | """ 19 | 20 | def json_dumps(obj): 21 | return pd.io.json.dumps(obj) 22 | 23 | _options = dict(options) 24 | _data = data 25 | 26 | def clean_function_str(key, n=15): 27 | """ 28 | Remove new line characters in the first say 15 characters 29 | of the value corresponding to key in dictionary _options. 30 | This value is a string that potentially starts with 31 | 'function' or ' function' or '[newline]function' or '[newline]function', etc 32 | This cleaning makes js string parsing easier to recognize functions. 33 | """ 34 | if key in _options.keys(): 35 | new_str = _options[key][:n].replace('\n', '') 36 | new_str = new_str.replace('\r', '') 37 | new_str = new_str + _options[key][n:] 38 | _options[key] = new_str 39 | 40 | clean_function_str('tooltip') 41 | clean_function_str('xValueLabel') 42 | clean_function_str('yValueLabel') 43 | clean_function_str('zValueLabel') 44 | 45 | chart_id = str(uuid.uuid4()).replace('-', '_') 46 | 47 | js_init = """ 48 | var options = %s; 49 | %s 50 | window.opt = jQuery.extend(true, {}, options); 51 | console.log('vis3d options accessible as opt'); 52 | 53 | var data = %s; 54 | %s 55 | window.dta = jQuery.extend(true, [], data); 56 | console.log('vis3d data accessible as dta'); 57 | """ % (json_dumps(_options), JS_JSON_PARSE_OPTION, 58 | json_dumps(_data), JS_JSON_PARSE_DATA) 59 | 60 | js_call = """ 61 | var container = document.getElementById('%s'); 62 | console.log(options); 63 | console.log(data); 64 | graph3d = new vis.Graph3d(container, data, options); 65 | """ % (chart_id) 66 | 67 | if center: 68 | if not 'width' in _options.keys(): 69 | # Explicitly sets width to default value 70 | _options['width'] = '750px' 71 | 72 | html = """ 73 |
74 | """ % (chart_id, _options['width']) 75 | else: 76 | html = """ 77 |
78 | """ % (chart_id) 79 | 80 | css = """ 81 | 82 | """ % (CSS_LIBS_ONE) 83 | 84 | js = """""" % (JS_LIBS_ONE, js_init, js_call) 94 | 95 | # save 96 | js_load = ''.join(['' % e for e in JS_SAVE]) 97 | if save == True: 98 | if not os.path.exists(save_path): 99 | os.makedirs(save_path) 100 | tag = save_name if save_name else 'plot' 101 | dated = dt.datetime.now().strftime('_%Y%m%d_%H%M%S') if dated else '' 102 | 103 | with open(os.path.join(save_path, tag + dated + '.html'), 'w') as f: 104 | f.write(js_load + html + js) 105 | 106 | if notebook: 107 | return html + js 108 | else: 109 | return js_load + html + js 110 | 111 | return html + css + js 112 | 113 | 114 | def plot(data, options, center=False, save=False, 115 | save_name=None, save_path='saved', dated=True, notebook=True): 116 | contents = html(data, options, center, save=save, 117 | save_name=save_name, save_path=save_path, dated=dated, notebook=notebook) 118 | return HTML(contents) 119 | -------------------------------------------------------------------------------- /ezvis3d/_state.py: -------------------------------------------------------------------------------- 1 | 2 | import os 3 | import json 4 | from ._config import VIS3D_OPTION_FILE, VIS3D_METHOD_FILE, VIS3D_DATASET_FILE, \ 5 | API_DIR 6 | 7 | 8 | def load_resource(src): 9 | _dir = os.path.dirname(__file__) 10 | object_builder_file = os.path.join(_dir, API_DIR, src) 11 | with open(object_builder_file, encoding='UTF-8') as obj_build: 12 | return json.load(obj_build) 13 | 14 | 15 | class State(object): 16 | """ 17 | Contains all 'ezvis3d' API, options and methods 18 | """ 19 | 20 | def __init__(self): 21 | self._OPTION = load_resource(VIS3D_OPTION_FILE) 22 | self._METHOD = load_resource(VIS3D_METHOD_FILE) 23 | self._DATASET = load_resource(VIS3D_DATASET_FILE) 24 | 25 | state_VIS3D = State() 26 | 27 | -------------------------------------------------------------------------------- /ezvis3d/_vis3d.py: -------------------------------------------------------------------------------- 1 | 2 | from ._wrapper import Wrapper 3 | from ._plot import plot, html 4 | 5 | 6 | class Vis3d(Wrapper): 7 | """ 8 | Main vis3d Object 9 | 10 | Examples: http://visjs.org/graph3d_examples.html 11 | Docs: http://visjs.org/docs/graph3d/ 12 | """ 13 | 14 | def __init__(self): 15 | Wrapper.__init__(self) 16 | 17 | # default config 18 | # self.width = '600px' 19 | # self.height = '600px' 20 | 21 | def plot(self, df_data, center=False, save=False, 22 | save_name=None, save_path='saved', dated=True, notebook=True): 23 | "df_data format is a dataframe with columns x, y, z (required), and style, filter (optional)" 24 | data = df_data.to_json(orient='records') 25 | options = self.to_dict() 26 | return plot(data, options, center=center, save=save, 27 | save_name=save_name, save_path=save_path, dated=dated, notebook=notebook) 28 | 29 | def html(self, df_data, center=False, save=False, 30 | save_name=None, save_path='saved', dated=True, notebook=True): 31 | "df_data format is a dataframe with columns x, y, z (required), and style, filter (optional)" 32 | data = df_data.to_json(orient='records') 33 | options = self.to_dict() 34 | return html(data, options, center=center, save=save, 35 | save_name=save_name, save_path=save_path, dated=dated, notebook=notebook) 36 | -------------------------------------------------------------------------------- /ezvis3d/_wrapper.py: -------------------------------------------------------------------------------- 1 | 2 | from IPython.display import HTML, display 3 | 4 | from ._config import NAME, TYPE, DEFAULT, DESCRIPTION 5 | from ._state import State, state_VIS3D 6 | 7 | 8 | 9 | class Wrapper(object): 10 | 11 | def __init__(self, path=''): 12 | self.path = path 13 | self.state = state_VIS3D 14 | 15 | 16 | def __getattr__(self, item): 17 | _path = item if not self.path else self.path+'.'+item 18 | for attr in self.state._OPTION: 19 | if _path == attr.get(NAME): 20 | var = Wrapper(_path) 21 | if len(dir(var)): 22 | setattr(self, item, var) 23 | # setattr(self, item, var if len(dir(var)) else '') 24 | return var 25 | 26 | 27 | def __dir__(self): 28 | _dir = [] 29 | _path = self.path.split('.') 30 | if len(_path)==1 and self.path is '': 31 | for attr in self.state._OPTION: 32 | if len(attr.get(NAME).split('.')) == 1: 33 | _dir.append(attr.get(NAME)) 34 | else: 35 | for attr in self.state._OPTION: 36 | _attr_path = attr.get(NAME).split('.') 37 | if len(_path) < len(_attr_path): 38 | if _path[len(_path)-1] == _attr_path[len(_path)-1] \ 39 | and len(_attr_path) == len(_path)+1: 40 | _dir.append(_attr_path[len(_path)]) 41 | return _dir 42 | 43 | 44 | def to_dict(self): 45 | _dic = dict(self.__dict__) 46 | _dic.pop('path') 47 | 48 | for k in list(_dic.keys()): 49 | if isinstance(_dic[k], list): 50 | for i, e in enumerate(_dic[k]): 51 | if isinstance(e, Wrapper): 52 | _dic[k][i] = _dic[k][i].to_dict() 53 | elif isinstance(e, dict): 54 | pass 55 | elif _dic[k][i]=={} or _dic[k][i]==None or isinstance(_dic[k][i], State): 56 | _dic[k].pop(i) 57 | else: 58 | if isinstance(_dic[k], Wrapper): 59 | _dic[k] = _dic[k].to_dict() 60 | elif isinstance(_dic[k], dict): 61 | pass 62 | elif _dic[k]=={} or _dic[k]==None or isinstance(_dic[k], State): 63 | _dic.pop(k) 64 | 65 | return _dic 66 | 67 | 68 | @property 69 | def __doc__(self): 70 | for attr in self.state._OPTION: 71 | if self.path == attr.get(NAME): 72 | _type = attr.get(TYPE) 73 | _default = attr.get(DEFAULT) 74 | _desc = attr.get(DESCRIPTION) 75 | break 76 | 77 | doc = "Documentation for '%s'\n\n" % self.path + \ 78 | "Type\n%s\n\n" % _type + \ 79 | "Default\n%s\n\n" % _default + \ 80 | "Description\n%s\n\n" % _desc 81 | 82 | return doc 83 | 84 | 85 | def info(self): 86 | if self.path !='': 87 | for attr in self.state._OPTION: 88 | if self.path == attr.get(NAME): 89 | _type = attr.get(TYPE) 90 | _default = attr.get(DEFAULT) 91 | _desc = attr.get(DESCRIPTION) 92 | break 93 | 94 | doc = "

Documentation for '%s'


" % self.path + \ 95 | "
  • Type
  • %s

    " % _type + \ 96 | "
  • Default
  • %s

    " % _default + \ 97 | "
  • Description
  • %s

    " % _desc 98 | 99 | display(HTML(doc)) 100 | 101 | -------------------------------------------------------------------------------- /ezvis3d/api/ezvis3d_dataset.json: -------------------------------------------------------------------------------- 1 | [{"Name":"x","Type":"number","Required":"yes","Description":"Location on the x-axis."},{"Name":"y","Type":"number","Required":"yes","Description":"Location on the y-axis."},{"Name":"z","Type":"number","Required":"yes","Description":"Location on the z-axis."},{"Name":"style","Type":"number","Required":"no","Description":"The data value, required for graph styles dot-color and dot-size."},{"Name":"filter","Type":"*","Required":"no","Description":"Filter values used for the animation. This column may have any type, such as a number, string, or Date."}] -------------------------------------------------------------------------------- /ezvis3d/api/ezvis3d_dataset.tsv: -------------------------------------------------------------------------------- 1 | Name Type Required Description 2 | x number yes Location on the x-axis. 3 | y number yes Location on the y-axis. 4 | z number yes Location on the z-axis. 5 | style number no The data value, required for graph styles dot-color and dot-size. 6 | filter * no Filter values used for the animation. This column may have any type, such as a number, string, or Date. -------------------------------------------------------------------------------- /ezvis3d/api/ezvis3d_method.json: -------------------------------------------------------------------------------- 1 | [{"Method":"animationStart()","Return Type":"none","Description":"Start playing the animation. Only applicable when animation data is available."},{"Method":"animationStop()","Return Type":"none","Description":"Stop playing the animation. Only applicable when animation data is available."},{"Method":"getCameraPosition()","Return Type":"An object with parameters horizontal, vertical and distance","Description":"Returns an object with parameters horizontal, vertical and distance, which each one of them is a number, representing the rotation and position of the camera."},{"Method":"redraw()","Return Type":"none","Description":"Redraw the graph. Useful after the camera position is changed externally, when data is changed, or when the layout of the webpage changed."},{"Method":"setData(data)","Return Type":"none","Description":"Replace the data in the Graph3d."},{"Method":"setOptions(options)","Return Type":"none","Description":"Update options of Graph3d. The provided options will be merged with current options."},{"Method":"setSize(width, height)","Return Type":"none","Description":"Parameters width and height are strings, containing a new size for the graph. Size can be provided in pixels or in percentages."},{"Method":"setCameraPosition (pos)","Return Type":"{horizontal: 1.0, vertical: 0.5, distance: 1.7}","Description":"Set the rotation and position of the camera. Parameter pos is an object which contains three parameters: horizontal, vertical, and distance. Parameter horizontal is a value in radians and can have any value (but normally in the range of 0 and 2*Pi). Parameter vertical is a value in radians between 0 and 0.5*Pi. Parameter distance is the (normalized) distance from the camera to the center of the graph, in the range of 0.71 to 5.0. A larger distance puts the graph further away, making it smaller. All parameters are optional."}] -------------------------------------------------------------------------------- /ezvis3d/api/ezvis3d_method.tsv: -------------------------------------------------------------------------------- 1 | Method Return Type Description 2 | animationStart() none Start playing the animation. Only applicable when animation data is available. 3 | animationStop() none Stop playing the animation. Only applicable when animation data is available. 4 | getCameraPosition() An object with parameters horizontal, vertical and distance Returns an object with parameters horizontal, vertical and distance, which each one of them is a number, representing the rotation and position of the camera. 5 | redraw() none Redraw the graph. Useful after the camera position is changed externally, when data is changed, or when the layout of the webpage changed. 6 | setData(data) none Replace the data in the Graph3d. 7 | setOptions(options) none Update options of Graph3d. The provided options will be merged with current options. 8 | setSize(width, height) none Parameters width and height are strings, containing a new size for the graph. Size can be provided in pixels or in percentages. 9 | setCameraPosition (pos) {horizontal: 1.0, vertical: 0.5, distance: 1.7} Set the rotation and position of the camera. Parameter pos is an object which contains three parameters: horizontal, vertical, and distance. Parameter horizontal is a value in radians and can have any value (but normally in the range of 0 and 2*Pi). Parameter vertical is a value in radians between 0 and 0.5*Pi. Parameter distance is the (normalized) distance from the camera to the center of the graph, in the range of 0.71 to 5.0. A larger distance puts the graph further away, making it smaller. All parameters are optional. -------------------------------------------------------------------------------- /ezvis3d/api/ezvis3d_option.json: -------------------------------------------------------------------------------- 1 | [{"Name":"animationInterval","Type":"number","Default":"1000","Description":"The animation interval in milliseconds. This determines how fast the animation runs."},{"Name":"animationPreload","Type":"boolean","Default":"false","Description":"If false, the animation frames are loaded as soon as they are requested. if animationPreload is true, the graph will automatically load all frames in the background, resulting in a smoother animation as soon as all frames are loaded. The load progress is shown on screen."},{"Name":"animationAutoStart","Type":"boolean","Default":"false","Description":"If true, the animation starts playing automatically after the graph is created."},{"Name":"axisColor","Type":"string","Default":"'#4D4D4D'","Description":"The color of the axis lines and the text along the axis."},{"Name":"backgroundColor","Type":"string or Object","Default":"{fill: 'white', stroke: 'gray', strokeWidth: 1}","Description":"The background color for the main area of the chart. Can be either a simple HTML color string, for example: 'red' or '#00cc00', or an object with the following properties."},{"Name":"backgroundColor.fill","Type":"string","Default":"'white'","Description":"The chart fill color, as an HTML color string."},{"Name":"backgroundColor.stroke","Type":"string","Default":"'gray'","Description":"The color of the chart border, as an HTML color string."},{"Name":"backgroundColor.strokeWidth","Type":"number","Default":"1","Description":"The border width, in pixels."},{"Name":"cameraPosition","Type":"Object","Default":"{horizontal: 1.0, vertical: 0.5, distance: 1.7}","Description":"Set the initial rotation and position of the camera. The object cameraPosition contains three parameters: horizontal, vertical, and distance. Parameter horizontal is a value in radians and can have any value (but normally in the range of 0 and 2*Pi). Parameter vertical is a value in radians between 0 and 0.5*Pi. Parameter distance is the (normalized) distance from the camera to the center of the graph, in the range of 0.71 to 5.0. A larger distance puts the graph further away, making it smaller. All parameters are optional."},{"Name":"cameraPosition.horizontal","Type":"number","Default":"1.0","Description":"Parameter horizontal is a value in radians and can have any value (but normally in the range of 0 and 2*Pi). This parameter is optional."},{"Name":"cameraPosition.vertical","Type":"number","Default":"0.5","Description":"Parameter vertical is a value in radians between 0 and 0.5*Pi. This parameter is optional."},{"Name":"cameraPosition.distance","Type":"number","Default":"1.7","Description":"Parameter distance is the (normalized) distance from the camera to the center of the graph, in the range of 0.71 to 5.0. A larger distance puts the graph further away, making it smaller. This parameter is optional."},{"Name":"dataColor","Type":"string or object","Default":"{fill: '#7DC1FF', stroke: '#3267D2', strokeWidth: 1}","Description":"When dataColor is a string, it will set the color for both border and fill color of dots and bars. Applicable for styles dot-size, bar-size, and line. When an object, it can contain the properties descibed below."},{"Name":"dataColor.fill","Type":"string","Default":"'#7DC1FF'","Description":"The border color of the dots or bars. Applicable when using styles dot-size or bar-size."},{"Name":"dataColor.stroke","Type":"string","Default":"'#3267D2'","Description":"The fill color of the dots or bars. Applicable when using styles dot-size, bar-size, or line."},{"Name":"dataColor.strokeWidth","Type":"number","Default":"1","Description":"The line width of dots, bars and lines. Applicable for all styles."},{"Name":"gridColor","Type":"string","Default":"'#D3D3D3'","Description":"The color of the grid lines."},{"Name":"height","Type":"string","Default":"'400px'","Description":"The height of the graph in pixels or as a percentage."},{"Name":"keepAspectRatio","Type":"boolean","Default":"true","Description":"If keepAspectRatio is true, the x-axis and the y-axis keep their aspect ratio. If false, the axes are scaled such that they both have the same, maximum with."},{"Name":"showAnimationControls","Type":"boolean","Default":"true","Description":"If true, animation controls are created at the bottom of the Graph. The animation controls consists of buttons previous, start\/stop, next, and a slider showing the current frame. Only applicable when the provided data contains an animation."},{"Name":"showGrid","Type":"boolean","Default":"true","Description":"If true, grid lines are draw in the x-y surface (the bottom of the 3d graph)."},{"Name":"showPerspective","Type":"boolean","Default":"true","Description":"If true, the graph is drawn in perspective: points and lines which are further away are drawn smaller. Note that the graph currently does not support a gray colored bottom side when drawn in perspective."},{"Name":"showShadow","Type":"boolean","Default":"false","Description":"Show shadow on the graph."},{"Name":"style","Type":"string","Default":"'dot'","Description":"The style of the 3d graph. Available styles: bar, bar-color, bar-size, dot, dot-line, dot-color, dot-size, line, grid, or surface"},{"Name":"tooltip","Type":"boolean | function","Default":"false","Description":"Show a tooltip showing the values of the hovered data point. The contents of the tooltip can be customized by providing a callback function as tooltip. In this case the function is called with an object containing parameters x, y, and z argument, and must return a string which may contain HTML."},{"Name":"valueMax","Type":"number","Default":"none","Description":"The maximum value for the value-axis. Only available in combination with the styles dot-color and dot-size."},{"Name":"valueMin","Type":"number","Default":"none","Description":"The minimum value for the value-axis. Only available in combination with the styles dot-color and dot-size."},{"Name":"verticalRatio","Type":"number","Default":"0.5","Description":"A value between 0.1 and 1.0. This scales the vertical size of the graph When keepAspectRatio is set to false, and verticalRatio is set to 1.0, the graph will be a cube."},{"Name":"width","Type":"string","Default":"'400px'","Description":"The width of the graph in pixels or as a percentage."},{"Name":"xBarWidth","Type":"number","Default":"none","Description":"The width of bars in x direction. By default, the width is equal to the distance between the data points, such that bars adjoin each other. Only applicable for styles 'bar' and 'bar-color'."},{"Name":"xCenter","Type":"string","Default":"'55%'","Description":"The horizontal center position of the graph, as a percentage or in pixels."},{"Name":"xMax","Type":"number","Default":"none","Description":"The maximum value for the x-axis."},{"Name":"xMin","Type":"number","Default":"none","Description":"The minimum value for the x-axis."},{"Name":"xStep","Type":"number","Default":"none","Description":"Step size for the grid on the x-axis."},{"Name":"xValueLabel","Type":"function","Default":"none","Description":"A function for custom formatting of the labels along the x-axis, for example function (x) {return (x * 100) + '%'}."},{"Name":"yBarWidth","Type":"number","Default":"none","Description":"The width of bars in y direction. By default, the width is equal to the distance between the data points, such that bars adjoin each other. Only applicable for styles 'bar' and 'bar-color'."},{"Name":"yCenter","Type":"string","Default":"'45%'","Description":"The vertical center position of the graph, as a percentage or in pixels."},{"Name":"yMax","Type":"number","Default":"none","Description":"The maximum value for the y-axis."},{"Name":"yMin","Type":"number","Default":"none","Description":"The minimum value for the y-axis."},{"Name":"yStep","Type":"number","Default":"none","Description":"Step size for the grid on the y-axis."},{"Name":"yValueLabel","Type":"function","Default":"none","Description":"A function for custom formatting of the labels along the y-axis, for example function (y) {return (y * 100) + '%'}."},{"Name":"zMin","Type":"number","Default":"none","Description":"The minimum value for the z-axis."},{"Name":"zMax","Type":"number","Default":"none","Description":"The maximum value for the z-axis."},{"Name":"zStep","Type":"number","Default":"none","Description":"Step size for the grid on the z-axis."},{"Name":"zValueLabel","Type":"function","Default":"none","Description":"A function for custom formatting of the labels along the z-axis, for example function (z) {return (z * 100) + '%'}."},{"Name":"xLabel","Type":"String","Default":"x","Description":"Label on the X axis."},{"Name":"yLabel","Type":"String","Default":"y","Description":"Label on the Y axis."},{"Name":"zLabel","Type":"String","Default":"z","Description":"Label on the Z axis."},{"Name":"filterLabel","Type":"String","Default":"time","Description":"Label for the filter column."},{"Name":"legendLabel","Type":"String","Default":"value","Description":"Label for the style description."}] -------------------------------------------------------------------------------- /ezvis3d/api/ezvis3d_option.tsv: -------------------------------------------------------------------------------- 1 | Name Type Default Description 2 | animationInterval number 1000 The animation interval in milliseconds. This determines how fast the animation runs. 3 | animationPreload boolean false If false, the animation frames are loaded as soon as they are requested. if animationPreload is true, the graph will automatically load all frames in the background, resulting in a smoother animation as soon as all frames are loaded. The load progress is shown on screen. 4 | animationAutoStart boolean false If true, the animation starts playing automatically after the graph is created. 5 | axisColor string '#4D4D4D' The color of the axis lines and the text along the axis. 6 | backgroundColor string or Object {fill: 'white', stroke: 'gray', strokeWidth: 1} The background color for the main area of the chart. Can be either a simple HTML color string, for example: 'red' or '#00cc00', or an object with the following properties. 7 | backgroundColor.fill string 'white' The chart fill color, as an HTML color string. 8 | backgroundColor.stroke string 'gray' The color of the chart border, as an HTML color string. 9 | backgroundColor.strokeWidth number 1 The border width, in pixels. 10 | cameraPosition Object {horizontal: 1.0, vertical: 0.5, distance: 1.7} Set the initial rotation and position of the camera. The object cameraPosition contains three parameters: horizontal, vertical, and distance. Parameter horizontal is a value in radians and can have any value (but normally in the range of 0 and 2*Pi). Parameter vertical is a value in radians between 0 and 0.5*Pi. Parameter distance is the (normalized) distance from the camera to the center of the graph, in the range of 0.71 to 5.0. A larger distance puts the graph further away, making it smaller. All parameters are optional. 11 | cameraPosition.horizontal number 1.0 Parameter horizontal is a value in radians and can have any value (but normally in the range of 0 and 2*Pi). This parameter is optional. 12 | cameraPosition.vertical number 0.5 Parameter vertical is a value in radians between 0 and 0.5*Pi. This parameter is optional. 13 | cameraPosition.distance number 1.7 Parameter distance is the (normalized) distance from the camera to the center of the graph, in the range of 0.71 to 5.0. A larger distance puts the graph further away, making it smaller. This parameter is optional. 14 | dataColor string or object {fill: '#7DC1FF', stroke: '#3267D2', strokeWidth: 1} When dataColor is a string, it will set the color for both border and fill color of dots and bars. Applicable for styles dot-size, bar-size, and line. When an object, it can contain the properties descibed below. 15 | dataColor.fill string '#7DC1FF' The border color of the dots or bars. Applicable when using styles dot-size or bar-size. 16 | dataColor.stroke string '#3267D2' The fill color of the dots or bars. Applicable when using styles dot-size, bar-size, or line. 17 | dataColor.strokeWidth number 1 The line width of dots, bars and lines. Applicable for all styles. 18 | gridColor string '#D3D3D3' The color of the grid lines. 19 | height string '400px' The height of the graph in pixels or as a percentage. 20 | keepAspectRatio boolean true If keepAspectRatio is true, the x-axis and the y-axis keep their aspect ratio. If false, the axes are scaled such that they both have the same, maximum with. 21 | showAnimationControls boolean true If true, animation controls are created at the bottom of the Graph. The animation controls consists of buttons previous, start/stop, next, and a slider showing the current frame. Only applicable when the provided data contains an animation. 22 | showGrid boolean true If true, grid lines are draw in the x-y surface (the bottom of the 3d graph). 23 | showPerspective boolean true If true, the graph is drawn in perspective: points and lines which are further away are drawn smaller. Note that the graph currently does not support a gray colored bottom side when drawn in perspective. 24 | showShadow boolean false Show shadow on the graph. 25 | style string 'dot' The style of the 3d graph. Available styles: bar, bar-color, bar-size, dot, dot-line, dot-color, dot-size, line, grid, or surface 26 | tooltip boolean | function false Show a tooltip showing the values of the hovered data point. The contents of the tooltip can be customized by providing a callback function as tooltip. In this case the function is called with an object containing parameters x, y, and z argument, and must return a string which may contain HTML. 27 | valueMax number none The maximum value for the value-axis. Only available in combination with the styles dot-color and dot-size. 28 | valueMin number none The minimum value for the value-axis. Only available in combination with the styles dot-color and dot-size. 29 | verticalRatio number 0.5 A value between 0.1 and 1.0. This scales the vertical size of the graph When keepAspectRatio is set to false, and verticalRatio is set to 1.0, the graph will be a cube. 30 | width string '400px' The width of the graph in pixels or as a percentage. 31 | xBarWidth number none The width of bars in x direction. By default, the width is equal to the distance between the data points, such that bars adjoin each other. Only applicable for styles 'bar' and 'bar-color'. 32 | xCenter string '55%' The horizontal center position of the graph, as a percentage or in pixels. 33 | xMax number none The maximum value for the x-axis. 34 | xMin number none The minimum value for the x-axis. 35 | xStep number none Step size for the grid on the x-axis. 36 | xValueLabel function none A function for custom formatting of the labels along the x-axis, for example function (x) {return (x * 100) + '%'}. 37 | yBarWidth number none The width of bars in y direction. By default, the width is equal to the distance between the data points, such that bars adjoin each other. Only applicable for styles 'bar' and 'bar-color'. 38 | yCenter string '45%' The vertical center position of the graph, as a percentage or in pixels. 39 | yMax number none The maximum value for the y-axis. 40 | yMin number none The minimum value for the y-axis. 41 | yStep number none Step size for the grid on the y-axis. 42 | yValueLabel function none A function for custom formatting of the labels along the y-axis, for example function (y) {return (y * 100) + '%'}. 43 | zMin number none The minimum value for the z-axis. 44 | zMax number none The maximum value for the z-axis. 45 | zStep number none Step size for the grid on the z-axis. 46 | zValueLabel function none A function for custom formatting of the labels along the z-axis, for example function (z) {return (z * 100) + '%'}. 47 | xLabel String x Label on the X axis. 48 | yLabel String y Label on the Y axis. 49 | zLabel String z Label on the Z axis. 50 | filterLabel String time Label for the filter column. 51 | legendLabel String value Label for the style description. -------------------------------------------------------------------------------- /ezvis3d/scripts.py: -------------------------------------------------------------------------------- 1 | 2 | 3 | JS_JSON_PARSE_OPTION = """ 4 | var options = JSON.stringify(options); 5 | 6 | var options = JSON.parse(options, function(key, value) { 7 | 8 | if (value && (typeof value==="string")) { 9 | 10 | if (value.substr(0,8) == "function") { 11 | var startBody = value.indexOf('{') + 1; 12 | var endBody = value.lastIndexOf('}'); 13 | var startArgs = value.indexOf('(') + 1; 14 | var endArgs = value.indexOf(')'); 15 | 16 | return new Function(value.substring(startArgs, endArgs), 17 | value.substring(startBody, endBody)); 18 | } 19 | 20 | 21 | if (value.substr(0,9)=="(function") { 22 | var startBody = value.indexOf('{') + 1; 23 | var endBody = value.lastIndexOf('}'); 24 | var startArgs = value.indexOf('(', 1) + 1; 25 | var endArgs = value.indexOf(')'); 26 | 27 | var func = new Function(value.substring(startArgs, endArgs), 28 | value.substring(startBody, endBody)); 29 | return func(); 30 | } 31 | } 32 | 33 | return value; 34 | }); 35 | """ 36 | 37 | 38 | JS_JSON_PARSE_DATA = """ 39 | var data = JSON.parse(data); 40 | """ 41 | 42 | JS_CREATE_DATASET = """ 43 | var dataset = new vis.DataSet(); 44 | e = data[0]; 45 | if (e.style!==undefined & e.filter!==undefined) { 46 | for (var i=0; i