구글맵 API 를 기본으로 사용하는경우 일본해(동해) 가 기본으로 표기되어진다...


단순히 구글맵을 한국 지역화 하는 방법만으로도 이를 정상적으로 수정하여 사용 할 수 있다.


구글은 안해줘도 우리가 할수있다면 우리가 사용하는 지도 만이라도 수정해서 사용해야하겠다.


보통 구글 API 사용시 상단에 


 <script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?sensor=false"></script>


요 형태의 주소를 넣게되는데, 이때 이 주소 뒤에 지역화 &region=KR 값을 추가해주면 된다.


 <script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?sensor=false&region=KR"></script>





끝!



jqueryUI tab 안에 구글 맵을 삽입하면 이상하게도 가로 사이즈가 특정 부분부터 짤려서 늘어나질 않는다 -ㅅ-;;;

원인은 맵 초기화 함수의 호출 위치~!

보통 body onload 나 $(function(){}); 안에 위치시키는 구글맵 초기화 함수를

tab load 혹은 show 되어 질때 호출 하면 문제는 깔끔하게 해결된다.


[code]
$("#google-map-tab").tabs({
    show: function(event, ui) {
   google_map_initialize(); //map initialize   
    }
});
[/code]

참조 :

Google Maps JavaScript API V3 : 데스크톱 및 휴대기기용 지도 애플리케이션을 위한 솔루션
http://code.google.com/intl/ko-KR/apis/maps/documentation/javascript/

jQueryUI : jquery ui
http://jqueryui.com/

qrcode


최근 스마트폰이 대세를 타면서 더불어 인기를끌고 있는것이있다.
바로 QRcode ~ 스마트폰 사용자라면 한번쯤은 신기하게 사용했었을것이다.

웹사이트나 물건등에 부착되어있는 QRcode 를 스마트폰으로 촬영하면 상품가격정보 혹은 사이트 주소가 나오는 마치 바코드 같은 방식의 하지만 모양은 많이 다른~ 코드.

여러가지 생성 방법들이 존재하지만, 구글 chart api 를 이용한 이미지 링크만으로도 단순하게 만들어낼수있다.( 무슨소린지 몰라도 그냥 아래 예제를 보면 바로 이해하게 될것이다.)

이미지소스 : <img src="
http://chart.apis.google.com/chart?cht=qr&chl=http://skyand96.com&chs=120x120" />

이미지 링크결과 :
QRcode 
눈치가 빠르다거나 프로그램을 살짝이라도 봤었다면 위의 경로만으로도 이해했을것이다.

http://chart.apis.google.com/chart?cht=qr&chl=http://skyand96.com&chs=120x120

이 주소만으로도 QRcode 를 생성하고 업로드하고 호스팅받는 상태로이미지 링크걸고 하는 모든 귀찮은 일들이 한방에 해결된다.

그 주소 내용을 자세히 풀어보면,

http://chart.apis.google.com/chart?

이 부분은 구글의 chart api 경로다 그냥 무조건 똑같이 써준다.

그리고 나서 보이는 물음표 (?) 뒤의 내용들이 중요하다.

cht=qr&chl=http://skyand96.com&chs=120x120

이런부분을 쿼리스트링이라고 하는데 이러한 주소에 붙는 쿼리스트링들은 일련의 규칙이 있다.

변수=값&변수=값&변수=값&변수=값

머대략 이런건데 변수란말은 대충 넘기고, 우리가 필요한 QRcode 를 표한하는 속성 이라고 이해하면 된다.

즉,  속성=값&속성=값&속성=값&속성=값 이정도로 이해하면 되겠다.

cht=qr 이부분은 qr코드를 추출한다는 소리며, 기본이니 그냥 그대로 사용하자.

chl=http://skyand96.com 이부분은 보이는거처럼 QRcode로 추출할 홈페이지주소(혹은 원하는글자/숫자) 가되겠다.
 
즉 , chl=원하는글자

요런식으로 변경하자.

chs=120x120

예상한대로 이부분은 QRcode 의 사이즈를 의미한다. 가로x세로 크기를 넣어주면된다.

각각의 속성과 값은  & 로 붙여서 연결해서 주소를 완성해주면 된다.


http://chart.apis.google.com/chart?cht=qr&chl=원하는주소&chs=240x240


더 상세한 내용은 아래 표는 해당 api의 속성 을 참고하자.

이외에도 많은 차트 형식의 api를 제공하고 있다 (하단 구글 api chart 링크 참조)
Parameter Required or Optional Description
cht=qr Required Specifies a QR code.
chs=<width>x<height> Required Image size.
chl=<data> Required The data to encode. Data can be digits (0-9), alphanumeric characters, binary bytes of data, or Kanji. You cannot mix data types within a QR code. The data must be UTF-8 URL-encoded. Note that URLs have a 2K maximum length, so if you want to encode more than 2K bytes (minus the other URL characters), you will have to send your data using POST.
chd NOT USED QR codes are unusual in that the chd parameter is ignored. Don't include it in your URL.
choe=<output_encoding> Optional How to encode the data in the chart. Here are the available values:
  • UTF-8 [Default]
  • Shift_JIS
  • ISO-8859-1
chld=<error_correction_level>|<margin> Optional
  • error_correction_level - QR codes support four levels of error correction to enable recovery of missing, misread, or obscured data. Greater redundancy is achieved at the cost of being able to store less data. See the appendix for details. Here are the supported values:
    • L - [Default] Allows recovery of up to 7% data loss
    • M - Allows recovery of up to 15% data loss
    • Q - Allows recovery of up to 25% data loss
    • H - Allows recovery of up to 30% data loss
  • margin - The width of the white border around the data portion of the chart. This is in rows, not in pixels. (See below to learn what rows are in a QR code.) The default value is 4.

