reactjs | react-magic-move changes for React V15.1

-
React Magic Move is a great component given by Ryan Florence( https://github.com/ryanflorence/react-magic-move).

However when I tried to implement it it was not working in React version 15.x. Some of the functions used in that code were deprecated and were throwing error. So I thought I will fix that and here is the revised working code.

https://github.com/venkat-vs-id/magic_move_kat

This is not a Production module, its just a fun experiment I used to understand and play with ReactJS.

Steps:

  1. Have a DIV with id="example"
  2. Copy the components to your components code.
  3. my_react_script.js is the code which implements the MagicMove examples. Either copy this code into your js file or use this file and make necessary changes.
  4. Make sure you copy the contents of my_CSS.css to your CSS file OR use this file and make required changes.
Below are the screenshots of the examples

1) First screen


2) Basic Example


3) Buddy List Example








Comments

Post a Comment

Popular posts from this blog

Tableau - Accessing Tableau's DB

-
Image
Click here for other Tableau related Blogs Please note that TABLEAU does not advice anyone to access their DB. So if you are doing it you are on your own. Tableau has 2 DB Postgresql for managing all its reporting repositories FireBird for mapping repositories Tools Required pgAdmin 3 for PostgreSql Flamerobin for FireDB Accessing Tableau's PostgreSQL DB Tableau has 2 buitin userid tableau = with read-only access to some of Tableau's view tblwgadmin = admin user will all privileges Please note tblwgadmin is like a admin user, so if you are using this you have to be very careful. Or if you dont admin privs but just need enough access to read the tables then use just "tableau" user. Get access for "tableau" user.  First set a password for "tableau" userid open command prompt go to <Tableau_Home>\Tableau Server\7.0\bin run -  tabadmin dbpass <give a password> Restart the server Now open pgAdmin3 and from...
Read more

Tableau : Convert ESRI shapes into Tableau Format

-
Image
Click here for other Tableau related Blogs Requirement is to convert data in ESRI Map shapes into Tableau format. Tools Required Quantum GIS -  http://www.qgis.org/en/site/ Python  Download the below Python Code -  https://github.com/venkat-vs-id/python import csv import re import sys #def convertESRI2TableauFormat( p_inputfile, p_outputfile): l_outfileName = 'c:/ESRI_suburb_tab_format.csv' # make changes here.. l_ESRIFileName ='c:/ESRI_suburb.csv' # make changes here.. rdx=0 csv.field_size_limit(sys.maxsize) outfile = open( l_outfileName, 'w', newline='') csvWriter = csv.writer( outfile, delimiter=',', quotechar='"', quoting=csv.QUOTE_MINIMAL) with open( l_ESRIFileName, 'r') as csvfile: csvR = csv.reader( csvfile, delimiter=',', quotechar='"') for row in csvR: rdx += 1 ci=0 rowValues = [] rowValues.append(row[1]);# ssc_code rowValues.append(...
Read more

Tableau: Convert Oracle Spatial Data into Tableau Format

-
Click here for other Tableau related Blogs I had requirement to shapes we had in Oracle Spatial data( which we used for MapInfo) in Tableau. Since tableau doesnt support Oracle spatial type columns, I had to extract that data in Tableau readable format. Here are the steps to convert oracle spatial data into format useable by Tableau. Run the Oracle package ven_OraSpatial_2_TabData in your oracle environment. Now run the below "ConvertDataFormat" code to extract the data into Tableau format Now use extracted data in tableau ( refer to my blog -  Tableau Maps - Custom shapes / polygon - Basics ) You can also download the code from this link -   VEN_ORASPATIAL_2_TABDATA.zip Oracle package ven_OraSpatial_2_TabData SPEC CREATE OR REPLACE PACKAGE VSUBR.ven_OraSpatial_2_TabData as ----- TYPE TYPE rec_LatLong IS RECORD( Polygon_ID NUMBER, LAT NUMBER, LON NUMBER ); TYPE tab...
Read more