MapViewer 10.1.2: Interactive SVG in a JSP page

Hello everyone,
I'd like to be able to embed an interactive SVG map in my JSP page (similar to the mapinit/svgmap demo).
What is the simplest way to do it? Is there a JSP tag that would render a map with all javascript?
I'd like to avoid having lots of Java and Javascript code in my JSP definition.
Thanks,
Max

There is no such JSP up to this point. Currently, you have to have some java and Javascript code to implement the control flow. If you want your JSP code to look cleaner, you can move the Javascript code into a seperate JS file and use <SCRIPT TYPE="text/javascript" SRC="myscript.js"></SCRIPT> in your JSP code.

Similar Messages

How to add a link to an interactive svg using edge commons library

Hi,
I've been playing around with this wonderful Edge Commons interactive SVG tutorial
My question is : How to add an external link "url" to an interactive svg using edge commons library ?
Edge commons example file :
http://edgedocks.com/market/interactive-svg-example-project-edge-commons
Edge commons video tutorial :
http://www.youtube.com/watch?v=4UEB6gaLKuw
I have adapted this tutorial to an interactive map, http://madudesign.com/works/france/ every thing is going fine until I couldn't figure out to link a particular url on each part of the region of the map.
I managed to figure out how to change colors on the different parts of the map on mouse over and mouse out but I'm not quite comfortable with JavaScript since I don't use it every day...
I have tryed to link to an url by passing it on the illustrator layer and via the onclick event (event.target.id) to a simple url
http://redpen.io/6svh5u
then working in Edge and publishing on the browser the link returns me a weird url line by replacing the original url slashes "//" by "_x2F_" and I must have misunderstood the proper JavaScript line to open that link from there...
for example on my actual exemple "http://madudesign.com/works/france/"
the first top region of France is normally a link to "http://www.google.com" and it returns "http:_x2F__x2F_www.google.com" plus the complete path to the file too...
I don't know how to get around this trick and have back for each region a particular clean link from the event target id of the svg...
thank-you for any help
matt
link to my edge animate file if needed :
http://madudesign.com/works/france/carte_de_france.zip

I got an answer from the Edge Commons dream team and I am very grateful to them :
"The problem that you bumped into was that you hadn't included a valid URL so far. We weren't sure if you wanted to include them within the SVG file or if you wanted to implement the functionality within Edge Animate. We came up with a solution for the latter one, with a simple switch in the js code:
You have to type in the appropriate URL of course for all the cases."
I have to share the final result:
http://www.madudesign.com/works/france/france_map/
And the zipped project file:
http://www.madudesign.com/works/france/france_map.zip
Thanks to Daniel & Simon
Matt

Can interactive SVG's be called from within a symbol in the yepnope function?