참조 : http://code.google.com/intl/ko-KR/apis/chart/docs/gallery/chart_gall.html

FCKeditor JavaScript API

FCKeditor offers a complete JavaScript API so you can interact with it once the editor is loaded and running.

Once loaded, the editor registers a global object called FCKeditorAPI. This object offers the entry point to interact with any editor instance placed in a page (you can have more than one).

NOTE: The FCKeditorAPI object will not be available during the page load. You need to wait for the editor to be loaded to use it. If you need to interact with the editor right after is has been loaded, use the "FCKeditor_OnComplete" function (see Events).

Retrieving an Editor Instance

  • From out of an external script
    When placing the editor in the page, you give it an "instance name". To retrieve it, you must simply call the FCKeditorAPI.GetInstance method.
    Example:
    var oEditor = FCKeditorAPI.GetInstance('InstanceName') ;
    
  • From out of a dialog of the editor
    Call the InnerDialogLoaded to get the FCKObject.
    Example:
    var oEditor = window.parent.InnerDialogLoaded().FCK ;
    

Both methods return the main FCKeditor object that gives the necessary bridge to interact with it. These are the most useful properties and methods of this object:

Properties:

  • Name = ( string ) - the instance name.
  • Status = ( integer ) - the editor status (loading status).
  • EditorDocument = ( object ) - the DOM Document object for the editing area.
  • EditorWindow = ( object ) - the DOM Window object for the editing area.

Methods:

  • AttachToOnSelectionChange( functionPointer )
  • Focus()
  • SetHTML( html ), or SetData( html ) - sets the contents of the editor. Note that when using this method, you will loose any listener that you may have previously registered on the editor.EditorDocument.
  • GetHTML( formatted ), or GetXHTML( formatted ), or GetData( formatted ) - retrieves the edited html from the editor.
  • InsertElement( element )
  • InsertElementAndGetIt( e )
  • InsertHtml( html ) - inserts HTML in the current cursor position
  • IsDirty() - checks if the content in the editor has been changed
  • MakeEditable()
  • ResetIsDirty() - resets the dirty state
  • SwitchEditMode()
  • UpdateLinkedField()

Events

Once the editor loading phase is complete and it is ready to use (and interact with JavaScript), a standard function is called in the page that contains the editor, if the function is defined. This function must be named "FCKeditor_OnComplete" and receives the related editor instance as the parameter. Using it, you can execute any initial code that may interact with the editor. This is a declaration example:

function FCKeditor_OnComplete( editorInstance )
{
    alert( editorInstance.Name ) ;
}

Other than the above standard function, every FCKeditor instance has an "Event" object that can be used to listen for events to be fired.

Example: the following code listens for the "OnSelectionChange" to execute custom code:

function FCKeditor_OnComplete( editorInstance )
{
    editorInstance.Events.AttachEvent( 'OnSelectionChange', DoSomething ) ;
}

var counter = 0 ;

function DoSomething( editorInstance )
{
    // This is a sample function that shows in the title bar the number of times
    // the "OnSelectionChange" event is called.
    window.document.title = editorInstance.Name + ' : ' + ( ++counter ) ;
}

Note that every event callback function receives the editor instance as a parameter.

The following is the list of events available:

  • OnAfterLinkedFieldUpdate - fired right after the hidden linked field attached to the editor has its contents updated. It happens usually when the form is being posted.
  • OnAfterSetHTML - fired once the HTML is loaded in the editor (including when changing views).
  • OnFocus - fired when the editor acquires the focus.
  • OnPaste - fired when something is pasted in the editor. The function you specify must return true for the paste to proceed.
  • OnStatusChange - fired when the editor status changes. The following constants are also available globally in the page: FCK_STATUS_NOTLOADED, FCK_STATUS_ACTIVE and FCK_STATUS_COMPLETE.
  • OnSelectionChange - fired when the actual selection in the editor area changes (including cursor position and keystrokes). Note: In IE, this event does not fire on every keystroke, but only on some random keystrokes.

Usage Samples

The following are a few samples of things that can be done with the JavaScript API. (In these samples, oEditor = FCKeditorAPI.GetInstance('InstanceName').)

  • Insert HTML at cursor position:
    oEditor.InsertHtml(HTML);
  • Triggering a toolbar button / command:
    oEditor.Commands.GetCommand(commandName).Execute();
  • Disabling toolbar buttons:
    oEditor.EditorWindow.parent.FCKToolbarItems.LoadedItems[commandName].Disable();
  • Setting a config value:
    oEditor.Config['<configVariableName>'] = 'newValue';
  • Change editor document style at runtime:
    oEditor.EditorDocument.body.style.cssText += 'color: #322805; background-color: #F7C928;' ;
  • Set or get anything of the editor:
    FCKeditorAPI.GetInstance('InstanceName').EditorWindow.parent...
  • Add a dynamic Save function:
// called on save
function doSave(){
        alert('Saved.');
        document.getElementById('someElement').innerHTML = 'Saved!';
        return false; //this disables default action (submitting the form)
}
// called when FCKeditor is done starting..
function FCKeditor_OnComplete( editorInstance ){
        editorInstance.LinkedField.form.onsubmit = doSave;
}
  • Working with the selection in the editor: Use the Selection Object

'프로그래밍' 카테고리의 다른 글

Windows Script Host  (0) 2009.09.18
FCKeditor JavaScript API  (0) 2009.06.10
PTviewer-속성  (0) 2008.01.04
마이크로소프트 닷넷, 소스 공유한다  (0) 2007.10.08

+ Recent posts

티스토리 툴바