Posts Tagged ‘javascript’

How to Script in Adobe Illustrator (Adobe)

Wednesday, January 7th, 2009

[Editor’s note: I get asked frequently how to get into automating Illustrator via scripting. My favorite language is JavaScript (it’s cross platform) but there is also AppleScript (Mac) and Visual Basic (PC). A listing of all my scripts is here, including my recent script for creating calendars. Adobe does a good job of getting you started with several introductory and intermediate manuals. Plus they even offer a free toolkit application for writing the JavaScripts. The new scripting guides for CS4 are up on Adobe’s site, including how to use Flash panel inside Illustrator to make more interesting graphical user interfaces (or hit testing). There’s new information on using TabStops in there over CS3 and documentation on how to script the new Artboards feature. Give it a try!]

Republished from Adobe.com.

ADOBE ILLUSTRATOR CS4 SCRIPTING

A script is a series of commands that tells Illustrator to perform one or more tasks. Adobe Illustrator CS4 supports scripts written in AppleScript, JavaScript or VBScript. Sample scripts are included in the Adobe Illustrator CS4 installer and get installed with the product. The latest available scripting documentation is provided below:

SAMPLES

Adobe Illustrator CS3 FlashPanel Sample

The FlashPanel sample for Adobe Illustrator CS3 shows how to script Illustrator from Flash using ScriptUI’s FlashPlayer control. The sample illustrates how rich user interfaces created by Flash authoring tools such as Adobe Flex Builder 2 can interact with Illustrator’s scripting object model.

Karl Jeacle’s Mortgage Calculator

Tuesday, January 6th, 2009

[Editor's note: With fixed rate home mortgages at new record lows, now is the time to consider refinancing (again). How this is possible in the current financial paradigm, I am not sure. But the tool demonstrated below from Karl will show you how much cash you'll save over the long term by refinancing at a lower rate.]

Republished from Karl’s site.
Links updated 22 Feb. 2009 and 5 March 2009.

Static screenshot below. View the interactive version.

Instructions

The calculator is split into three sections:

  1. Sliders
  2. Graphs & tables
  3. Input boxes

1. Sliders

Move the sliders to set the values of your principal, interest rate, loan length, and mortgage start date.

Up and down arrows at either side of the slider allow the range of values covered by the slider to be adjusted.

The checkboxes on the left of the sliders determine whether principal, interest, term or payment is calculated. By default, the Payment slider checkbox is ticked, meaning that moving the other sliders’ values will calculate the payment. Clicking on another slider checkbox, e.g. Principal checkbox, allows the user to modify term, interest and payment to see the Principal value calculated as these other values change.

2. Graphs & tables

Use the buttons underneath the graphs and tables to choose how you want the output to be displayed:

  • Amortization Graph – this shows how the monthly payments made each year are broken down. Note how the curves show increased principal and decreased interest being paid as time goes by. Also note that extra payments “push” up the principal curve, i.e. the annual principal amount shown is increased by the value of the extra payment.
  • Repayment Chart – the percentage breakdown of the total payments made over the entire mortgage (or indeed, the breakdown of the average monthly payment).
  • Balance Graph – this shows the balance outstanding over the term of the mortgage. It is useful when extra payments are made to visually see how much sooner the mortgage is paid off, and how quickly the balance drops.
  • Interest Graph – this shows the rate of interest used over the term of the mortgage.
  • Annual Amortization Table – how much interest and principal you pay each year.
  • Monthly Amortization Table – how much interest and principal you pay each year, broken down month by month.
  • Monthly Payments Table – the payment amount and any extra payment made each month. Useful when interest rates change or if extra payments reduce monthly payment.
  • Summary – shows a summary of the current values.
  • Settings:
    • Monthly/Bi-weekly payments – Limited support for bi-weekly mortgages is present through this option. When Bi-weekly payments are selected, an extra 1/12th payment is made every month. This equates to making 13 monthly payments every 12 months – a close approximation of how a typical bi-weekly mortgage will work (52 weeks / 2 weeks = 26 half-monthly payments == 13 monthly payments). Note that extra payments are always considered monthly payments, so no equivalent bi-weekly approximation is made.
    • Extra payments – default is to reduce term when extra payments are made, but alternative is to keep term unchanged and reduce monthly payment instead.
    • Interest sliders – You can use either 1/8th increments or decimal places.
    • Dynamic/static – Dynamic calculation means that calculations are done as you move the slider; this is the default. Static means that the calculations are done when you’ve finished dragging the slider.

