Embedding CODAP components (table or Graph) in webpage

[Hollylynne Lee]

I am looking to build some interactive webpages like those illustrated here: How do I do this? Directions would be helpful for how to grab and embed code from different components in a CODAP file and integrate them onto a different page.

[Bill Finzer]

OK, so we’re assuming you can create a webpage. Here are the steps:

1. Create the CODAP document just how you want it, with everything laid out starting at the top left. Give this document a name and save it.
2. In the 3-strips menu choose Share… / Get link to shared view. This will open a dialog box.
3. Press the Enable Sharing button. This will bring up a Share dialog box.
4. Choose the middle tab Embed.
5. Copy the code in the box (the text that starts with “<iframe”).
6. Go into your web page editor where you want to embed the CODAP document.
7. Paste the code you copied in the desired place.
8. Edit the code by inserting “?componentMode=yes” in the place shown here:

src="http://codap.concord.org/app/<strong>?componentMode=yes</strong>#shared=12345">

9. Open your web page and figure out what width and height of the rectangle you want and edit those two numbers in the code.

Notice that CODAP’s tool shelf is not showing. That’s because you added the code that turns on “componentMode.”

Be aware that you can at any time go back to your original saved document, make changes, save them, and use Share… / Update shared view so that the next time your web page is viewed, your changes are there.

Hoping this works,
Bill

• This reply was modified 7 years, 3 months ago by Bill Finzer. Reason: Add info about updating shared view

Attachments:

1. 

   Embed.png
   

[Kathy Shafer]

HollyLynne & Bill,

Hi.  I had this question as well.  Here are some examples of what Bill explained above.  Hopefully they make sense.

https://tinkerplots-math.wikispaces.com/Practice+Page

Bill, how do we limit the number of measurement tools?  I noticed in the numbers plot on the right you allowed only five.

Kathy

[Bill Finzer]

Hi Kathy,

Bill, how do we limit the number of measurement tools?  I noticed in the numbers plot on the right you allowed only five.

Do you mean how many “checkboxes” show in the Ruler menu. I’m not doing anything special and currently there is no way for you as the author to control what shows up there.

Bill

[Kathy Shafer]

Yes, that was my question.  Thanks for your response!

Maybe that particular plot was created before the rest of the tools were created.  I am curious about that plot.

I anticipate wanting to restrict a few of these options in the Ruler menu for an introductory level activity.

• This reply was modified 7 years, 3 months ago by Kathy Shafer.

[Author]

Posts