I'm hoping someone may have run across this before, I'm trying to access an interactive svg (called "map") from inside a symbol (called "world") in the compositionReady event from the stage. The image loads just fine as long as I have it directly on the stage, but for the project I'm working on it would be way more convenient to have the svg inside of a symbol since it's supposed to scale in sync with a bunch of other elements. I have tried everything I can think of to reference the svg inside the symbol, but nothing works.
My code from the compositionReady event looks like this:
yepnope({
          load: "http://cdn.edgecommons.org/an/1.0.0/js/min/EdgeCommons.js",
          complete: function() {
                    // enable svg access
                    EC.SVG.accessSVG( sym.$("map") ).done(              // this is the line where I'd like to reference the svg "map" inside of the symbol "world"
                              function(svgDocument){
                                        // event listener
                                        svgDocument.addEventListener("select", function(event){
                                                  // remember selecte part
                                                  sym.setVariable("selectedPart", event.target);
                                                  // show id
                                                  sym.$("selectedPartTxt").html(event.target.id);
It's the EC.SVG.accessSVG( sym.$("map") ).done part that I can't wrap my head around. I've tried to reference the "world" symbol with things like:
EC.SVG.accessSVG(
var mySymbolObject = sym.getSymbol("world");
mySymbolObject.$("map") ).done
or
EC.SVG.accessSVG( sym.$("world").$("map") ).done
but nothing is working!!! Does anyone know where I've gone wrong? Or perhaps it isn't possible to call an svg from a symbol?
Thanks for any advice you have!

Here is my code in a file I used as a sample. I put the bee in a symbol named world and it works correctly:
EC.SVG.accessSVG(sym.getSymbol('world').$('bees')).done(
          function(svgDocument){
                    // add event listener
                    svgDocument.addEventListener("select", function(event) {
                    // Remember selected part
                    sym.setVariable("selectedPart", event.target);
                    // show the id of the selected part in the textfield
                    sym.$("selectedPartTxt").html( event.target.id );
Let me know if this helps. I can post the sample if you want.
here is the sample: https://app.box.com/s/xb20izcmbmd0lgqfnbgu

Interactive SVG : Can't change the mouse cursor to pointer

Hello I am having issue with the interactive SVG file I have followed the example from adobe tv and edgedocks and created my own project and everything is working just fine, now my question is how to change the cursor that hovers over the svg into pointer, I tried the box inside adobe edge animate and everything but not working even jquery or javascript nothing is really working and I can't get the id from the svg itself so I can target it with jquery so could somebody help me with that, Thanks

you can use css to change the cursor in the init function with
sym.$("selectedPartTxt").css({'cursor':'cursormode'});
change cursormode to one of these:
http://www.w3schools.com/cssref/playit.asp?filename=playcss_cursor&preval=all-scroll
add this to the element that needs the cursor asshown above (element chosen from edgecommmons example).

Edge Commons - Interactive Svg Map

Hi folks!
I've watched the extraordinary video tutorial of the very talented guys from EdgeDocks (http://edgedocks.com) about how to build an Interactive Svg Graphic with Adobe Illustrator and Adobe Edge Animate: http://www.youtube.com/watch?v=4UEB6gaLKuw.
I've followed the example explained in the video tutorial using a Svg Map file and making selectable one region (the lower right, in light brown color) to try:
http://www.terredainventare.it/svg/MappaSvgInteractive.html
(project files: http://www.terredainventare.it/svg/SvgMap.zip)
So when I select this regione, Edge Animate replaces the placeholder text with the name of the path ("Isontino"), but when I click the red Ellipse, the color of the region remains in light brown. Why?
Many thanks in advance for your help!
Davide

Hi!
Following a precious hint of Simon Widjaja, the author of EdgeCommons libraries,
I've replaced
$(selectedPart).css("fill", $(e.currentTarget).css("background-color"));
with
$(selectedPart).each(function (index) {
$( this ).css("fill", $(e.currentTarget).css("background-color"));
beacuse my "SelectedPart" was a group in Adobe Illustrator and I need to select each element to fill it with color: but it doesn't work.
Where I am get wrong?
Here the update project files: http://www.terredainventare.it/svg/SvgMapEach.zip
Many thanks in advanced!
Davide

Yepnope still works, Interactive SVG does not without it | EA 2014.1.1

Hi all,
I'm trying to create an interactive map of the US using Edge Commons interactive SVG. I've been reading that yepnope is deprecated and doesn't work in the new version of EA 2014.1.1 but it seems to still work for me and appears to be the only way I can interact with an SVG. I have added both jquery-1.11.2.min.js and EdgeCommons.SVG.js in the scripts panel but can't seem to get it to work without using the yepnope function. Can anyone help me with this? I'm running a Mac OSX 10.10.2.
Here's a link to the EA file.
Dropbox - default.zip
Thanks in advance for all your help!
Kenny

Hi all,
I'm trying to create an interactive map of the US using Edge Commons interactive SVG. I've been reading that yepnope is deprecated and doesn't work in the new version of EA 2014.1.1 but it seems to still work for me and appears to be the only way I can interact with an SVG. I have added both jquery-1.11.2.min.js and EdgeCommons.SVG.js in the scripts panel but can't seem to get it to work without using the yepnope function. Can anyone help me with this? I'm running a Mac OSX 10.10.2.
Here's a link to the EA file.
Dropbox - default.zip
Thanks in advance for all your help!
Kenny

Advice on using Edge Animate & Interactive SVG to create an interactive map

Hello folks, I'm hoping for some guidance on a complicated graphic. My org. has an existing interactive map which was created by a freelancer for us using Ruby and js. It's very nice but I wanted to see if it's possible to recreate using Edge Animate (both as a challenge to myself and as a way of being able to move ownership of it in-house). Here's the map:
http://csai-online.org/sos
I have done a fair amount of work in Edge Animate but have mostly stuck with simple interactivity (play, repeat, navigation links, etc.) so this would be a stretch. But I'm thinking that the map itself (with various shadings) could be recreated using Edge Commons' Interactive SVG function. I would create the map in Illustrator as an svg with different layers for each group of states, which would then be activated by the buttons in Edge Animate. (The floating box could be done entirely in Animate.)
So my questions are,
- Does this seem doable, and has anyone done something similar?
- How do I trigger the layer visibility toggle from Edge? There's a tutorial from Edge Commons which changes the color of an object by CSS, but it seems like it would be simpler to use layer visibility.
- Some of the combinations of checkboxes result in States that are in multiple groups (resulting in a striped fill). I'm guessing I'd need to add some code to indicate that if buttons X and Y were both checked, a third combined layer would be shown. (A further complication is that each of the groups of buttons shuts off the other groups.)
Alternately, it seems like I could also create each state as a series of differently-colored graphics which are then shown or hidden based on which buttons are checked (using arrays, maybe?), but that seems a messier due to the million separate images.
Anyway, how would you approach this problem, I guess is my main question.
Thanks very much.

This looks pretty simple to me and I don't see why you wouldn't be able to do it in edge animate.
Create each state as a button and animate the hover effects inside a symbol and then on the main timeline animate the content boxes opacity to on and off and set labels for each "on" state and then in your button link to that label in the mouse over actions preset.u
As far as calling the bottom content into the div i would just do that by hand by grabbing a simple script off the internet. *theres loads*

Interaction History in BP identification page.

Hi,
Will you please help me with the config for the Interaction History on BP identification page.
For one of the business role, the Interaction History link is there, but it is not opening any history page.
I am using CRM 6.0.
Will any one help please.
Thanks in advance.......

Hello,
I closed this because I got a note from SAP.
thanks for reading.

How to add interactive feature in top of page in ALV .

Hi All ,
There is immediate requirement , I have to add interactive feature in top of page in ALV grid .
Can anyone sort this out ?
Reward points will be given.

hi,
check this example:
REPORT ZSR_ALV_INTERACTIVE2.
TYPE-POOLS: SLIS.
*DATA DECLARATION.
TYPES: BEGIN OF I_VBAK,
VBELN TYPE VBELN_VA,
AUGRU TYPE AUGRU,
END OF I_VBAK.
TYPES: BEGIN OF I_VBAP,
VBELN TYPE VBELN_VA,
AUGRU TYPE AUGRU,
POSNR TYPE POSNR_VA,
MATNR TYPE MATNR,
ZMENG TYPE DZMENG,
END OF I_VBAP.
TYPES: BEGIN OF I_MAKT,
MATNR TYPE MATNR,
MAKTX TYPE MAKTX,
END OF I_MAKT.
TYPES: BEGIN OF I_LIPS,
POSNR TYPE POSNR_VL,
MATNR TYPE MATNR,
LFIMG TYPE LFIMG,
END OF I_LIPS.
TYPES: BEGIN OF I_REASON,
SPRAS TYPE SPRAS,
AUGRU TYPE AUGRU,
BEZEI TYPE BEZEI40,
END OF I_REASON.
TYPES: BEGIN OF I_VBPA,
VBELN TYPE VBELN,
PARVW TYPE PARVW,
KUNNR TYPE KUNNR,
END OF I_VBPA.
TYPES: BEGIN OF I_KNA1,
KUNNR TYPE KUNNR,
NAME1 TYPE NAME1_GP,
END OF I_KNA1.
TYPES: BEGIN OF I_FINAL,
VBELN TYPE VBELN_VA,
POSNR TYPE POSNR_VA,
MATNR TYPE MATNR,
ZMENG TYPE DZMENG,
MAKTX TYPE MAKTX,
LFIMG TYPE LFIMG,
SPRAS TYPE SPRAS,
AUGRU TYPE AUGRU,
BEZEI TYPE BEZEI40,
PARVW TYPE PARVW,
KUNNR TYPE KUNNR,
NAME1 TYPE NAME1_GP,
END OF I_FINAL.
*INTERNAL TABLES
DATA: IT_VBAK TYPE STANDARD TABLE OF I_VBAK.
DATA: IT_VBAP TYPE STANDARD TABLE OF I_VBAP.
DATA: IT_MAKT TYPE STANDARD TABLE OF I_MAKT.
DATA: IT_LIPS TYPE STANDARD TABLE OF I_LIPS.
DATA: IT_VBPA TYPE STANDARD TABLE OF I_VBPA.
DATA: IT_KNA1 TYPE STANDARD TABLE OF I_KNA1.
DATA: IT_FINAL TYPE STANDARD TABLE OF I_FINAL.
DATA: IT_REASON TYPE STANDARD TABLE OF I_REASON.
DATA : V_FLAG.
*WORK AREA
DATA: WA_VBAK TYPE I_VBAK.
DATA: WA_VBAP TYPE I_VBAP.
DATA: WA_MAKT TYPE I_MAKT.
DATA: WA_LIPS TYPE I_LIPS.
DATA: WA_VBPA TYPE I_VBPA.
DATA: WA_KNA1 TYPE I_KNA1.
DATA: WA_FINAL TYPE I_FINAL.
DATA: WA_REASON TYPE I_REASON.
*DATA DECLARATION.
DATA: V_PROGNAME TYPE SY-REPID.
DATA: V_VBELN TYPE VBAK-VBELN.
DATA: V_GRIDTITLE TYPE LVC_TITLE.
***PARAMETERS: D_VARI LIKE DISVARIANT-VARIANT.
*DATA: I_VARIANT LIKE DISVARIANT.
*DATA: P_VARI LIKE DISVARIANT-VARIANT.
*DATA DECLARATION FOR CATALOGS LAYOUT SORT EVENTCATALOG TOPOFPAGE.
DATA: I_FIELDCAT TYPE SLIS_T_FIELDCAT_ALV.
DATA: I_LAYOUT TYPE SLIS_LAYOUT_ALV.
DATA: I_SORTINFO TYPE SLIS_T_SORTINFO_ALV.
DATA: I_LISTHEADER TYPE SLIS_T_LISTHEADER.
DATA: I_EVENTCAT TYPE SLIS_T_EVENT.
INITIALIZATION.
V_PROGNAME = SY-REPID.
V_FLAG = SPACE.
*SELECTION SCREEN
SELECTION-SCREEN BEGIN OF BLOCK BLK1 WITH FRAME TITLE TEXT-002.
SELECT-OPTIONS: S_VBELN FOR V_VBELN.
SELECTION-SCREEN END OF BLOCK BLK1.
*AT SLECTION-SCREEN.
AT SELECTION-SCREEN.
PERFORM Z_VALIDATIONS.
*START OF SELECTION.
START-OF-SELECTION.
PERFORM Z_SELECT.
PERFORM CHECK_VALIDATION_FLAG.
PERFORM Z_FIELDCAT USING I_FIELDCAT.
PERFORM Z_LAYOUT.
PERFORM Z_SORTINFO USING I_SORTINFO.
PERFORM Z_EVENTCAT USING I_EVENTCAT.
PERFORM Z_GRIDTITLE.
PERFORM Z_LISTHEADER USING I_LISTHEADER.
PERFORM Z_DISPLAY.
*& Form Z_VALIDATIONS
FORM Z_VALIDATIONS .
SELECT VBELN INTO V_VBELN
UP TO 1 ROWS
FROM VBAK
WHERE VBELN IN S_VBELN.
ENDSELECT.
IF SY-SUBRC <> 0.
    MESSAGE I002(SY) WITH 'No Records'.
    V_FLAG = 'X'.
ENDIF.
ENDFORM. " Z_VALIDATIONS
*& Form Z_FIELDCAT
FORM Z_FIELDCAT USING P_I_FIELDCAT TYPE SLIS_T_FIELDCAT_ALV.
DATA: I_FIELDCAT TYPE SLIS_FIELDCAT_ALV.
*VBAK-VELN
I_FIELDCAT-COL_POS = '1'. " POSITION OF THE COLUMN.
I_FIELDCAT-FIELDNAME = 'VBELN'. " FIELD FOR WHICH CATALOG ID FILLED.
I_FIELDCAT-TABNAME = 'IT_FINAL'. " INTERNAL TABLE TO WHICH THE FIELD
*BELONGS TO.
I_FIELDCAT-KEY = 'X'. " SO THAT THIS FIELD IS NOT SCROLLABLE AND
*HIDDABLE.
I_FIELDCAT-JUST = 'C'. " FOR JUSTIFICATION.
I_FIELDCAT-LZERO = 'X'. " OUTPUT WITH LEADING ZEROS.
I_FIELDCAT-SELTEXT_L = 'SALES ORDER'. " LONG TEXT FOR HEADER.
I_FIELDCAT-OUTPUTLEN = 15. " SET THE OUTPUT LENGTH.
I_FIELDCAT-REF_TABNAME = 'VBAK'. " FOR F1 & F4 HELP AS REFERNCED TO
*THE DDIC TABLE.
APPEND I_FIELDCAT TO P_I_FIELDCAT.
*VBAP-SPRAS
I_FIELDCAT-COL_POS = '2'. " POSITION OF THE COLUMN.
I_FIELDCAT-FIELDNAME = 'SPRAS'. " FIELD FOR WHICH CATALOG ID FILLED.
I_FIELDCAT-TABNAME = 'IT_FINAL'. " INTERNAL TABLE TO WHICH THE FIELD
*BELONGS TO.
I_FIELDCAT-LZERO = 'X'. " OUTPUT WITH LEADING ZEROS.
I_FIELDCAT-SELTEXT_L = 'LANGUAGE'. " LONG TEXT FOR HEADER.
I_FIELDCAT-OUTPUTLEN = 5. " SET THE OUTPUT LENGTH.
I_FIELDCAT-REF_TABNAME = 'TVAUT'. " FOR F1 & F4 HELP AS REFERNCED TO
*TABLE.
APPEND I_FIELDCAT TO P_I_FIELDCAT.
*VBAP-AUGRU
I_FIELDCAT-COL_POS = '3'. " POSITION OF THE COLUMN.
I_FIELDCAT-FIELDNAME = 'AUGRU'. " FIELD FOR WHICH CATALOG ID FILLED.
I_FIELDCAT-TABNAME = 'IT_FINAL'. " INTERNAL TABLE TO WHICH THE FIELD
*BELONGS TO.
I_FIELDCAT-LZERO = 'X'. " OUTPUT WITH LEADING ZEROS.
I_FIELDCAT-SELTEXT_L = 'REASON'. " LONG TEXT FOR HEADER.
I_FIELDCAT-OUTPUTLEN = 5. " SET THE OUTPUT LENGTH.
I_FIELDCAT-REF_TABNAME = 'VBAK'. " FOR F1 & F4 HELP AS REFERNCED TO
*TABLE.
APPEND I_FIELDCAT TO P_I_FIELDCAT.
*VBAP-bezei
I_FIELDCAT-COL_POS = '4'. " POSITION OF THE COLUMN.
I_FIELDCAT-FIELDNAME = 'BEZEI'. " FIELD FOR WHICH CATALOG ID FILLED.
I_FIELDCAT-TABNAME = 'IT_FINAL'. " INTERNAL TABLE TO WHICH THE FIELD
*BELONGS TO.
I_FIELDCAT-LZERO = 'X'. " OUTPUT WITH LEADING ZEROS.
I_FIELDCAT-SELTEXT_L = 'DESCRIPTION'. " LONG TEXT FOR HEADER.
I_FIELDCAT-OUTPUTLEN = 20. " SET THE OUTPUT LENGTH.
I_FIELDCAT-REF_TABNAME = 'TVAUT'. " FOR F1 & F4 HELP AS REFERNCED TO
*TABLE.
APPEND I_FIELDCAT TO P_I_FIELDCAT.
*VBAP-POSNR
I_FIELDCAT-COL_POS = '5'. " POSITION OF THE COLUMN.
I_FIELDCAT-FIELDNAME = 'POSNR'. " FIELD FOR WHICH CATALOG ID FILLED.
I_FIELDCAT-TABNAME = 'IT_FINAL'. " INTERNAL TABLE TO WHICH THE FIELD
*BELONGS TO.
I_FIELDCAT-LZERO = 'X'. " OUTPUT WITH LEADING ZEROS.
I_FIELDCAT-SELTEXT_L = 'ITEM'. " LONG TEXT FOR HEADER.
I_FIELDCAT-OUTPUTLEN = 8. " SET THE OUTPUT LENGTH.
I_FIELDCAT-REF_TABNAME = 'VBAP'. " FOR F1 & F4 HELP AS REFERNCED TO
*TABLE.
APPEND I_FIELDCAT TO P_I_FIELDCAT.
*VBAP-MATNR.
I_FIELDCAT-COL_POS = '6'. " POSITION OF THE COLUMN.
I_FIELDCAT-FIELDNAME = 'MATNR'. " FIELD FOR WHICH CATALOG ID FILLED.
I_FIELDCAT-TABNAME = 'IT_FINAL'. " INTERNAL TABLE TO WHICH THE FIELD
*BELONGS TO.
I_FIELDCAT-LZERO = 'X'. " OUTPUT WITH LEADING ZEROS.
I_FIELDCAT-SELTEXT_L = 'MATERIAL'. " LONG TEXT FOR HEADER.
I_FIELDCAT-OUTPUTLEN = 10. " SET THE OUTPUT LENGTH.
I_FIELDCAT-REF_TABNAME = 'VBAP'. " FOR F1 & F4 HELP AS REFERNCED TO
*TABLE.
APPEND I_FIELDCAT TO P_I_FIELDCAT.
*VBAP-ZMENG
I_FIELDCAT-COL_POS = '7'. " POSITION OF THE COLUMN.
I_FIELDCAT-FIELDNAME = 'ZMENG'. " FIELD FOR WHICH CATALOG ID FILLED.
I_FIELDCAT-TABNAME = 'IT_FINAL'. " INTERNAL TABLE TO WHICH THE FIELD
*BELONGS TO.
I_FIELDCAT-LZERO = 'X'. " OUTPUT WITH LEADING ZEROS.
I_FIELDCAT-SELTEXT_L = 'QUANT'. " LONG TEXT FOR HEADER.
I_FIELDCAT-OUTPUTLEN = 10. " SET THE OUTPUT LENGTH.
I_FIELDCAT-REF_TABNAME = 'VBAP'. " FOR F1 & F4 HELP AS REFERNCED TO
*TABLE.
APPEND I_FIELDCAT TO P_I_FIELDCAT.
*MAKT-MAKTX
I_FIELDCAT-COL_POS = '8'. " POSITION OF THE COLUMN.
I_FIELDCAT-FIELDNAME = 'MAKTX'. " FIELD FOR WHICH CATALOG ID FILLED.
I_FIELDCAT-TABNAME = 'IT_FINAL'. " INTERNAL TABLE TO WHICH THE FIELD
*BELONGS TO.
I_FIELDCAT-LZERO = 'X'. " OUTPUT WITH LEADING ZEROS.
I_FIELDCAT-SELTEXT_L = 'DESCRIPTION'. " LONG TEXT FOR HEADER.
I_FIELDCAT-OUTPUTLEN = 20. " SET THE OUTPUT LENGTH.
I_FIELDCAT-REF_TABNAME = 'MAKT'. " FOR F1 & F4 HELP AS REFERNCED TO
*TABLE.
APPEND I_FIELDCAT TO P_I_FIELDCAT.
*LIPS-VBELN
I_FIELDCAT-COL_POS = '9'. " POSITION OF THE COLUMN.
I_FIELDCAT-FIELDNAME = 'VBELN'. " FIELD FOR WHICH CATALOG ID FILLED.
I_FIELDCAT-TABNAME = 'IT_FINAL'. " INTERNAL TABLE TO WHICH THE FIELD
*BELONGS TO.
I_FIELDCAT-LZERO = 'X'. " OUTPUT WITH LEADING ZEROS.
I_FIELDCAT-SELTEXT_L = 'DELIVERY'. " LONG TEXT FOR HEADER.
I_FIELDCAT-OUTPUTLEN = 15. " SET THE OUTPUT LENGTH.
I_FIELDCAT-REF_TABNAME = 'LIPS'. " FOR F1 & F4 HELP AS REFERNCED TO
*TABLE.
APPEND I_FIELDCAT TO P_I_FIELDCAT.
*LIPS-LFIMG
I_FIELDCAT-COL_POS = '10'. " POSITION OF THE COLUMN.
I_FIELDCAT-FIELDNAME = 'LFIMG'. " FIELD FOR WHICH CATALOG ID FILLED.
I_FIELDCAT-TABNAME = 'IT_FINAL'. " INTERNAL TABLE TO WHICH THE FIELD
*BELONGS TO.
I_FIELDCAT-LZERO = 'X'. " OUTPUT WITH LEADING ZEROS.
I_FIELDCAT-DO_SUM = 'X'.
I_FIELDCAT-SELTEXT_L = 'LFIMG'. " LONG TEXT FOR HEADER.
I_FIELDCAT-OUTPUTLEN = 18. " SET THE OUTPUT LENGTH.
I_FIELDCAT-REF_TABNAME = 'LIPS'. " FOR F1 & F4 HELP AS REFERNCED TO
*TABLE.
APPEND I_FIELDCAT TO P_I_FIELDCAT.
*parvw
I_FIELDCAT-COL_POS = '11'. " POSITION OF THE COLUMN.
I_FIELDCAT-FIELDNAME = 'PARVW'. " FIELD FOR WHICH CATALOG ID FILLED.
I_FIELDCAT-TABNAME = 'IT_FINAL'. " INTERNAL TABLE TO WHICH THE FIELD
*BELONGS TO.
I_FIELDCAT-LZERO = 'X'. " OUTPUT WITH LEADING ZEROS.
I_FIELDCAT-SELTEXT_L = 'PARTNER FUN'. " LONG TEXT FOR HEADER.
I_FIELDCAT-OUTPUTLEN = 18. " SET THE OUTPUT LENGTH.
I_FIELDCAT-REF_TABNAME = 'VBPA'. " FOR F1 & F4 HELP AS REFERNCED TO
*TABLE.
APPEND I_FIELDCAT TO P_I_FIELDCAT.
*KUNNR
I_FIELDCAT-COL_POS = '12'. " POSITION OF THE COLUMN.
I_FIELDCAT-FIELDNAME = 'KUNNR'. " FIELD FOR WHICH CATALOG ID FILLED.
I_FIELDCAT-TABNAME = 'IT_FINAL'. " INTERNAL TABLE TO WHICH THE FIELD
*BELONGS TO.
I_FIELDCAT-LZERO = 'X'. " OUTPUT WITH LEADING ZEROS.
I_FIELDCAT-SELTEXT_L = 'SHIP'. " LONG TEXT FOR HEADER.
I_FIELDCAT-OUTPUTLEN = 18. " SET THE OUTPUT LENGTH.
I_FIELDCAT-REF_TABNAME = 'VBPA'. " FOR F1 & F4 HELP AS REFERNCED TO
*TABLE.
APPEND I_FIELDCAT TO P_I_FIELDCAT.
*NAME1
I_FIELDCAT-COL_POS = '13'. " POSITION OF THE COLUMN.
I_FIELDCAT-FIELDNAME = 'NAME1'. " FIELD FOR WHICH CATALOG ID FILLED.
I_FIELDCAT-TABNAME = 'IT_FINAL'. " INTERNAL TABLE TO WHICH THE FIELD
*BELONGS TO.
I_FIELDCAT-LZERO = 'X'. " OUTPUT WITH LEADING ZEROS.
I_FIELDCAT-SELTEXT_L = 'NAME'. " LONG TEXT FOR HEADER.
I_FIELDCAT-OUTPUTLEN = 18. " SET THE OUTPUT LENGTH.
I_FIELDCAT-REF_TABNAME = 'KNA1'. " FOR F1 & F4 HELP AS REFERNCED TO
*TABLE.
APPEND I_FIELDCAT TO P_I_FIELDCAT.
ENDFORM. " Z_FIELDCAT
*& Form Z_SELECT
FORM Z_SELECT .
SELECT VBELN
AUGRU INTO CORRESPONDING FIELDS OF TABLE IT_VBAK
FROM VBAK
WHERE VBELN IN S_VBELN.
IF SY-SUBRC = 0.
    SELECT VBELN
    POSNR
    MATNR
    ZMENG INTO CORRESPONDING FIELDS OF TABLE IT_VBAP
    FROM VBAP
    FOR ALL ENTRIES IN IT_VBAK
    WHERE VBELN = IT_VBAK-VBELN.
    IF SY-SUBRC = 0.
      SELECT SPRAS
      AUGRU
      BEZEI INTO CORRESPONDING FIELDS OF TABLE IT_REASON
      FROM TVAUT
      FOR ALL ENTRIES IN IT_VBAK
      WHERE AUGRU = IT_VBAK-AUGRU.
      IF SY-SUBRC = 0.
        SELECT VBELN
        PARVW
        KUNNR INTO CORRESPONDING FIELDS OF TABLE IT_VBPA
        FROM VBPA
        FOR ALL ENTRIES IN IT_VBAK
        WHERE VBELN = IT_VBAK-VBELN.
        IF SY-SUBRC = 0.
          SELECT KUNNR
          NAME1 INTO CORRESPONDING FIELDS OF TABLE IT_KNA1
          FROM KNA1
          FOR ALL ENTRIES IN IT_VBPA
          WHERE KUNNR = IT_VBPA-KUNNR.
          IF SY-SUBRC = 0.
            SELECT POSNR
            MATNR
            LFIMG INTO CORRESPONDING FIELDS OF TABLE IT_LIPS
            FROM LIPS
            FOR ALL ENTRIES IN IT_VBAP
            WHERE POSNR = IT_VBAP-POSNR.
            IF SY-SUBRC = 0.
              SELECT MATNR
              MAKTX INTO CORRESPONDING FIELDS OF TABLE IT_MAKT
              FROM MAKT
              FOR ALL ENTRIES IN IT_VBAP
              WHERE MATNR = IT_VBAP-MATNR.
            ENDIF.
          ENDIF.
        ENDIF.
      ENDIF.
    ENDIF.
ELSE.
    MESSAGE I002(SY) WITH 'No Data found'.
    LEAVE LIST-PROCESSING.
ENDIF.
IF SY-SUBRC = 0.
    LOOP AT IT_VBAP INTO WA_VBAP.
      READ TABLE IT_VBAK INTO WA_VBAK WITH KEY VBELN = WA_VBAP-VBELN
BINARY SEARCH.
      IF SY-SUBRC = 0.
*MOVE DATA INTO IT_FINAL.
        MOVE: WA_VBAK-VBELN TO WA_FINAL-VBELN,
        WA_VBAK-AUGRU TO WA_FINAL-AUGRU,
        WA_VBAP-POSNR TO WA_FINAL-POSNR,
        WA_VBAP-MATNR TO WA_FINAL-MATNR,
        WA_VBAP-ZMENG TO WA_FINAL-ZMENG.
      ENDIF.
      READ TABLE IT_LIPS INTO WA_LIPS WITH KEY POSNR = WA_FINAL-POSNR
BINARY SEARCH.
      IF SY-SUBRC = 0.
        MOVE: WA_LIPS-LFIMG TO WA_FINAL-LFIMG.
      ENDIF.
      READ TABLE IT_REASON INTO WA_REASON WITH KEY AUGRU =
WA_FINAL-AUGRU BINARY SEARCH.
      IF SY-SUBRC = 0.
        MOVE: WA_REASON-SPRAS TO WA_FINAL-SPRAS,
        WA_REASON-BEZEI TO WA_FINAL-BEZEI.
      ENDIF.
      READ TABLE IT_MAKT INTO WA_MAKT WITH KEY MATNR = WA_FINAL-MATNR
BINARY SEARCH.
      IF SY-SUBRC = 0.
        MOVE: WA_MAKT-MAKTX TO WA_FINAL-MAKTX.
      ENDIF.
      READ TABLE IT_VBPA INTO WA_VBPA WITH KEY VBELN = WA_FINAL-VBELN
BINARY SEARCH.
      IF SY-SUBRC = 0.
        MOVE: WA_VBPA-PARVW TO WA_FINAL-PARVW,
        WA_VBPA-KUNNR TO WA_FINAL-KUNNR.
      ENDIF.
      READ TABLE IT_KNA1 INTO WA_KNA1 WITH KEY KUNNR = WA_FINAL-KUNNR
BINARY SEARCH.
      IF SY-SUBRC = 0.
        MOVE: WA_KNA1-NAME1 TO WA_FINAL-NAME1.
      ENDIF.
      APPEND WA_FINAL TO IT_FINAL.
      CLEAR WA_FINAL.
    ENDLOOP.
ENDIF.
ENDFORM. " Z_SELECT
*& Form Z_LAYOUT
FORM Z_LAYOUT .
I_LAYOUT-ZEBRA = 'X'.
I_LAYOUT-TOTALS_TEXT = 'Total'(A00).
I_LAYOUT-SUBTOTALS_TEXT = 'SubTotal'(A01).
I_LAYOUT-BOX_TABNAME = 'IT_FINAL'.
ENDFORM. " Z_LAYOUT
*& Form Z_SORTINFO
FORM Z_SORTINFO USING P_I_SORTINFO TYPE SLIS_T_SORTINFO_ALV.
DATA: I_SORTINFO TYPE SLIS_SORTINFO_ALV.
CLEAR I_SORTINFO.
I_SORTINFO-SPOS = '1'.
I_SORTINFO-FIELDNAME = 'VBELN'.
I_SORTINFO-TABNAME = 'IT_FINAL'.
I_SORTINFO-UP = 'X'.
I_SORTINFO-GROUP = 'UL'. " I.E UNDERLINE AFTER EVERY GROUP
I_SORTINFO-SUBTOT = 'X'.
APPEND I_SORTINFO TO P_I_SORTINFO.
ENDFORM. " Z_SORTINFO
*& Form Z_EVENTCAT
FORM Z_EVENTCAT USING P_I_EVENTCAT TYPE SLIS_T_EVENT.
DATA: I_EVENT TYPE SLIS_ALV_EVENT.
CALL FUNCTION 'REUSE_ALV_EVENTS_GET'
    EXPORTING
      I_LIST_TYPE     = 0
    IMPORTING
      ET_EVENTS       = P_I_EVENTCAT
    EXCEPTIONS
      LIST_TYPE_WRONG = 1
      OTHERS          = 2.
IF SY-SUBRC <> 0.
    MESSAGE ID SY-MSGID TYPE SY-MSGTY NUMBER SY-MSGNO
    WITH SY-MSGV1 SY-MSGV2 SY-MSGV3 SY-MSGV4.
ENDIF.
CLEAR I_EVENT.
READ TABLE P_I_EVENTCAT WITH KEY NAME = SLIS_EV_TOP_OF_PAGE INTO
I_EVENT.
IF SY-SUBRC = 0.
    MOVE 'TOP_OF_PAGE' TO I_EVENT-FORM.
    APPEND I_EVENT TO P_I_EVENTCAT.
ENDIF.
READ TABLE P_I_EVENTCAT WITH KEY NAME = SLIS_EV_PF_STATUS_SET INTO
I_EVENT.
IF SY-SUBRC = 0.
    MOVE 'SET_PF_STATUS' TO I_EVENT-FORM.
    APPEND I_EVENT TO P_I_EVENTCAT.
ENDIF.
CLEAR I_EVENT.
READ TABLE P_I_EVENTCAT INTO I_EVENT WITH KEY NAME =
SLIS_EV_USER_COMMAND .
IF SY-SUBRC = 0.
    MOVE 'USER_COMMAND' TO I_EVENT-FORM.
    APPEND I_EVENT TO P_I_EVENTCAT.
ENDIF.
ENDFORM. " Z_EVENTCAT
*& Form Z_DISPLAY
FORM Z_DISPLAY .
CALL FUNCTION 'REUSE_ALV_GRID_DISPLAY'
EXPORTING
I_CALLBACK_PROGRAM = V_PROGNAME
*I_CALLBACK_PF_STATUS_SET = 'SET_PF_STATUS'
I_CALLBACK_USER_COMMAND = 'USER_COMMAND'
I_CALLBACK_TOP_OF_PAGE = 'TOP_OF_PAGE'
I_GRID_TITLE = V_GRIDTITLE
I_SAVE = 'A'
IS_LAYOUT = I_LAYOUT
IT_FIELDCAT = I_FIELDCAT[]
IT_SORT = I_SORTINFO
IT_EVENTS = I_EVENTCAT
IMPORTING
E_EXIT_CAUSED_BY_CALLER =
ES_EXIT_CAUSED_BY_USER =
TABLES
T_OUTTAB = IT_FINAL
EXCEPTIONS
PROGRAM_ERROR = 1
OTHERS = 2
IF SY-SUBRC <> 0.
    MESSAGE ID SY-MSGID TYPE SY-MSGTY NUMBER SY-MSGNO
    WITH SY-MSGV1 SY-MSGV2 SY-MSGV3 SY-MSGV4.
ENDIF.
ENDFORM. " Z_DISPLAY
*& Form Z_GRIDTITLE
FORM Z_GRIDTITLE .
V_GRIDTITLE = 'ALV FOR SALES ORDER DISPLAY'.
ENDFORM. " Z_GRIDTITLE
*TOP OF PAGE.
FORM TOP_OF_PAGE.
CALL FUNCTION 'REUSE_ALV_COMMENTARY_WRITE'
    EXPORTING
      IT_LIST_COMMENTARY = I_LISTHEADER.
ENDFORM. "TOP_OF_PAGE
*MENU SETTINGS.
FORM SET_PF_STATUS USING RT_EXTAB TYPE SLIS_T_EXTAB.
SET PF-STATUS 'ALV_MENU'.
ENDFORM. "SET_PF_STATUS
*USER-COMMAND
FORM USER_COMMAND USING P_UCOMM TYPE SY-UCOMM
RS_SELFIELD TYPE SLIS_SELFIELD.
DATA : VBELN TYPE VBELN_VA.
CASE P_UCOMM.
    WHEN 'BACK'.
      LEAVE PROGRAM.
    WHEN '&IC1'.
      CLEAR : VBELN.
      VBELN = RS_SELFIELD-VALUE.
      SET PARAMETER ID: 'AUN' FIELD VBELN.
      CALL TRANSACTION 'VA03' AND SKIP FIRST SCREEN.
ENDCASE.
ENDFORM. " USER_COMMAND
*& Form Z_LISTHEADER
FORM Z_LISTHEADER USING P_I_LISTHEADER TYPE SLIS_T_LISTHEADER.
DATA: L_LISTHEADER TYPE SLIS_LISTHEADER.
REFRESH P_I_LISTHEADER.
CLEAR L_LISTHEADER.
L_LISTHEADER-TYP = 'H'.
L_LISTHEADER-INFO = TEXT-001.
APPEND L_LISTHEADER TO P_I_LISTHEADER.
CLEAR L_LISTHEADER.
L_LISTHEADER-TYP = 'H'.
L_LISTHEADER-INFO = TEXT-002.
APPEND L_LISTHEADER TO P_I_LISTHEADER.
ENDFORM. " Z_LISTHEADER
*& Form check_validation_flag
text
--> p1 text
<-- p2 text
FORM CHECK_VALIDATION_FLAG .
IF NOT V_FLAG IS INITIAL.
    LEAVE LIST-PROCESSING.
ENDIF.
ENDFORM. " check_validation_flag

Dynamically loading svg in a jsp

I have an approach to a problem that I've been told is wrong, but wasn't given the solution to. I have a servlet that generates upwards of 100 SVG files for display on the JSP page that is displayed after control is passed from the servlet. Currently, I'm writing out these 100+ SVG files to disk within the servlet, creating a String array of filenames on the fly and adding that array of filenames to the session object. Then, when I generate the JSP page, I loop through that filename array and create HTML embed tags to display the SVG files.
How could I go about doing this without having to write all those SVG files to disk? Is there a way to do this while keeping them in memory?

make the servlet generate the .svg one at a time, based on a parameter.

Interactive SVG in FrameMaker

Is there any way to import an SVG image into a FM document and use any text information in the SVG (on an extra "unlocked layer whilst all others are locked" ) interactively e.g. for referencing purposes or like a hotspot feature?

Thanks for the reply.
The idea with the varuoious single text boxes is quite a work around, not sorry to say - neither really elegant nor really suitable for the task.
I had recalled a feature in a tool called "Catalog Creator" which boasts a so-called "Hot Spot Editor":
"...The graphics can be edited, hotspotted and then saved in the interactiv SVG format. SVG is a W3C web standard and is characterised by a high quality at extreme compression ratio.[...] the hotspots can be detected due to existing layers, fonts, colors, textsizes or other available attributes. Hotspots are not limited to text and geometries, you can also use contour lines to define a hotspot. ..."
The idea was to use the data on the text layer that may be referenced as any other formatted text in FM. So if it is possible to use script (I am just your average FM user, nothing truely fancy) to extract that info then it might be done.
Since Frame Maker doesn't work with layers, it might be able to "use" the layer feature in one of the other Adobe products such as Photoshop or Illustrator.
And if others can do it (See CC) - why shouldn't Adobe itself offer that (some day).
(Maybe I should post this in the "wish list" section)

What am I doing wrong on this interactive SVG? Please help.

I watched the tutorial on youtube on creating the svg and making an interactive color changing character. I have tried to implement it but I’m not doing something right and am a little lost on the code. I was wondering if anyone could tell me what I am doing wrong.
The SVG File
Has 18 groups that can color change each in a different layer but not grouped within the layers
The layer names are as follows
Owl_Wing_Spots
Owl_Wings
Owl_Belly
Owl_Body
Trunk
Leaf_Outline
Leaf_1
Leaf_2
Leaf_3
E2_Ear_Spots
E2_Ear_Tail
E2_Body
E1_Ear_Spots
E1_Ear_Tail
         15. E1_Body
     16. Wall_Color
     17. Bird_Body
     18.   Bird_Butterfly_Wing
I put the notify(this, "select"); on each layer
I referenced http://cdn.edgecommons.org/an/1.0.0/js/min/EdgeCommons.js for the javascript file in AI and I also created a js file that is the same as the one in the video named svg.js (but neither made a difference)
The Edge Animate File
I added the SVG file named “elephant_tree2” and then added the following code to the CompositionReady Area
// Load Edge Commons
yepnope({
load: "http://cdn.edgecommons.org/an/1.0.0/js/min/EdgeCommons.js",
complete: function() {
                        // Enable SVG access
                        EC.accessSVG(sym.$("elephant_tree2")).done(
                                        function(svgDocument){
                                                        // add event listener
                                                        svgDocument.addEventListener("select", function(event) {
                                                                        // Remember selected part
                                                                        sym.setVariable("selectedPart", event.target);
                                                                        // show the id of the selected part in the textfield
                                                                        sym.$("selectedPartTxt").html( event.target.id );
// insert code to be run when the composition is fully loaded here
I added a selectedPartTxt text box and named it that too.
None of the groups on the SVG are recognized and the selectedPartTxt does not change. I suspect it may have something to do with the fact there are groups instead of one part but I don’t know how to fix it.
I was also wondering if someone could tell me how to use an SVG for the color chart too instead of recreating it in Edge Animate. I haven't tried to to the color part of the SVG because I still can't get the mouse click to work when on a group that changes.
Any help would be appreciated.
Thanks!
Cherie

Hi, I had a similar problem and this fixed it.
You know how in the illustrator file, you need to reference a file called svg.js from the edge commons library? Download that file, or write the code in a text editor and save it in a .js file and then make sure that the file is in the same folder as your images called by the adobe edge file.
I hope this works!
Liz

Note on interactive SVG and Edge Commons

I encountered something I want to mention so people do not pull their hair trying to find out which things are not working.
1- issue publishing
If you add a js folder for your js files, Animate v2 will not import it in your web folder - So add it after you have published
2- SVG layer names
If you use uppercase for your layer names, you may have problem using it for adding images for example. This is especially true if your server is Unix because it is case sensitive. It is better to not use uppercase in names.
I used the layer names to add images and of course the server could not read the uppercase. The code was right but the reading was wrong and the images did not load.
Note: in the code below I added 3 lines to take off numbers created when more than one layer had the same name and also took off space when I had more than one word in the name. Not pretty but it works.
var newText = (event.target.id).split("_").join(" ");
var newText2 = (newText).split("1").join("");
var newText3 = (newText2).split(" ").join("");
sym.$('image').attr('src', 'images/'+ newText3 + '.jpg'); // if the layer name is uppercase then the image is not loaded.

Thanks Gil
I guess being case sensitive can make things tricky!
To clarify, you have to keep track of what is what like for javascript. If your files are lowercase then your call needs to be lowercase too. This is exactly what happened. I suppose if my file names had been uppercase then it would have worked but I did not test it.

Two Interactive Report in the same page

I created two interactive report following the suggestion this link
http://roelhartman.blogspot.com/2009/03/two-interactive-reports-on-one-page.html
using an IFRAME
<IFRAME src="f?p=&APP_ID.:24:&SESSION."
style="width:600px;height:600px"
name="details"
scrolling="no" marginwidth="0" marginheight="0"
frameborder="0" vspace="0" hspace="0" />
I am facing two problems.
a. I could see the logo attached to the application in the IFRAME window
b. I could not see the lower bound of the region where the IFRAME is assigned to.
Any suggestion would be of great help.
Thanks in advance
Deb

Hi,
For your first issue.
Use page template to iFrame page that do not contain substitution string LOGO.
E.g. popup page template might not have that.
Or create your own page template with minimal set of substitution strings and regions and use that for iFrame page
Regards,
Jari

IE + SVG = "Cannot display XML page" ?

Dear friends,
   I am from Taiwan. I have a question about SVG display on IE.
   I have a very simply SVG file as the following code. I installed Ferdora R12 with apache web server (192.168.0.8) inside my company.
I installed Tomcat 6.0 on my PC(192.168.0.100, window 7 with IE8.0). I put this SVG file on Fedora, and I can see the vector graphs through
Chrome and Firefox, but not IE(already installed SVG viewer, with the error message as following). I put this SVG file on my PC, I can see the vector graphs by IE, Chrome and Firefox through Tomcat or opening file directly. I even put this SVG file on the web server of my company, and vector graphs can be displayed well through all of IE, Chrome and Firefox.
The problem seems only happen in the situation "Fedora R12 + IE". Do you have any idea of this problem? I really need your help.
Thank you.
======= Code =============
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.//EN"
"http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg id="svg00" version="1.1" xmlns="http://www.w3.org/2000/svg" >
<svg id="svg01" x="0" y="0" width="654.1" height="654.1" version="1.1" xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink">
    <a xlink:href="http://www.w3.org//Graphics//SVG//Overview.htm8">
        <rect x="10" y="10" width="100" height="30" rx="10" ry="10"
              style="fill:lightgrey"/>
        <text x="30" y="30" font-size="12">Click here</text>
    </a>
    <a xlink:href="http://www.ibm.com//developerworks/">
        <circle cx="100" cy="100" r="50" style="fill:grey"/>
        <text x="80" y="100" font-size="12">Or here</text>
    </a>
    <a xlink:href="http://www.ibm.com/" target="new">
        <polygon
              points="60 160,165 172,180 60,290 290,272 280,172 285,250 255"
              style="fill:dimgrey"/>
        <text x="160" y="200" font-size="12">Or even here</text>
    </a>
</svg>
</svg>
==========================
The error message is in Chinese, but I translate it as possible as I can.
====== Error message ==========
Cannot display XML page
Cannot use style table (or form) to view XML input. Please correct this problem and reload this page, or try again later.
Unidentified error with processing resourse
There is something wrong with 'http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd'
=============================

Hi,
The string is not correctly formed ( a quote and a concatenation ) :
Your url :
v_url:=nvl(v_rep_port,'http://'||v_rep_HOST ||':'||v_rep_port||')||'/reports/rwservlet/getjobid'||substr(v_rep,instr(v_rep,'_',-1)+1)||'?'||'server='||v_rep_svr;
The Correction :
v_url:=nvl(v_rep_port,'http://'||v_rep_HOST ||':'||v_rep_port)||'/reports/rwservlet/getjobid'||substr(v_rep,instr(v_rep,'_',-1)+1)||'?'||'server='||v_rep_svr;
Hope it helps
Mohamed Dadi

MapViewer 10.1.2: Interactive SVG in a JSP page

Similar Messages

Maybe you are looking for