3. Input boxes

The bottom of the calculator is split in two:

  • Fixed Loan Data
    1. Prepayment data
    2. Extra payments
    3. Interest rates
    4. ARM

The Fixed Loan Data section stays constant while the other four sections can be chosen using the buttons at the bottom of the calculator.

Fixed Loan Data – use this as an alternative to the sliders for entering values. This section is called fixed because it does not take interest rate changes into account. The annual Tax and Insurance fields are simply divided by 12 and added to the monthly payment amount. The inflation figure allows estimates in real terms (i.e. in “today’s money”) to be calculated. The total interest paid over the entire mortgage is shown on the right hand side along with the total interest paid as a percentage of all payments made (see the Repayment Chart for a graphical view). Finally, the total interest paid in real terms (“real interest”) is displayed – this figure is an attempt at calculating how much the total interest paid is worth in real terms.

The four optional sections:

  1. Prepayment Data – this section gives you the opportunity to estimate how you can shorten the term of your mortgage by making either a single one-off payment or continuous extra monthly or annual payments. You must enter a starting month for the prepayment to take effect. The format is simply the month number i.e. 1 for the first month, 2 for the second month and so on. On the right-hand side, the Savings field shows you how much money you will save, while the Real Savings field once again uses the inflation rate to give a rough estimate of what these savings are in real terms given that the interest savings are spread over a number of years. The dates shown reflect what happens to the mortgage term when the extra payments have been factored in.
  2. Extra payments – add up to six extra one-time payments, giving the start and end months numbers to indicate the period when the extra payment is to be made.
  3. Interest rates – add up to five extra interest rates, giving the start and end month numbers to indicate when the interest rate is active. Months outside these ranges will use the fixed loan data interest rate. To specify a period where no principal is paid, enter a start and end month in the interest-only payments section.
  4. ARM – Adjustable Rate Mortgage support is provied in this section. Enter a start month to activate and click on the interest rate graph to view how this section alters the interest rates over the term of the mortgage.

Notes

Enter the nominal interest rate not an APR.
All calculations are performed on a monthly basis.
The figures are estimates only – your lender’s figures will vary!

jquery.timepickr.js (Haineault)

Wednesday, December 3rd, 2008

[Editor’s note: Graceful javascript GUI for setting time based on intuitive method. Thanks Peter!]

Republished from Haineault.com. Get the source code there.

Experimental code !

This is my humble attempt to enhance web time picking.

For the moment I’d call it a toy project, it might stay in experimental state evitam eternam.. I just wanted to see if I could create a better time picker.
I’ve seen lots of time pickers styles and approaches, but none seems to focus on user experience accross many platforms and beautiful degradation.

So I’ve determined a set of goals to achieve a better time picker.

Goals

  • Unobtrusive
  • Graceful degradation
  • Using maximum 2 clicks
  • Intuitive keyboard navigation
  • Be touch friendly (think iphone, tablet pc, etc..)

Demo

View video of GUI in action
(or click on image below, javascript embed don’t work in WordPress, sorry)

Basic usage

$(function(){
    $('#test-1').timepickr({handle: '#trigger-test'});
});

Options

Options Default Description
handle false handle is a dom element which will open the menu upon click
hours true display hours
minutes true display minutes
seconds false display seconds
range24 $.range(0, 24) available hours to pick in 24 format (0, 23)
range12 $.range(0, 12) available hours to pick in 12 format (1, 12)
rangeMin ['00', '15', '30', '45'] available minutes to pick
rangeSec ['00', '15', '30', '45'] available minutes to pick
apm ['am', 'pm'] AM/PM labels
convention 12 hour convention (12 or 24)
val false Initial value
dropslide object dropslide options

Tested browsers

  • Mozilla Firefox 2 (Windows)
  • Mozilla Firefox 3.0.3 (Linux)
  • Mozilla Firefox 3.0.3 (Windows)
  • Epiphany Web Browser 2.22.2 (Linux)
  • Safari 3.1.2 (Windows)
  • Microsoft Internet Explorer 6
  • Microsoft Internet Explorer 7

Todo

  • Internationalization (different time formats, ex 24h)
  • Custom positioning (left, center, right)
  • am/pm mouse follow should be optional
  • Fix remaining behavior bugs
  • Test browser compatibility
  • Make animation more smooth
  • Make all options work
  • Support for seconds
  • Allow custom handler (click clock icon = open picker)
  • keynav: esc = leave & reset
  • keynav: enter, space = commit
  • keynav: arrows = navigate
  • Labels for hour, min, sec
  • Allow custom positioning/orientation of am/pm picker
  • try to make a vertical version of it

Create Calendars Automatically in Illustrator (Kelso)

Thursday, November 20th, 2008

[Editor’s note: I have updated my Calendar script to version 5 on 17 February 2009. Magicien de calendrier, Kalender-Zauberer, Mago del calendario, 日历巫术师, カレンダーの魔法使い, Чудодей календара.

Get version 5 and read more about the changes and see new templates.

WARNING! The information below is OUT OF DATE! ]

[Editor's note: Revised to add example 2009 Ai CS2 format files for download on 4 Dec. 2008.]

ai cs3 logoI was asked recently if I could automate the creation of calendars in Adobe Illustrator. It turns out there are a couple script for accomplishing this in InDesign (best is from sselberg), but only pre-built templates for Illustrator. If you need a new year, you’d have to search for a new template, which is lame. New script to the rescue! Thanks go to Joyce for this suggestion.

No, the script does not create the above calendar. Check out thumbcalendar.com.

Download version 3 of Calendar Script (33k). You will need version CS3 or CS4 of Illustrator.

Examples below for 2009.
Download Adobe Illustrator CS2 version of 2009 calendar. Use the script to build out the rest of the months.
12-up mini
| January.

To install new scripts you need to:

  • Quit Illustrator
  • Copy the files into the Illustrator application folder’s “Presets” » “Scripts” subfolder
  • After restarting Illustrator you can find the scripts in the menu “File” » “Scripts”;
  • TIP: You can create subfolders in the scripts folder to organize your scripts

View video demonstration of script (click to play, 9.3 megs):

There are several sizes of calendars:

  1. Wall calendar, large format boxed dates, 1 month fits on a page, sequential pages.
  2. Page calendar, 12 months fit on a letter sized page.
  3. Mini calendar, 12 months small enough to fit on a business card.
  4. Mini 1 month calendar that fits in a date square in a wall calendar.

Couple problems:

  1. Illustrator lacks tables, so we have to rely on tabs and other text-only options. If you want tables, use the InDesign script mentioned above.
  2. Start week on Monday or Sunday?
  3. Track holidays?
  4. JavaScript doesn’t track leap years for February days in month?!

Objectives:

  1. Create single month, full year, or range of months / years.
  2. Editable text
  3. Stylize via script font family, style, size, etc and change later via character style
  4. Option to put 6th week in 5th week line for wall-calendar style
  5. Multiple size defaults
  6. Multiple size calendars in single Illustrator document
  7. Have a GUI graphic user interface

Future Work:

  1. Use of tab stops. Now you have to redefine the paragraph style for the dayTabs.
  2. Colorize weekends, holidays
  3. Support holidays (absolute and relative)
  4. Moon phase icons?
  5. Draw day grid for wall-calendar size
  6. The • buttons for month and year are not working. They should take you to the current month / year.

New Web 2.0 APIs Make GIS Access and Integration Capability Available to Everyone (ESRI ArcNews)

Thursday, November 13th, 2008

[Editor's note: 2 of 2 articles of note from the Fall 2008 ESRI ArcNews magazine. This about new ArcGIS web 2.0 API services for JavaScript and Flex / Actionscript / MXML allow Google Maps style mashups. Includes informative podcast.]

Republished from ESRI ArcNews.

ArcGIS Server 9.3 Radically Simplifies Users’ Experience

click to enlarge An executive dashboard mashup created with ArcGIS Server that provides city staff the ability to monitor the status of capital improvements, 311 calls, and police patrols.

With the release of ArcGIS 9.3, ESRI provides a new set of application programming interfaces (APIs) that extend the range of what developers can do with mashups. These APIs give mashup developers more opportunities to rapidly build lightweight, focused applications on top of ArcGIS Server using JavaScript, Flex, Silverlight, and many other scripting languages. As a result, organizations can begin deploying an entirely new pattern of mashups, which involves combining internal and external data sources to create an application that solves a particular problem. These mashups more closely match the types of relationships, workflows, and administration developers need to support on a daily basis.

GIS-powered mashups empower users to solve real problems by incorporating the business knowledge and resource investments made by the organization and putting it in the hands of the decision makers and analysts who need to rely on trusted information. For example, a city government might build a mashup that focuses on vacant properties or brownfields to support community planning and economic development. In this case, parcel data might be combined with tools to analyze the development potential of a property based on different scenarios. The tools would appear as a simple button or drop-down menu of choices but, when executed, would access internally hosted information, such as zoning, crime, and infrastructure, and perform server-side analytics on the GIS server. The user would be presented with a hot spot or graduated-color map highlighting the areas that best met the selected criteria. This type of mashup could be used at the front counter or on the desk of an economic development specialist to help engage business and industry owners interested in moving their operation to the community. It would provide access to authoritative data not readily available on the Internet.

click to enlarge ArcGIS Server offers a rich set of tools to build lightweight Web applications.

Until recently, mashups have been thought of as Web applications that aggregate data feeds from multiple Web services into a simple and often social or consumer-oriented Web application. Mapping mashups show the locations of points of interest generated from available services and GeoRSS feeds that contain spatial information, such as addresses or coordinates. Now, organizations are adopting the concept that mashups can be useful for conducting business and providing critical functionality to their users and business partners either over the Web or through internal distribution. Enterprise systems, like customer relationship management (CRM) or asset management systems, can be coupled with ArcGIS Server services to provide business and government managers and analysts with unique access to their authoritative knowledge bases. This means that an enterprise mashup must efficiently and seamlessly blend the GIS platform with the organization’s underlying systems architecture.

ArcGIS Server gives organizations the ability to manage and deploy Web services for mapping, data management, and geospatial analytics. These ArcGIS Server Web services allow organizations to leverage their internal GIS resources, as well as services hosted on other GIS servers, and put them to work in enterprise mashups. Because ArcGIS Server is built on industry and Web standards to support service-oriented architectures (SOAs) and hundreds of data formats, organizations are provided with an integration platform for creating and managing enterprise mashups.

In-depth description of the JavaScript and Flex APIs and podcast links on the next page…

(more…)

ArcGIS Online Services—The Foundation of Web GIS (ESRI)

Thursday, November 13th, 2008

[Editor's note: 1 of 2 articles of note from the Fall 2008 ESRI ArcNews magazine. This about new ArcGIS online services, eg personal "Google maps" style mashups, and pricing.]

Republished from ESRI ArcNews.

Highlights

  • ArcGIS Online premium services are now available.
  • Leverage ArcGIS Online services and ArcGIS APIs in mashups.
  • Use ArcGIS Online content locally via ArcGIS Data Appliance and DataDoors for ArcGIS.

In the past few years, the Web has greatly facilitated the dissemination and sharing of GIS capabilities, leading to the new term Web GIS. This reflects the growing use of the Web as a platform that supports authoring geoprocessing models and maps, then publishing them as services that can be easily consumed by a variety of client applications. Ad hoc consumption of multiple data sources and distributed services makes it easier to find and use geographic information, as well as share it with other GIS professionals, customers, constituents, and the public.

click to enlarge Users can add their own GIS layers to Virtual Earth basemaps.

As an emerging dominant platform for both social and business-driven interaction, Web GIS merges (or mashes up) authoritative content with user-generated content to deliver location-based information and applications to a broader audience. Consumers can view a map showing the locations of gas stations with the lowest prices or analyze the impact a wildfire might have on their home and property. Emergency response officials can use that same wildfire map and add their own data on top of it to analyze how to plan and respond to a worst-case scenario, including routing personnel and equipment and devising evacuation routes for the populations at risk. Local governments can now provide information to their constituents in a more timely and cost-effective manner via the Web, allowing them, for example, to browse homeownership information or parcel records online or inform residents about upcoming street maintenance projects that will impact neighborhood traffic. Common to all these examples is the need for ready-to-use, current, and accurate basemap data that sometimes has to be available on short notice and onto which proprietary data can be easily overlaid, or mashed up, in order to provide information in a useful and meaningful context.

ArcGIS Online Services, powered by ArcGIS Server, can be crawled, indexed, searched, and used to share information and provide analytic capabilities to a broader audience over the Web or a network in the most effective manner. Developers who want to serve live, dynamic mapping applications over the Web can easily implement ArcGIS Online. For example, a viewer application, such as the one featured in the ArcGIS Online Services Resource Center (resources.esri.com/arcgisonlineservices) can be built quickly using the ArcGIS APIs for JavaScript. Users can also add additional content, such as photos or video and sound files.

In-depth description of the online map services, resolutions, coverage and podcasts on the next page…

click to enlarge

(more…)

Using Google Maps to Visualize ArcGIS Data & Services (Google Geo Dev. Blog)

Wednesday, September 3rd, 2008

[Editor's note: This blog joint blog post from ESRI and Google has examples on how to integrate the new 9.4 features with Google Maps Mashups. This includes all the power of GIS geo-processing leveraged into the Mashup environment. I hope this trend continues with the promised release of a Flash/Flex API for ArcGIS.]

Reprinted from Google Geo Developers Blog. Tuesday, August 12, 2008

Hi, I’m Sterling Quinn and I work on the development team for server-based GIS technologies at ESRI in Redlands, California. We’re happy to report that ESRI software users can now expose their GIS in Google Maps through the recently-released ArcGIS JavaScript Extension for the Google Maps API. The extension is built on the Google Maps API and is designed to communicate with ArcGIS Server, ESRI’s product for serving GIS functionality on the Web.

The ArcGIS JavaScript Extension for the Google Maps API allows you to maintain the user-friendly front end of Google Maps while tapping into an advanced GIS on the back end. You can use the extension to display your own maps on top of Google’s, query features in your database and display them on the map, or expose tasks that run GIS analysis models on the server. You can display your results using the Google Maps API’s native graphics engine and info windows.

To learn how to use the ArcGIS JavaScript Extension for the Google Maps API, use the online SDK, which contains basic concepts, an API reference, and examples of how to create custom maps and Mapplets. The examples contain detailed descriptions on how to do things like adding an ArcGIS Server map type button,displaying query results as KML, or running a task on the server to return a route and elevation profile.

Following are some quick links to example Mapplets built with the ArcGIS JavaScript Extension for the Google Maps API. For those of you who don’t know, Mapplets are mini applications that you can add to Google Maps in the “My Maps” tab and are nifty because a user can enable multiple Mapplets at a time.

Cached Map ServiceDisplays an ArcGIS tiled map service over the Google base map.

Census Block QueryRetrieves US Census data from an ArcGIS map service at a point you click and displays it in a series of charts created with the Google Chart API.

Message in a BottleUses an ArcGIS geoprocessing service to tell you where a bottle would drift if you dropped it in the ocean.

Service Area AnalysisUses an ArcGIS geoprocessing service to display drive time polygons from a point you click.

ESRI ArcMap Web Mashup Services (Recap)

Wednesday, July 9th, 2008

The Spring edition of ArcNews recaps some important ESRI announcements about version 9.3′s ability to create mashups on par with Google Maps that were announced at the 2008 ESRI Developer Summit. More than 1,200 developers representing 69 organizations in 49 countries attended the conference. Images and summaries below from ESRI. [ ] enclose my comments.

esri 2008 conf 1

“The ArcGIS 9.3 platform places a much greater emphasis on the Web,” said [Scott] Morehouse [director of Software Development at ESRI]. “The technology platform for GIS has evolved over the years. Initially, the focus was on leveraging minicomputers and workstations with an emphasis on high-performance computing and end-user interactivity. Then, the focus shifted to the database with an emphasis on information modeling and transactional data management. Now, the focus is on the Web. We have been working to put the Web at the center of everything that we’re doing with the ArcGIS system.”

JavaScript and REST APIs

The new APIs were showcased at the Plenary Session and in technical sessions presented by the ArcGIS engineers who developed them. In the REST API session, there were demonstrations of how to use JavaScript, Python, Ruby, and Yahoo! Pipes to access backend REST services powered and published by ArcGIS Server. All resources and operations exposed by the REST API are accessible through a URL.

In the ArcGIS JavaScript APIs session, there were demonstrations on how mashups can be built using JavaScript with REST that add map layers and tasks from ArcGIS Server to Google Maps and Microsoft Virtual Earth. The JavaScript API comes in three flavors: ArcGIS JavaScript API, ArcGIS JavaScript Extension for Microsoft Virtual Earth, and ArcGIS JavaScript Extension for Google Maps. [A Flash based API is also planned].

ArcGIS Server 9.3 Offers New and Enhanced Support for OGC Standards

At 9.3, ArcGIS Server provides enhanced support for the three leading Open Geospatial Consortium (OGC) Web standards: Web Map Service (WMS), Web Feature Service (WFS), and Web Coverage Service (WCS). In addition, with the recent announcement from OGC that Keyhole Markup Language (KML) 2.2 is now an official OGC standard, ArcGIS Server at 9.3 will comply with the OGC KML specification by allowing users to publish their geographic data as KML 2.2. Read more.

esri 2008 conf 3

New Features in ArcGIS Engine 9.3 Coming Soon

ArcGIS Engine developers can also now use the integrated Eclipse 3.3 plug-in to inspect the state of ArcObjects. In addition, ArcGIS Engine 9.3 supports the Java Development Kit version 6 on the latest platforms. Read more.

Land Contracts, Sales Go To Johnson Associates (Kelso via TWP)

Sunday, July 6th, 2008

[Editor’s note: This is my third map that refines the mashup template I’ve been developing for The Washington Post. Data is loaded via XML so the producer doesn’t need to edit the HTML. Option to enable the auto-generated legend below the map (the pop-menu above the map is part of the “legend”). MouseOver tooltip behavior tells the user what the markers are called before they click on them to get full details. Option to zoom in on marker click and get satellite map when the info window is called up.

My favorite feature: on close of the information window that resulted from that marker click the map pans / zooms back to it’s prior location. No more “where was I” moments so common with mashups! Goes with an investigative piece, read that here.

WEB EDITOR: Juana Summers — washingtonpost.com. REPORTERS: Cheryl W. Thompson and Mary Pat Flaherty — The Washington Post. Interactive by Nathaniel V. Kelso — The Washington Post. First published June 6, 2008.]

Since County Executive Jack B. Johnson took office in December 2002, his administration has agreed at least 11 times to sell public land to people with ties to Johnson, including a former business partner, a current business partner and several campaign contributors. Johnson said he has not been involved in awarding any of the contracts and has ordered a review of county procedures for selling public land. Those who won the deals said they were not given special treatment. The projects are mapped below.

Interactive graphic mirrored below. Original available here.

Google Maps Coming to Media, AIR Desktops, via Flash API

Wednesday, May 21st, 2008

Reprinted from  Read Write Web blog (original post here).

 

Written by Marshall Kirkpatrick / May 14, 2008 11:30 AM 


At the Where 2.0 conference today [May 14th] Google announced the availability of a new Flash API for Google Maps. From Flash microsites to embedded media players to beautiful cross-platform AIR apps on the desktop – expect to start seeing interactive Google Maps embedded in a lot of unusual places soon.

A substantial portion of the web’s creativity can be found in the Flash developer community.

Adobe’s AIR platform is one of the hottest development environments in the consumer market today and is being deployed with increasing frequency in the enterprise as well. Live Google Maps in Flash are likely to be used in even more creative ways than the existing javascript API has been. Javascript can be used in AIR but it’s rarely used as attractively as Flash often is.

Too much Flash can be very annoying, but offering Google Maps in Flash only makes sense. We’re excited to see what developers do with it, and we’re far from alone in that excitement.

Greg Sadetsky, CEO of map savvy open source R&D lab Poly9, wrote this morning that “This is great news. There has been a long wait for Google to release an official Flash API for their popular Maps product.” ZDNet’s Google-watching Garett Rogers appeared to have unearthed the API hours before it was presented at the conference, that’s how we knew to start looking around.

Mapping is Hot

The mapping world is exploding right now; from the release of the giant Yahoo! Geo-location database API this week, to the release of control over KML mapping markup by Google last month and the groundswell of developer interest in location-aware applications and frameworks.

Throw some Flash Google Maps into the mix and things are liable to really get interesting. Check out this adorable little Flash Map below.