Fusion Charts Graficos DWCS3

79
Información general> Introducción Bienvenido a la documentación del producto de FusionCharts para Dreamweaver. El propósito de este documento es describir las principales características de este componente y para ayudarle a aprender todos los aspectos del producto en detalle. La documentación del producto se ha dividido en los módulos siguientes: • Información general • Creación de su primera carta • Creación de gráficos • Configuración de datos de un gráfico • Configuración de los parámetros de gráfico • Configuración de la gráfica avanzada • Estilo • Solución de problemas En caso de encontrar algún problema al utilizar FusionCharts para Dreamweaver, no dude en contactar con nuestro equipo de soporte en [email protected], nos comprometemos a responder a sus preguntas dentro de un día de trabajo. Le deseamos un momento gratificante la lectura de esta documentación, y esperamos con interés recibir sus valiosos comentarios. Saludos cordiales, Jon Stanciu Extend Studio Presentación> Acerca de FusionCharts para Dreamweaver

Transcript of Fusion Charts Graficos DWCS3

Page 1: Fusion Charts Graficos DWCS3

Información general> Introducción Bienvenido a la documentación del producto de FusionCharts para Dreamweaver.

El propósito de este documento es describir las principales características de este componente y para ayudarle a aprender todos los aspectos del producto en detalle.

La documentación del producto se ha dividido en los módulos siguientes:

• Información general • Creación de su primera carta • Creación de gráficos • Configuración de datos de un gráfico • Configuración de los parámetros de gráfico • Configuración de la gráfica avanzada • Estilo • Solución de problemas En caso de encontrar algún problema al utilizar FusionCharts para Dreamweaver, no dude en contactar con nuestro equipo de soporte en [email protected], nos comprometemos a responder a sus preguntas dentro de un día de trabajo.

Le deseamos un momento gratificante la lectura de esta documentación, y esperamos con interés recibir sus valiosos comentarios.

Saludos cordiales, Jon Stanciu

Extend Studio

Presentación> Acerca de FusionCharts para Dreamweaver

¿Qué es FusionCharts para Dreamweaver?

FusionCharts para Dreamweaver es una solución de gráficos que permite a los usuarios de Dreamweaver CS3 (o superior) para crear atractivos gráficos basados en Flash para sus sitios web desde dentro de la aplicación Dreamweaver.

Page 2: Fusion Charts Graficos DWCS3

FusionCharts para Dreamweaver ofrece una sencilla interfaz gráfica de usuario que hace que la tarea de proporcionar datos para el gráfico y la configuración de las propiedades del gráfico extremadamente fácil. Usted puede proporcionar los datos del gráfico, ya sea por la introducción manual de datos en el interfaz o pegar datos de una tabla ya existente. FusionCharts para Dreamweaver también puede trabajar con los datos proporcionados en forma externa de un CSV / archivo XML. Esencialmente FusionCharts acepta sólo los datos en formato XML. Sin embargo, con el fin de utilizar FusionCharts para Dreamweaver usted no tiene que conocer el XML ni Flash. Todo lo que tienes que hacer es proporcionar datos y configurar las propiedades del gráfico con la interfaz de usuario y FusionCharts para Dreamweaver hará todo el trabajo duro por usted. Dado que los gráficos creados con FusionCharts para Dreamweaver es compatible con todos los navegadores, usted puede estar seguro de que los gráficos se hacen en casi cualquier ordenador.

¿Quién puede usarlo?

FusionCharts para Dreamweaver puede ser utilizado tanto por aficionados y profesionales. Desde FusionCharts para Dreamweaver le permite personalizar cada aspecto de su gráfico - usted puede hacer fácilmente la combinación gráfica con la apariencia de su sitio. Usted puede incluso utilizar FusionCharts para Dreamweaver para trazar gráficos de forma dinámica en el lado del cliente con los datos recuperados de una base de datos.

Introducción Requisitos del sistemaLos siguientes son los requisitos básicos para el uso de FusionCharts para Dreamweaver;

• Sistema operativo: Windows 2000 (y superior), Mac OS X 10 (o más)• Extensión de destino: Adobe Dreamweaver CS3 (y más)• Tiempo de ejecución: Flash Player 9 (o superior)• Navegador: Compatible con todos los navegadores

Información general> Instalación

Los FusionCharts para extensión de Dreamweaver se puede instalar usando el Adobe Extension Manager, una herramienta que se instala automáticamente en el momento de la instalación de Adobe Dreamweaver. Si usted no tiene Adobe Extension Manager en el equipo - se puede descargar desde los siguientes recursos:

• Windows versión de Adobe Extension Manager• Macintosh versión de Adobe Extension ManagerLos pasos siguientes le guiarán a través del proceso de instalación y registro de la extensión.

Page 3: Fusion Charts Graficos DWCS3

1. Abra Adobe Extension Manager, desde la lista desplegable que se encuentra en la barra de herramientas - elegir la versión de Dreamweaver que actualmente está instalado en su ordenador. Tenga en cuenta, FusionCharts para DW sólo se puede utilizar con Dreamweaver CS3 y por encima, de modo que, si usted está usando una versión anterior de Dreamweaver le tendría que actualizar a CS3 o superior.

2. Seleccione Instalar extensión en el menú Archivo o haga clic en el botón Instalar extensión - que es el primer botón de la izquierda en la barra de herramientas. Una selección de archivos cuadro de diálogo se mostrará en el cuadro de diálogo, busque el archivo. Mpx de la carpeta donde haya extraído el paquete descargado.

Page 4: Fusion Charts Graficos DWCS3

3. Usted se presenta con un descargo de responsabilidad, después de leer los términos y condiciones de la exención de responsabilidad - haga clic en el botón Aceptar para continuar con la instalación. Un cuadro de alerta aparecerá cuando la instalación ha terminado.

Page 5: Fusion Charts Graficos DWCS3

Descripción de Registro

Los pasos siguientes se explica el proceso de registro:

1. Abra la aplicación Dreamweaver - usted encontrará que una ficha para FusionCharts DW ha aparecido en la barra de herramientas Insertar. En el caso, la barra de herramientas Insertar no se muestra - ponerla por seleccionar Insertar en el menú de Windows.

2. Activar los FusionCharts para DW ficha haciendo clic en él, usted notará que una barra de herramientas se ha mostrado justo debajo de la barra de herramientas Insertar - esta es la barra de herramientas de FusionCharts para DW. A continuación, haga clic en el gráfico simple Insertar / Insertar botón Compuesto gráfico que se encuentra en la barra de herramientas para FusionCharts DW - para mostrar las FusionCharts para la interfaz de DW. Se le pedirá que introduzca la clave de licencia, introduzca la clave de licencia en el campo de texto correspondiente y haga clic en el botón Aceptar - esto completa el proceso de instalación y registro, que ahora está listo para crear gráficos para sus sitios utilizando FusionCharts para DW. En caso de encontrar algún problema al registrarse FusionCharts para DW - por favor consulte la página de preguntas frecuentes para obtener ayuda.

Información general> Lista de los tipos de gráfico

FusionCharts para Dreamweaver le proporciona una selección de 34 tipos de gráficos que han sido divididos en cuatro categorías distintas. Estas son Single Charts de la serie, Gráficas múltiples de la serie, Gráficas apiladas y gráficos de combinación.

Page 6: Fusion Charts Graficos DWCS3

La siguiente es una lista de categoría de todos los tipos de gráficos compatibles con FusionCharts para Dreamweaver.

Ejemplos de Listas individuales de la serie de múltiples ejemplos de Listas de la serie Stacked Ejemplos Ejemplos de Listas de Gráficos de combinación

FusionCharts para Dreamweaver le permite realizar los gráficos de desplazamiento. Sin embargo, esta característica sólo está disponible en ciertos tipos de gráficos. Para ver ejemplos de cartas desplazables por favor haga clic aquí.

Presentación> La Interfaz

Una vez que haya instalado los componentes FusionCharts para Dreamweaver, te darás cuenta de una nueva «FusionCharts para DW 'en la pestaña" Insertar "del panel. En caso de que usted no ve el "Insertar" del panel, puede que aparezca, seleccione el 'Insertar' opción en el menú 'Window'. Después de traer el "Insertar" del panel, seleccione 'FusionCharts para DW' en la ficha.

La barra de herramientas FusionCharts

Al hacer clic en los 'FusionCharts para DW' ficha hará que se destacan y la barra de herramientas FusionCharts para mostrar. La barra de herramientas FusionCharts contiene cuatro botones, 'Insertar gráfico simple "," Insertar gráfico Compuesto "," Tabla de Edición "y" Eliminar Tabla ".

• Insertar gráfico simple: Este botón se utiliza para el lanzamiento de la interfaz de usuario

Page 7: Fusion Charts Graficos DWCS3

para crear gráficos simples, tales como gráficos de la serie individual, Gráficas Multi Series y los gráficos apilados. • Insertar gráfico Compuesto: Este botón se utiliza para el lanzamiento de la interfaz de usuario para la configuración de gráficos de combinación.

• Edición Gráfica: Este botón sólo funciona cuando hay un gráfico existente ha sido seleccionado. Al hacer clic en este botón se iniciará la interfaz de usuario que muestra los datos y las configuraciones de gráficos de la tabla seleccionada. Si hace clic en este botón, sin seleccionar primero un gráfico existente, un cuadro de alerta se mostrará para informarle de que no hay ningún gráfico ha sido seleccionado.

• Eliminar Gráfico: Este botón se utiliza para eliminar un gráfico existente, eliminar un diagrama de todo lo que necesitas hacer es seleccionar la tabla y haga clic en el botón "Eliminar Tabla".

La interfaz de usuario FusionCharts

Ahora, vamos a presentar a la interfaz de usuario FusionCharts. Con el fin de que aparezca la interfaz de usuario tiene que abrir por primera vez una página que forma parte de un sitio existente. Usted puede iniciar la interfaz de usuario haciendo clic en el botón 'Insertar gráfico simple' o en 'Insertar Tabla Compuesto' botón.

Page 8: Fusion Charts Graficos DWCS3

FusionCharts interfaz de usuario

La interfaz ofrece un diseño de pestañas para la configuración gráfica rápida y fácil. Hay tres pestañas en la interfaz de usuario que son:

• Data Grid: Se utiliza para configurar los datos del gráfico. • Tabla de selección: Aquí es donde se llega a seleccionar un tipo de gráfico y configurar las propiedades correspondientes a un elemento gráfico en particular.

• Opciones generales: Permite configurar las propiedades globales del gráfico (por ejemplo, tipos de letra, tamaño carta, etc.)

La pestaña 'Data Grid' está seleccionada por defecto y las distintas opciones relativas a la entrada de datos se muestran int el panel de abajo. Al hacer clic en cualquier otra ficha se te puso de relieve y el contenido de la pantalla de abajo cambiará en consecuencia.

Minimización de la interfaz

Mientras trabajaba con FusionCharts para Dreamweaver es posible que desee reducir al mínimo la interfaz con el fin de trabajar en sus páginas de Dreamweaver. Para lograr esto basta con hacer clic sobre los 'FusionCharts para DW' punto de acceso que se encuentra justo debajo de la barra de título - hacer clic en el mismo lugar una vez más hará que la interfaz para maximizar.

FusionCharts para la interfaz de Dreamweaver en el modo de reducir al mínimo

Ayuda Contextual

Ayuda contextual es una función muy útil de las FusionCharts para la interfaz de Dreamweaver. A lo largo de la interfaz se encuentran los botones pequeños con un "?" símbolo al lado de cada opción configurable. Al hacer clic en el botón, aparecerá una información sobre herramientas con una breve descripción acerca de la repercusión funcional de la opción configurable.

Page 9: Fusion Charts Graficos DWCS3

Su primer cuadroVamos a ver lo fácil que es crear un gráfico en FusionCharts para Dreamweaver. En primer lugar, sería necesario para completar la configuración básica, como se discutió en la sección de instalación.

Para insertar un gráfico, siga estos sencillos pasos:

1. Abra la página donde desea insertar el gráfico. La página debe ser parte de un sitio definido en Dreamweaver.

2. Travel a la ubicación en la página donde desee insertar la página, y abrir la interfaz. Para obtener más información acerca de la interfaz, visite la sección de interfaz.

Una página de muestra en un sitio de Dreamweaver

3.El interfaz contiene un conjunto predeterminado de datos. Por lo tanto, no tiene que preocuparse por el suministro de datos. Los datos por defecto para la tabla es, Los datos por defecto

Page 10: Fusion Charts Graficos DWCS3

4.Just presione el botón "Aceptar" y el código de la tabla se integrará dentro de la página. En la vista de diseño, como se ve,

El gráfico incrustado en la vista de diseño

Y en la vista de código, como se ve,

El gráfico incrustado en la vista de código

Page 11: Fusion Charts Graficos DWCS3

5.El carta real en la página web es el siguiente:

La página HTML real

Page 12: Fusion Charts Graficos DWCS3

Su primer gráfico> Gráfico de ventas simple En esta sección le mostraremos cómo crear un gráfico de serie de una sola columna para mostrar las ventas de una empresa para el último trimestre de 2008. La siguiente tabla muestra los datos que vamos a utilizar para el gráfico.

Configuración de los datos del gráfico Los pasos siguientes le guiarán a través del proceso de configuración de datos del gráfico.

1.Cree una página html en blanco en el directorio raíz de su sitio de Dreamweaver y el nombre de 'chart.html'. No es obligatorio que el nombre es chart.html "- se puede utilizar un nombre de su elección. Ahora, haga clic en el botón 'Insertar gráfico simple ", que se encuentra en la barra de herramientas FusionCharts, este pondrá en marcha la interfaz de usuario para la configuración de una tabla sencilla.

2.Now, tenemos que configurar los datos de nuestra tabla. Esto se hace en la pestaña "Data Grid". La pestaña 'Data Grid' contiene una tabla de datos de ejemplo - borrar los datos de la muestra al hacer clic en el botón 'Cambiar datos'.

3.Utilice el "Añadir columna 'para crear columnas de la tabla de datos. Desde nuestra tabla de datos contiene dos columnas, de modo que, usted tiene que hacer clic en el botón "Añadir columna" dos veces para crear dos nuevas columnas. Tenga en cuenta que dos columnas con un índice de la columna 'A' y 'B' se han creado.

4.Utilice el "Añadir fila 'para crear filas de la tabla de datos. Necesitaríamos 3 filas de nuestra mesa - nota, que la tabla de datos se muestra más arriba consta de 4 filas, pero sólo será la creación de 3 filas, esto es debido a los encabezados de columna no deben ser agregados en la tabla de origen FusionCharts datos. Las nuevas filas que se han creado se numeran desde la '1 ', '2' y '3 respectivamente.

5.Ahora que el cuadro está listo, podemos comenzar a introducir los datos, haga clic en la primera celda de la primera fila y el tipo de 'Octubre', pulse la tecla de tabulación del teclado para mover a la siguiente celda y escriba el valor '75000 '. Complete con las restantes dos filas haciendo referencia a la tabla de datos (por encima). Por favor, no introduzca caracteres no numéricos, tales como '$' o ',' en la columna "B".

Page 13: Fusion Charts Graficos DWCS3

6.Ahora que la mesa está lista ya es hora de clasificar las columnas en las categorías y de la serie. En nuestro caso, la columna "A" es la columna "Categorías", ya que se trazan a lo largo del eje X del gráfico, y la columna "B" es la columna "de la serie. Seleccione la columna "A" haciendo clic en el índice de la columna y haga clic en "Añadir como categorías de botón - para designarlo como una columna de categorías. Ahora, seleccione la columna "B" y haga clic en "Añadir como series 'para designarlo como una serie.

7.In los "datos que definen al ser plottedSection de la" pantalla de cuadrícula de datos ", se puede asignar un nombre a las columnas de la serie. Nombre de la columna de la serie como 'ventas'.

Su primer gráfico> Selección del tipo de gráfico En esta página, vamos a continuar con nuestro ejemplo simple lista de ventas de la sección anterior. Aquí vamos a definir el tipo de gráfico que se muestra. Estamos limitados por el hecho de que hemos proporcionado una sola serie de tipo de datos en la sección anterior. Por lo tanto, vamos a elegir una sola serie de columnas-3D gráfica para este ejemplo.

Selección de un tipo de gráfico y el establecimiento de las propiedades del gráfico Haga clic en la pestaña "Cuadro de selección 'para cambiar a la pantalla" Cuadro de selección'. Aquí se puede elegir un tipo de gráfico de entre todas las opciones disponibles. Las cartas se clasifican en tres categorías individuales de la serie Gráficas, Gráficas Multi Series y los gráficos apilados. Seleccione el gráfico en 3D columna de la categoría de serie único.

Page 14: Fusion Charts Graficos DWCS3

El tipo de gráfico del panel de selección

Ahora desplácese hacia abajo hasta la parte inferior de la pantalla 'Opciones Generales', y haga clic en el botón "Vista previa abierta 'para ver el gráfico. Finalmente haga clic en el botón "Aceptar" para incrustar el gráfico de nueva creación en su página web.

Page 15: Fusion Charts Graficos DWCS3

Ventana de vista previa

FusionCharts utiliza un método de JavaScript para incrustar el gráfico en su página web, si nos fijamos en el código fuente de la página, podrás ver el código que se utiliza para incrustar el gráfico en su página. También, observe que una 'incluye' carpeta se ha creado dentro del directorio raíz de su sitio que contiene el archivo SWF FusionCharts y archivos JavaScript.

Ahora puede abrir la página en un navegador para ver el gráfico por primera vez en acción.

Su primer gráfico> Especificación de los parámetros de gráfico En la sección anterior hemos definido el tipo de gráfico para nuestro ejemplo. En esta sección iremos añadiendo varios parámetros para el mismo gráfico.

Configuración de las propiedades del gráfico Los pasos siguientes le guiarán a través del proceso de configuración de las propiedades básicas de gráficos.

1.Utilice la barra de desplazamiento para ver la parte inferior de la pantalla "Opciones de gráfico". Haga clic en los "títulos y nombre de eje" del panel para expandirlo. Introduzca el 'Mes' como el valor de 'XAxisName' campo, y 'Ventas' como el valor de 'yAxisName' campo. 2.Haga clic en la pestaña 'General Options' para cambiar a la pantalla 'Opciones Generales'. Proporcionar un nombre para el gráfico en el campo "Nombre de gráfico" y también establecer la altura y la anchura de la tabla - especificando el valor en sus respectivos campos. Para este ejemplo se puede nombrar a la carta como "MyFirstChart" y establecer la altura y el ancho de 400 píxeles y 300 píxeles respectivamente, 3.Busque abajo la pantalla 'Opciones Generales' para ver la 'Leyenda, Subcaption de un grupo especial, a continuación, expanda haciendo clic en él. Introduzca un título y subtítulos secundaria de la carta en sus respectivos campos. Esta carta será subtitulado 'Las ventas trimestrales de gráfico "y sub subtitulado' Año 2008 '. 4.Compruebe "Mostrar opciones avanzadas de control boc que se encuentra en la parte superior de la pantalla 'Opciones Generales'. Ahora, vaya a la "formato de número y ampliación de un grupo especial y entrar en" $ "en el campo" Prefijo de número ».

Page 16: Fusion Charts Graficos DWCS3

Número panel de formato

Por lo tanto, ahora tenemos una tabla con definido altura / anchura, los nombres de los ejes, el título y el prefijo de número. Nuestra nueva carta después de añadir los parámetros se verá como sigue:

Tabla con parámetros adicionales

Si ya está entusiasmado con lo que puedes hacer con estas cartas, sólo tiene que esperar hasta la siguiente sección donde añadir estilos a nuestras listas de éxitos.

Su primer cuadro Estilos DefiniciónLos estilos se pueden utilizar para mejorar la apariencia de uno de los elementos del gráfico, aquí vamos a mostrar - como mejorar el aspecto de la leyenda del gráfico

Page 17: Fusion Charts Graficos DWCS3

mediante un estilo de fuente.

1. In el título, el panel de Subcaption - haga clic en el botón Definición de Estilo de los subtítulos para lanzar el panel de estilos.2. Sevral tipos de estilo se muestran a lo largo del la esquina superior izquierda del panel Estilos. Puesto que vamos a definir un estilo de fuente para el título de tabla - seleccionar destino la opción de fuente de la lista de los tipos de estilos disponibles. Ahora, seleccione la casilla de verificación Usar este estilo - los parámetros del estilo de fuente en la pantalla.

3. Seleccione un tipo de letra para el título con la caída de la fuente la lista desplegable a continuación, establecer el tamaño del texto a 20 y cambiar el color de la fuente de

Page 18: Fusion Charts Graficos DWCS3

cualquier color de su elección.4. Cambie el color del fondo del texto y el borde de texto para el uso de colores de su elección, el texto conjunto margen de la celda a 20 y espaciado de la fuente de 5 píxeles. Por último, haga clic en Aceptar para aplicar este estilo a la leyenda del gráfico.

Creación de gráficos Gráfico> Serie Individual En esta sección le mostraremos cómo crear un gráfico de serie de una sola columna para comparar las ventas de una empresa para el año 2007 con unas ventas para el año 2008. La tabla de datos A continuación se utiliza para crear el gráfico.

Antes de proceder a crear el primer gráfico sola serie, le sugerimos que vaya a través del módulo 'Tu primer gráfico ", como algunas de las técnicas que se necesitan para crear un gráfico de varias series se han descrito en detalle en el que,

Page 19: Fusion Charts Graficos DWCS3

Los siguientes son los pasos para crear un gráfico de serie de una sola columna;

Pantalla de 1.In el "Data Grid '- crear una tabla con 2 columnas y 4 filas. A continuación, llenar los datos en la tabla haciendo referencia a la tabla de datos (por encima).

2. Now tenemos que clasificar los datos en 'Categorías' y 'Series'. Seleccione la columna "A" y designar como una categoría, haga clic en "Agregar a la categoría 'botón. 'B' de la columna siguiente, designado como una serie con el 'Agregar a la serie' botón.

3. In la parte inferior de la pantalla "Data Grid" - Nombre de la columna 'B', como '2007 'y seleccionar un color para la serie - con el selector de color o introduciendo un código hexadecimal en el campo de texto correspondiente. Su pantalla de "Data Grid" debería ser ahora como bajo.

4. Switch a la pestaña "Cuadro de selección 'y seleccione el' Column 'opción gráfico de la categoría gráfica de una sola serie.

Page 20: Fusion Charts Graficos DWCS3

5. Abra de los títulos y los nombres de los ejes de los paneles, y entrar en el 'xAxiaName' y 'yAxisname' en los campos respectivos, para esta tabla vamos a definir el nombre de eje x como 'Barrio' y el nombre de eje y como ' Ventas '.

6. Switch a la pantalla "Opciones Generales '- y el nombre de' myfirst_ss_chart 'la carta y establecer la anchura y la altura de 400 píxeles y 300 píxeles respectivamente.

7. In la "Leyenda, Subcaption de un grupo especial - Establecer el título como 'ventas' y el título Sub como" Para el año 2007 '.

8.Check 'Mostrar opciones avanzadas de la casilla de verificación que se encuentra en la parte superior de la pantalla' Opciones Generales '. Ahora, vaya a la "formato de número y ampliación de un grupo especial y entrar en '$' en el 'NumberPrefix campo".

9.Use el botón "Vista previa abierta 'para ver el gráfico a continuación, haga clic en el botón' OK 'para incrustar el gráfico en su página web.

Page 21: Fusion Charts Graficos DWCS3

Ahora está listo para abrir la página en un navegador y ver sus 1300series individuales trazar en la acción

Creación de gráficos Gráfico> Serie MultiEn esta sección le mostraremos cómo crear un gráfico de columnas múltiples de la serie para comparar las ventas de una empresa para el año 2007 con unas ventas para el año 2008. La tabla de datos A continuación se utiliza para crear el gráfico.

Page 22: Fusion Charts Graficos DWCS3

Antes de proceder a crear su primera Serie Multi-gráfico, le sugerimos que ir a través de la sección 'Tu primer gráfico ", como algunas de las técnicas que se necesitan para crear un gráfico de varias series se han descrito allí.

Los siguientes son los pasos para crear un gráfico de columnas múltiples de la serie:

En la pantalla 'Data Grid' - crear una tabla con 3 columnas y 4 filas. A continuación, llenar los datos en la tabla haciendo referencia a la tabla de datos (por encima). Una vez que haya completado el proceso de entrada de datos, los datos de la red debe ser lo más bajo.

Ahora tenemos que clasificar los datos en 'Categorías' y 'Series'. Seleccione la columna "A" y designar como una categoría, haga clic en "Agregar a la categoría 'botón. Siguiente columna, designado 'B' y 'C' como una serie con el 'Agregar a la serie' botón.

En la parte inferior de la pantalla "Data Grid" - "B" Nombre de la columna, como '2007 'y la columna' C ', como '2008'. Seleccione un color distinto para cada serie - con el selector de color o introduciendo un código hexadecimal en el field.r texto proporcionado.

Page 23: Fusion Charts Graficos DWCS3

Cambie a la pestaña "Cuadro de selección 'y seleccione el' Column 'opción gráfico de la categoría de tabla de múltiples series.Abra los 'títulos y nombres de eje de los paneles, y entrar en el' xAxiaName 'y' yAxisname 'en los campos respectivos, para esta tabla vamos a definir el nombre de eje x como' Barrio 'y el nombre de eje y como' Ventas '.Cambie a la pantalla 'Opciones Generales' - y el nombre de 'myfirst_ms_chart' la carta y establecer la anchura y la altura de 400 píxeles y 300 píxeles respectivamente.En el 'Título, Subcaption' panel - Establecer el título como 'ventas' y el título Sub, 'Para 2007 y 2008 ".Marque la casilla 'Mostrar opciones avanzadas de verificación que se encuentra en la parte superior de la pantalla' Opciones Generales '. Ahora, vaya a la "formato de número y ampliación de un grupo especial y entrar en" $ "en el campo" Prefijo de número ».Utilice el botón "Vista previa abierta 'para ver el gráfico a continuación, haga clic en el botón' OK 'para incrustar el gráfico en su página web.

Ahora está listo para abrir la página en un navegador y ver su carta primera serie de varios en la acción.

Creación de gráficos> apiladas Gráfico

Page 24: Fusion Charts Graficos DWCS3

En esta sección le mostraremos cómo crear un gráfico apilado para muestra los costos totales incurridos por una empresa de fabricación de los cuatro trimestres del último ejercicio. El gráfico apilado se muestran los costos fijos y los costos variables como componentes de los costos totales. Para crear esta tabla vamos a utilizar algunos de los conceptos que se han descrito en detalle en la sección 'Tu primer gráfico' - así, le recomendamos que vaya a través de esa primera sección.

Vamos a utilizar la tabla de los siguientes datos para esta tabla:

Los pasos siguientes le guiarán a través del proceso de creación de un gráfico apilado:

En los 'Data Grid' ficha crear una tabla con 3 columnas y 4 filas. Introduzca los datos en la tabla al referirse a la tabla de datos (arriba).

Designar a la columna A como "Categorías", y la columna 'B' y 'C' en la serie.

En la parte inferior de la pantalla "Data Grid" - Nombre de la columna 'B' como 'costos fijos' y la columna "C" como "costos variables". Y elegir un color diferente para cada una de las series. Una vez que haya creado la tabla y designó a categorías y series - la pantalla de su "Data Grid" debería ser similar a la imagen (abajo).

Page 25: Fusion Charts Graficos DWCS3

Cambie a la pantalla de 'Selección de Cartas "y seleccione una' columna 'opción gráfico de la categoría' de los gráficos apilados.

En los títulos y los nombres de eje de un grupo especial, entrar en 'Barrio' en 'Los costos totales de la' xAxisName 'sobre el terreno y en el' yAxisName campo ".

Cambie a la pestaña 'General Options' y establecer el "Nombre de Tabla 'como' myfirstStackedChart" y especificar el ancho y altura deseada de la tabla en sus respectivos campos.

En el título, el panel de Subcaption - proporcionar el título y el título secundario para la tabla en sus respectivos campos. En este gráfico nos proporcionará "Análisis de Costo Trimestral", como el título, y "Para el año 2008" como el título sub ..

Marque la casilla 'Mostrar opciones avanzadas de verificación que se encuentra en la parte superior de la pantalla' Opciones Generales '. Ahora, vaya a la "formato de número y ampliación de un grupo especial y entrar en" $ "en el campo" Prefijo de número ».

El gráfico está listo; una vista previa utilizando el botón "Vista previa abierta 'y haga clic en" Aceptar "para insertar el gráfico en su página web.

Page 26: Fusion Charts Graficos DWCS3

Ahora puede abrir la página en un navegador para ver el primer gráfico apilado en la acción.

Creación de gráficos> Serie Multi gráfico apilado

En esta sección le mostraremos cómo crear un gráfico de la serie de múltiples apiladas para comparar el costo trimestral realizados por una empresa de fabricación por dos años consecutivos. Al igual que el gráfico apilado que hemos creado en la última sección de este módulo - esta tabla también ayudar al público a determinar el costo fijo y el costo variable que constituyen el costo total. Para crear esta tabla vamos a utilizar algunos de los conceptos que se han descrito en detalle en la sección 'Tu primer gráfico' - así, le recomendamos que vaya a través de esa primera sección.

A continuación la tabla de datos se utilizará para crear el gráfico de series múltiples apiladas:

Los pasos siguientes le guiarán a través del proceso de crear un gráfico de series múltiples apiladas:

Page 27: Fusion Charts Graficos DWCS3

En la pantalla 'Data Grid' - crear una tabla con 5 columnas y 4 filas y llenar los datos consultando la tabla de datos (arriba).

Designar a la columna 'A' como categorías y la columna 'B', 'C', 'D', y 'E' como una serie. En la porción inferior de la pantalla 'Data Grid' - nombre de la serie de la siguiente manera:

Columna B - Costo fijo para el año 2008

Columna C - Costo Variable para el año 2008

Columna D - Costo fijo para el año 2007

Columna E - costo variable para el año 2007

Por último, establecer un color distinto cada columna fo serie, la pantalla de su "Data Grid" debería parecerse a la imagen (abajo).

Cambie a la pantalla de 'Selección de Cartas "y seleccione la opción" Multi columna' gráfico de la categoría de 'gráfico apilado.

Puesto que hemos seleccionado el gráfico de columnas apiladas múltiples como el tipo de gráfico, una sección de "Columna del Grupo se mostrará en la pantalla 'Opciones de gráfico", ".

En la sección "Columna de Grupo ', seleccione' B 'de la columna y columna usando Ctrl-C + clic y luego haga clic en' Crear grupo 'botón. Nota - que el "B" tanto en la columna y 'C' se

Page 28: Fusion Charts Graficos DWCS3

han agrupado como "Grupo 1". Repita el mismo proceso con la columna "C" y "D" - que se agrupan como "Grupo 2".

En los títulos y los nombres de eje de la sección - entrar en 'Quarters' en 'el coste total', el 'xAxisName' campo y en el yAxisName'field '.

Cambie a la 'Options'screen general haciendo clic en la pestaña "Opciones de gráfico". Escribe 'myfirstmsschart' en el campo "Nombre de gráfico" y establecer la altura y la anchura de la tabla a 400 píxeles y 300 píxeles respectivamente, mediante la introducción de los valores en sus respectivos campos.

En el 'Título, Subcaption' panel - entrar en 'Análisis de Costo Trimestral' en el campo "Título" y "Para el año 2007 y 2008" en el Subcaption'field '.

Marque la casilla 'Mostrar opciones avanzadas de verificación que se encuentra en la parte superior de la pantalla' Opciones Generales '. Ahora, vaya a la "formato de número y ampliación de un grupo especial y entrar en" $ "en el campo" Prefijo de número ».

Vista previa de la tabla utilizando el botón "Vista previa abierta 'y haga clic en" Aceptar "para insertar el gráfico en su página web.

Page 29: Fusion Charts Graficos DWCS3

Ahora puede abrir su página web en un navegador para ver a su primera serie de múltiples gráfico apilado en la acción.

Creación de gráficos> Tabla de Combinación

Vamos a crear un doble eje gráfico de combinación para comparar los ingresos con un porcentaje de las ganancias. Vamos a trazar un gráfico de combinación en la que los ingresos se representa en forma de columnas y el porcentaje de ganancia se representa como una línea, tanto en ingresos como porcentaje de utilidad se trazan a lo largo de un eje Y aparte. Los datos de la tabla siguiente se utiliza para crear el gráfico de combinación.

Page 30: Fusion Charts Graficos DWCS3

Los siguientes pasos le guiarán a través del proceso de creación de un gráfico combinado:

Para crear un gráfico combinado empezar, la apertura de la interfaz a través del "Insertar gráfico compuesto 'botón que se encuentra en la barra de herramientas' FusionChartsforDW '. Para todos los ejemplos anteriores que fueron discutidas en este módulo se había utilizado en el botón 'Insertar gráfico simple' para la apertura de la interfaz, sin embargo, para la creación de un gráfico de combinación debe utilizar el "Insertar Tabla Compuesto 'botón.

Crear una tabla en la pantalla "Data Grid" con 3 columnas y 4 filas y luego llenarlo con referencia la tabla de datos (arriba).

Designar a la columna 'A' como 'Categorías' y la columna 'B' y 'C' como 'de la serie. En la parte inferior de la pantalla "Data Grid" - Nombre de la columna "B" como "Ingresos" y la columna "C" como "% de ganancia".

Cambie a la pantalla de 'Selección de Cartas "y seleccione la ficha del '2 D de doble Y' como el tipo de gráfico.

Aviso - de que una sección de 'Opciones de renderizado de la Serie de que se haya mostrado en la pantalla' Selección de los gráficos. En esta sección usted puede elegir el tipo de gráfico de datos para cada serie y también seleccionar un eje Y para cada serie. El eje Y que se muestra en el lado izquierdo se denomina eje Y primario y la que se muestra en el lado derecho se conoce como eje Y secundario. Para nuestro ejemplo vamos a estar preparando 'Ingresos', como 'Columnas' a lo largo del eje Y principal, y "% de ganancia 'como una' línea 'a lo largo del eje Y secundario. Los pasos siguientes muestran cómo elegir un plan de datos y un eje:

Para 'B' de la columna - Haga clic en el 'Render As' y seleccione 'Columnas' de la lista desplegable, haga clic en el botón al lado del "eje Render 'y seleccione' principal 'de la lista desplegable.

Para la columna "C" - establecer la "Renderizar como" parámetro a 'Línea' y el 'Eje Render' parámetro 'secundario'.

Page 31: Fusion Charts Graficos DWCS3

En los 'Títulos y Axia Nmaes' del panel - entrar en 'Barrio' en el campo 'xAxisNmme', 'ingresos' en el 'PYAxisName' presentado y "% de ganancia" en el "SYAxisName campo".

Marque la casilla 'Mostrar opciones avanzadas de verificación que se encuentra en la parte superior de la pantalla "Opciones de gráfico". Desplácese hacia abajo un poco y abrir el panel de los límites de los gráficos de los pulsando sobre ella y establecer el "SYAxisMaxValue 'a 100. Al hacer esto hemos establecido el límite máximo del eje Y secundario a 100.

Cambie a la pestaña 'General Options' y establecer el nombre de tabla para 'myfirstCombiChart', y luego ajustar la altura y el ancho de 400 píxeles y 300 píxeles respectivamente.

En el 'Título, Subcaption' panel - entrar en el análisis financiero'' para el año 2008 'en el' campo 'y' Leyenda de Ingresos vs% de ganancia "en el campo 'Subcaption'.

Compruebe los 'Mostrar opciones avanzadas' cheque boc que se encuentra en la parte superior de la pantalla 'Opciones Generales'. Ahora, vaya a la "formato de número y ampliación de un grupo especial y entrar en" $ "en el campo 'NumberPrefix' y '%' en el 'sNumberSuffix campo".

Vista previa de la tabla utilizando el botón "Vista previa abierta 'y haga clic en' Aceptar 'para incrustar el gráfico en su página web.

Page 32: Fusion Charts Graficos DWCS3

Ahora puede abrir la página en un navegador para ver el gráfico de combinación puño en la acción.

Configuración de los datos para el gráfico

Configuración de datos es el primer paso en el proceso de crear una tabla. Los datos se configura desde la pantalla de "Data Grid", que se muestra cuando en la pestaña "Data Grid" está activado.

Hay tres métodos alternativos que pueden ser utilizados para la configuración de datos del gráfico. Estos son:

Configuración de datos a través de la entrada manual de datos

Configuración de los datos mediante un archivo CSV externo

Configuración de los datos mediante un archivo XML externo

Selección de la fuente de datos

Puede utilizar cualquiera de los tres métodos de configuración de datos seleccionando el método deseado en la sección "Seleccionar origen de datos 'de la pantalla" Data Grid ". En la opción "entrada manual" por defecto es pre-seleccionada.

Nota: Para los usuarios que deseen utilizar los datos de una base de datos como fuente de datos para sus mapas - que han proporcionado un tutorial en esta sección que proporciona instrucciones, que le guiará a través del proceso de creación de un registro conjunto.

Configuración de datos en el gráfico> introducción manual de datos

Page 33: Fusion Charts Graficos DWCS3

Con el fin de introducir los datos manualmente, primero debe activar la opción "entrada manual". Por defecto la pantalla de 'Configuración de datos "contiene algunos datos de la muestra. Desde que se entra en nuestros propios datos, hay que borrar los datos utilizando el botón "Borrar". El "Reset" está situado en el lado derecho de la rejilla de entrada de datos.

Tabla de datos de entrada

En primer lugar tenemos que crear una tabla para introducir los datos. Para empezar, creamos una columna haciendo clic en el botón 'Agregar columna. Una columna indexado como 'A' será creado. Cada columna sucesiva adquisición de un índice alfabético en orden ascendente. Cada columna representa una serie de datos o una categoría.

Una vez que haya creado todas las columnas, ahora tendría que crear las filas. Cada fila tiene una categoría y los valores correspondientes. Usted puede agregar filas mediante el botón "Añadir fila".

Ahora que ha creado las filas y columnas, se puede empezar por enetring datos en la tabla. Para introducir datos en una celda, haga clic en él y un texto del cursor aparecerá. Escriba el valor que desea asignar a esa celda. Aparte de usar el ratón, puede utilizar la pestaña 'para pasar a la siguiente celda de esa fila. No proporcionar el nombre de la serie para su serie de datos dentro de las células. Esto se debe a todos los valores contenidos en la tabla de hecho se trazarán en el gráfico y el nombre de la serie será tratado como cualquier otro plan de datos.

Page 34: Fusion Charts Graficos DWCS3

Con el fin de eliminar uno o más columnas de la tabla, seleccione primero las columnas haciendo clic en el índice de la columna. A continuación, haga clic en el botón 'Eliminar columna (s)' para eliminar las columnas seleccionadas. Igualmente, puede eliminar filas mediante el uso de la "fila Eliminar (s) 'botón.

Pegar datos de tablas

FusionCharts para Dreamweaver le permite utilizar los datos de una tabla ya existente, que le ahorra la molestia de caer en el tedioso proceso de ingresar datos manualmente. Puede copiar toda la tabla en la cuadrícula de datos sin tener que crear columnas y filas - que se crea automáticamente.

Para pegar los datos en la cuadrícula de datos haga clic en el 'Pegar desde el portapapeles "botón. Se le pedirá con un cuadro de diálogo le preguntará si los datos que se pegan contiene la fila de encabezado. Haga clic en "Sí" si el conjunto de datos incluye el nombre de la serie de datos. De lo contrario, haga clic en 'No'. Es ventajoso para simular la situación primera

Definición de las categorías y series para el gráfico

Un gráfico no se puede trazar a menos que los datos han sido clasificados en categorías y de la serie. Para designar una columna como una columna de categorías, sólo tienes que seleccionar la columna y haga clic en 'Agregar como Categorías de botón. Ahora, seleccione cada una de las columnas - una a la vez, y designar a cada uno de ellos como una columna de la serie haciendo clic en "Añadir como la serie 'botón. Tenga en cuenta que un cuadro puede tener sólo una columna Categorías. Una vez que se han clasificado los datos en categorías y las series se encuentran las categorías y las columnas de la serie que figuran en las "Categorías y la serie de la sección.

Page 35: Fusion Charts Graficos DWCS3

Gestión de Categorías y de la serie

En las categorías y en la sección de la serie, puede proporcionar un nombre personalizado y un color para cada serie. Para cambiar el color de la serie se puede utilizar el selector de color visual o proporcionar un código de color hexadecimal - pero sin el prefijo #. Con el fin de cambiar el orden de la serie sólo tienes que seleccionar cualquiera de la serie y utilizar el "arriba" o el botón de "abajo" para cambiar el orden de la serie.

Configuración de datos en el gráfico> archivo CSV

FusionCharts para Dreamweaver le permite utilizar los datos de un archivo externo de datos CSV. Un archivo CSV o un archivo de valores separados por comas tiene una extensión. Csv y se puede abrir en un editor de texto. En un CSV cada elemento (o un elemento de datos) se separa de la otra por una coma. Esto significa que cada matriz horizontal de elementos puede ser considerado como una fila de una tabla. El siguiente es un ejemplo de los datos almacenados en formato CSV.

Con el fin de utilizar los datos desde un archivo CSV, asegúrese primero de que la opción "Importar CSV" está seleccionado. Ahora, es necesario especificar la ruta al archivo CSV en el cuadro de selección de archivos, puede escribir la ruta del archivo CSV o utilice el botón 'Browse' para que apunte al archivo CSV que desee. Si el archivo no está en el directorio raíz de su sitio, se le pedirá que lo guarde en el directorio raíz - se recomienda que guarde el archivo en algún lugar dentro del directorio raíz de su sitio. Haga clic en el botón 'Load' y los datos CSV se mostrará en la pantalla "Data Grid" en forma de tabla.

Definición de las categorías y series para el gráfico

Un gráfico no se puede trazar a menos que los datos han sido clasificados en categorías y de la serie. Para designar una columna como una columna de categorías, sólo tienes que seleccionar la columna pertinente y haga clic en 'Agregar como Categorías de botón. Ahora, seleccione cada una de las columnas y designar a cada uno de ellos como una columna de la serie haciendo clic en el 'Agregar a la serie' botón. Tenga en cuenta que un cuadro puede tener sólo una columna Categorías. Una vez que se han clasificado los datos

Page 36: Fusion Charts Graficos DWCS3

en categorías y las series que usted encontrará que aparece en las "Categorías y la serie de la sección.

En los de categorías y de la serie 'sección puede proporcionar un nombre para la columna de sus' Categorías 'y también para cada uno de sus' Series 'columna. Además también se puede personalizar el color de cada uno de la serie, ya sea usando el selector de color o introduciendo un código de color hexadecimal en el campo de texto adyacente (# no pre-fix es necesario). El orden de la serie se puede cambiar, mediante la selección de cualquier serie y luego usando el botón arriba o abajo flecha para cambiar la posición de la serie seleccionada.

Configuración de datos en el gráfico> Archivo XML

FusionCharts utiliza XML personalizado para la configuración gráfica. Usando FusionCharts que XML no sólo es posible configurar los datos del gráfico, sino también definir diferentes propiedades cosméticas de la tabla. Para obtener más información sobre http://www.fusioncharts.com/docs FusionCharts visita XML. Los siguientes son ejemplos de XML para la serie única y Multi Gráficos de la serie ..

Page 37: Fusion Charts Graficos DWCS3

El proceso de vincular el archivo XML es muy sencillo. En primer lugar, asegúrese de que la opción "Importar XML" está seleccionado. Ahora bien, proporcionar la ruta al archivo XML deseado, ya sea manualmente o utilizando el botón "Examinar" y luego haga clic en el botón 'Load' con el fin de vincular el archivo XML para su carta. En caso de que el archivo XML se encuentra fuera del directorio raíz del sitio, se le pedirá que lo guarde en el directorio raíz (de guardar el archivo dentro de la raíz no es obligatorio). Sin embargo, se recomienda que el archivo esté presente dentro de la carpeta raíz del sitio. Después de haber vinculado el archivo XML, se daría cuenta de los datos desde el archivo XML se visualiza en la pantalla "Data Grid" en forma de tabla. El uso de este método de configuración de datos le ahorra el problema de la definición de categorías y de la serie, ya que se define de forma automática.

Page 38: Fusion Charts Graficos DWCS3

Puede crear un archivo XML directamente al recuperar los datos de una base de datos. Para ello, puede utilizar la función de registros de Dreamweaver. Para obtener información acerca de la función de registros, visite el tutorial de registros.

Configuración de los parámetros de gráfico> Descripción

Propiedades de la tabla y diversos elementos gráficos se puede configurar desde la pestaña "Tabla de selección" y la pestaña 'General Options'.

La ficha Gráfico de Selección

Desde la pestaña 'Opciones de gráfico de los que puede seleccionar un tipo de gráfico, definir las líneas de tendencia y configurar las propiedades de los elementos del gráfico. Los paneles siguientes se muestran en la pantalla "Selección de Cartas":

Nombres del Eje

Datos de etiquetas y valores

Parcela de datos

lienzo

anclas

Leyendas

Líneas de Dividendos y rejillas

Plano cero

límites de los gráficos

3D Atributos funcionales

Cámara 3D, Iluminación y rotación de los atributos

Page 39: Fusion Charts Graficos DWCS3

Pared 3D de atributos

La pestaña 'Tabla de selección de' muestra un panel de acordeón para cada elemento gráfico. Cuando el panel de acordeón se hace clic, se expande lo que expone los parámetros configurables que contiene.

Con base en el tipo de gráfico que ha sido seleccionado, algunas opciones de gráficos específicos se mostrará en la pestaña 'Opions Chart ". Los parámetros enumerados en el panel de acordeón puede variar también dependiendo de la del tipo de la tabla que ha sido seleccionado.

Tabla de opciones específicas para Dual Gráficos Y de combinación

Opciones generales

En la pestaña 'General Options' puede proporcionar el nombre de su carta y también configurar el ancho y alto. Aparte de esto también puede configurar las propiedades de algunos elementos del gráfico.

Las propiedades globales de la gráfica se puede configurar desde la pestaña 'General Options':

Leyenda y Leyenda Sub

Borde y el fondo

Herramienta de Sugerencia

Número de formato y escala

Propiedades de fuente

Page 40: Fusion Charts Graficos DWCS3

Atributos funcionales

Las páginas siguientes proporcionan información detallada sobre la configuración de cada elemento de la tabla.

Configurando los parámetros de gráfico> Atributos funcionales

Atributos funcionales de la tabla se puede definir en el panel 'atributo funcional "que se encuentra bajo la pestaña' General Options '.

Después de opciones configurables están disponibles en el panel de los 'atributos Funcional de:

Animación: El 'Animación' parámetro hace que los elementos de la tabla para animar cuando el gráfico se representa en el navegador. Este parámetro está activo por defecto y se puede apagar.

defaultAnimation: El parámetro 'defaultAnimation' hace que el gráfico de datos para animar cuando el gráfico se representa en el navegador. Este parámetro está activo por defecto y se puede apagar.

clickURL: Este parámetro se convierte el gráfico en un punto de acceso, todo lo que tienes que hacer es introducir una URL en el campo de texto y el gráfico actuará como un enlace a esa URL.

Vxvxvxvxvxvxvxv Falta aca

Page 41: Fusion Charts Graficos DWCS3

Avanzados sobre gráficos de configuración> Las líneas de tendencia y Zonas

Las líneas de tendencia son líneas especiales que se utilizan para marcar los valores específicos en el eje Y, se utilizan para transmitir un mensaje especial para el público de la tabla. Por ejemplo, una línea de tendencia puede ser utilizado en el gráfico de una compañía de ventas para indicar los ingresos de destino.

Línea de tendencia

FusionCharts para Dreamweaver también le permite definir un trendzone. Un trendzone se utiliza la gama de oreja marca determinada de valores, el ejemplo siguiente se muestra la implicación de Trendzones.

Trendzone

Las líneas de tendencia se definen en la sección 'Las líneas de tendencia definidas por los que se encuentra en la pestaña "Cuadro de selección'. El 'definido líneas de tendencia' sección se compone de tres botones que son;

Añadir: El botón 'Agregar' se utiliza para la creación de una nueva línea de tendencia, haciendo clic en este botón se abre el panel de los 'Parámetros Trendline ".

Page 42: Fusion Charts Graficos DWCS3

Edit: el botón 'Editar' se utiliza para la edición de una línea de tendencia existente. Antes de utilizar la opción de edición que usted tiene que seleccionar primero una línea de tendencia pre-definido. El botón 'Editar' lanza el panel de los 'Parámetros Trendline los que muestra los datos relativos a la línea de tendencia seleccionada.

Eliminar: El botón 'Eliminar' se utiliza para eliminar una línea de tendencia. Para borrar una línea de tendencia seleccionar cualquier línea de tendencia predefinido y haga clic en el botón "Eliminar" para eliminarlo.

Configuración de interfaz de líneas de tendencia sección

Parámetros Grupo TrendLine

El panel de los parámetros de Trendline se divide en dos secciones, que son;

Definir la línea de tendencia

Establecer estilos de línea de tendencia

Page 43: Fusion Charts Graficos DWCS3

A raíz de las opciones de configuración están disponibles en la sección "Definición de línea de tendencia" del panel de los 'Parámetros Trendline ".

valorlnicial: En este campo puede especificar el valor del eje y en la que se creó la línea de tendencia ..

EndValue: En este campo puede especificar el valor final de la línea de tendencia. Establecer un valor final de la línea de tendencia hará que la línea de tendencia que se muestra como una línea inclinada - a menos que haya permitido a la 'isTrendZone' parámetro ..

DisplayValue: El texto introducido en el campo 'DisplayValue' se mostrará en la etiqueta de línea de tendencia. La etiqueta de línea de tendencia ayuda en la transmisión de los efectos de la línea de tendencia a la audiencia de la tabla.

Mostrar Eje: Esta opción le permite elegir entre el principal eje o el eje y secundaria-como el eje de la línea de tendencia. Especificación del eje se convierte en obligatoria para los de doble eje Y Gráficos.

Page 44: Fusion Charts Graficos DWCS3

Después de opciones configurables están disponibles en la sección "Establecer estilo de línea de tendencia"

color: Esta opción le permite personalizar el color de la línea de tendencia.

alfa: Esta opción le permite establecer el valor alfa del valor de la línea de tendencia, alfa que se indique en el rango de 0 a 100.

Espesor: Esta opción le permite definir el grosor de la línea de tendencia mediante la especificación de un valor en píxeles.

isTrendZone: Activar esta opción convertirá la región entre el 'starValue' y el 'EndValue' en un trendzone.

showOnTop: Si está activado, este parámetro hace que las líneas de tendencia que se mostrará en la parte superior de la trama de datos. Este parámetro sólo funciona con los gráficos 2D.

valueOnRight: Esta opción hace que la etiqueta línea de tendencia a ser dispalyed en el lado derecho de la tabla en lugar del lado izquierdo.

discontinua: Activar esta opción hará que la línea de tendencia que se mostrará como una línea discontinua.

dashLen: Esta opción sólo es aplicable cuando el 'trazos' opción está activada, esta opción se utiliza para que especificar la longitud de cada guión, el valor tiene que ser especificada en términos de pixeles.

dashGap: Esta opción se utiliza para especificar la longitud de la brecha que separa a dos guiones, el valor tiene que ser especificada en términos de pixeles.

Configuración de la gráfica avanzada> Líneas de Dividendos

Línea de división (Línea Div.) se origina a partir de un punto sobre el eje Y y atraviesa toda la anchura de la tela, una tabla puede tener muchas líneas div procedentes de puntos que están situados a intervalos regulares en el eje Y. Líneas Div ayuda en la interpretación de datos - al proporcionar un marco visual que asiste a la audiencia de la tabla en el proceso de adecuación de la altura de la trama de datos con la escala del eje Y.

Page 45: Fusion Charts Graficos DWCS3

Líneas Div se puede configurar desde las líneas de Dividendos y rejillas de un grupo especial que se encuentra en la pantalla de 'Selección de Cartas'. Las líneas de Dividendos y rejillas de los paneles se muestra solamente cuando "Mostrar opciones avanzadas 'casilla de verificación ha sido seleccionada.

Siguiendo los parámetros configurables están disponibles en las líneas de Dividendos y rejillas de los paneles:

adjustDiv: Este parámetro es muy útil porque, si está activado - que ajusta automáticamente la distancia entre dos líneas div basados en los valores de los datos.

showDivLineValues: Este parámetro le permite mostrar u ocultar los valores de asis Y que están asociados con las líneas de div.

showDivLineSecondaryValues: Este parámetro le permite mostrar u ocultar los valores y secundario de los ejes que están asociados con las líneas div.

numDivLines: En el campo 'numDivLines' puede especificar el número de líneas div que desea mostrar en el gráfico.

yAxisValuesStep: Este parámetro le permite mostrar todos los enésimo valor de eje Y, con el fin de configurar este parámetro, se tendría que especificar el intervalo de paso en el campo 'yAxisValueStep'.

Page 46: Fusion Charts Graficos DWCS3

divLineColor: El uso de este parámetro, se puede personalizar el color de las líneas div.

divLineThickness: Este parámetro permite establecer el grosor de las líneas de div.

divLineAlpha: El uso de este parámetro que ca establecer el nivel de alfa de las líneas de div.

divLinesDashed: Si se habilita este parámetro - líneas div aparecerá como líneas discontinuas.

Div. de puntos de línea

divLineDashLen: Este parámetro sólo es aplicable si 'divLinesDashed' parámetro está activado, utiliza este parámetro se puede establecer la longitud del tablero, en píxeles.

divLineDashGap: Este parámetro sólo es aplicable si 'divLinesDashed' está habilitada, con este parámetro se puede establecer la longitud de la brecha que separa dos guiones consecutivos.

showAlternateGridColor: Si se habilita este parámetro - cada red alternativa será de color ..

Page 47: Fusion Charts Graficos DWCS3

Colorear Red Alternativa

alternateGridColor: El uso de este parámetro, se puede personalizar el color que se utilizará para la coloración de cada cuadrícula de alternativa en la tabla ..

alternateGridAlpha: El uso de este parámetro se puede especificar el alfa del color de relleno que se aplicará a cada cuadrícula de alternativa en la carta.

La aparición de las líneas y redes de div se puede mejorar mediante el uso de estilos - estilos de las líneas y redes de div se puede configurar en su respectiva definición de estilo de un grupo especial. Para abrir el "estilo" del panel de líneas div utilizar el botón 'Estilo de Marco Div. Líneas' y para definir el estilo de 'Guía de estilo H Marco' uso las redes botón.

Configuración de la gráfica avanzada> Formato Número

FusionCharts para Dreamweaver puede dar formato a los valores y otros números que marcan la escala a lo largo del eje. Formato de número se gestiona desde los conceptos básicos de número y formato de ampliación "del panel que se encuentra en la pestaña 'General Options'.

Después de opciones configurables están disponibles en el panel "formato de número".

Page 48: Fusion Charts Graficos DWCS3

formatNumber: El 'formatNumber' de los parámetros de forma automática los formatos de números asociados con el principal eje - los números se formatea utilizando por defecto o personalizada definida separadores de miles. Coma es el valor predeterminado separador de miles. Este parámetro sólo funciona si el "formatNumberScale 'parámetro se ha desactivado.

sFormatNumber: El 'sFormatNumber' de los parámetros de forma automática los formatos números asociados con eje y secundario - los números se formatea utilizando por defecto o personalizada definida separadores de miles. Coma es el valor predeterminado separador de miles. Este parámetro sólo funciona si el "sFormatNumberScale 'ha sido desactivado.

Decimales: El parámetro 'decimales de forma automática todo depende de los números para el número especificado de posiciones decimales. Supongamos que los decimales de los que se establece en 2 - a continuación, 12.345 se mostrará como 12,34.

Page 49: Fusion Charts Graficos DWCS3

Gráfico con el número especificado de decimales

Gráfico sin número especificado de decimales

sDecimals: Este parámetro se utiliza para especificar el número de decimales para los valores relacionados con el eje y secundario.

forceDecimals: El parámetro 'forceDecimals los agrega automáticamente un relleno de 0 a fin de que el número congruente con el número especificado de posiciones decimales. Supongamos que el parámetro 'decimales de los que se establece en 2 - a continuación, 12,5 se mostrará como 12,50.

Page 50: Fusion Charts Graficos DWCS3

sYAxisValueDecimals: Este parámetro se utiliza para especificar el número de decimales para los números que se muestran a lo largo del eje y secundario de la tabla.

Otros parámetros de formato de número

Si el 'Mostrar opciones avanzadas casilla de verificación "se selecciona - algunos parámetros adicionales se mostrarán en los conceptos básicos de número y formato de ampliación" del panel. Los siguientes son los parámetros configurables avanzados que están disponibles en las bases de los número y formato de ampliación "del panel:

formatNumberScale: Si está activado, este parámetro hace que los valores y los números asociados con el eje Y principal de la tabla para estar formateados con el incumplimiento o la escala definida.

sFormatNumberScale: Si está activado, este parámetro hace que los valores y los números asociados con el eje Y secundario de la tabla para estar formateados con el incumplimiento o la escala definida.

yAxisValueDecimals: Este parámetro permite especificar el número máximo de decimales para los números que aparecen a lo largo del eje Y de un gráfico.

sYAxisValueDecimals: Este parámetro permite especificar el número de decimales para los números que aparecen a lo largo de él el eje Y secundario de un gráfico.

decimalSeperator: Este parámetro permite especificar el carácter que se utilizará para separar los dígitos de un número de sus decimales. '.' es el separador predeterminado - Sin embargo, usted puede utilizar cualquier carácter como separador decimal.

thousandSeparator: En el 'thousandSeparator' campo puede especificar el carácter que se utiliza como separador de un millar de.

Page 51: Fusion Charts Graficos DWCS3

NumberPrefix: En el campo 'NumberPrefix' puede especificar los caracteres que se puede anteponer a los valores de los datos asociados con el eje Y principal y los números que aparecen a lo largo del eje Y. El 'NumberPrefix' característica es muy útil ya que permite a los nombres de prefijo de divisas, tales como 'E' y '$'.

numberSuffix: En el 'numberSuffix' campo puede especificar los caracteres que se sufijo de los valores de datos asociada al eje Y principal y los valores que aparecen a lo largo del eje Y principal. El 'numberSuffix' característica puede ser utilizada para caracteres de sufijo, como%, HRS, min etc

sNumberPrefis: En el 'sNumberPrefix' campo puede especificar los caracteres que se puede anteponer a los valores asociados con el eje Y secundario y los números que aparecen a lo largo del eje Y secundario.

sNumerSuffix: En el 'snumberSuffix' campo puede especificar caracteres que se sufijo a los valores asociados con el eje Y y los números que aparecen a lo largo del eje Y secundario.

defaultnumberScale, numberScaleValue y numberScaleUnit:

Estos parámetros son colectivamente utilizado para definir el eje Y escala.

El proceso de configuración de una escala se explica con ejemplos, en el primer ejemplo le muestra cómo definir una escala para representar el tiempo.

60 segundos = 1 minuto

60 minutos = 1 hora

24 horas = 1 día

7 días = 1 semana

Con el fin de definir una escala como se muestra arriba - establecer el 'defaultNumberScale' parámetro como 's', ya que segundo es la unidad básica para definir el tiempo. A continuación, introduzca los 60, 60,24,7 'en el' campo 'y' numberScaleValue min, h, d, semanas 'en el' numberScaleUnit campo ". Los valores introducidos en el campo 'numberScaleValue' es utilizado por FusionCharts para la conversión de unidades, la tabla siguiente se muestra cómo las unidades apropiadas de forma automática el sufijo de cada valor de datos.

Page 52: Fusion Charts Graficos DWCS3

Durante el uso de una escala de medida - es necesario tener en cuenta que los datos de la serie debe ser siempre en términos de la 'defaultNumberScale' unidad. Para la escala de tiempo del 'defaultNumberScale' unidad es segundo - así, los datos deben ser expresados en términos de segundos - como se muestra a continuación.

300 segundos = 5 min

7200 segundos = 2 horas

86400 segundos = 1 día

604800 segundos = 1 semana

Usando FusionCharts para DW puede configurar casi cualquier tipo de escala - aquí es otro ejemplo.

100 centi metros = 1 metro

Page 53: Fusion Charts Graficos DWCS3

Para definir este baremo que figura 'defaultNumberScale "a" cm ", introduce '100' en el 'campo' y 'numberScaleValue m' en la 'numberScaleUnit campo". Esta escala sólo funcionará si los datos se ha configurado en términos de la 'defaultNumberScale "unidad - que en este caso es un centímetro.

sDefaultNumberScale, sNumberScaleValue y sNumberScaleUnit: Estos parámetros se utilizan para definir una escala para el eje Y secundario. El proceso de definición de una escala para el secundario eje Y es el mismo que para definir una escala para el eje Y primario.

Configuración de la gráfica avanzada> límites de los gráficos

Límites de los gráficos se refieren al punto de partida y el punto final de la escala del eje Y.

Page 54: Fusion Charts Graficos DWCS3

Propiedades de los límites de los gráficos puede ser configurado desde el 'ChartLimits de un grupo especial que se encuentra en la pantalla "Cuadro de selección'. Tenga en cuenta que el panel de los ChartLimits 'no se mostrará a menos que la casilla' Mostrar opciones avanzadas de verificación ha sido seleccionada.

Siguiendo los parámetros configurables están disponibles en el panel de los 'ChartLimits de:

ShowLimits: Este parámetro le permite mostrar u ocultar los límites de la escala del eje Y.

showSecondaryLimits: El uso de este parámetro, se puede mostrar u ocultar los límites del eje Y secundario.

setAdaptiveYmin: Si el parámetro 'setAdaptiveYmin' está activado - el punto de inicio de la escala del eje Y se determina automáticamente según los valores de los datos.

Page 55: Fusion Charts Graficos DWCS3

Valor determina automáticamente mínimo para el eje Y

setAdaptiveSYMIn: El uso de este parámetro, se puede encender o apagar el min y adaptable para el eje Y secundario.

yAxisMinValue: En el 'yAxisMinValue' campo puede especificar el valor mínimo de la escala del eje Y. Usted puede usar este parámetro si no está satisfecho con la adaptación min Y.

yAxisMaxValue: En el 'yAxisMaxValue' campo puede especificar el límite máximo de la escala del eje Y.

sYAxisMinValue: En el 'sYAxisMinValue' campo puede especificar el valor mínimo de la escala del eje secundario Y.

sYAxisMaxValue: En el 'sYAxisMaxValue' campo puede specfify el valor máximo de la escala del eje secundario Y.

Estilos> Información general

FusionCharts para Dreamweaver le permite aplicar estilos a los distintos elementos de las listas de éxitos. Estilos se pueden utilizar para mejorar la apariencia de los diversos elementos del gráfico y para configurar los efectos de animación para ellos.

FusionCharts para Dreamweaver ofrece seis tipos de estilos:

Page 56: Fusion Charts Graficos DWCS3

animación

fuente

sombra

brillo

bisel

mancha

El Panel de Estilo

En el "estilo" del panel, se encuentran los tipos de estilo a lo largo de los seis que figuran en la esquina superior izquierda del panel. Para ver los parámetros configurables que pertenecen a un estilo - sólo tienes que seleccionar uno de los tipos de estilo y luego marque la casilla 'Usar este estilo "casilla de verificación, los parámetros se muestran en el panel.

Page 57: Fusion Charts Graficos DWCS3

FusionCharts para Dreamweaver le permite guardar la configuración de su estilo como un valor preestablecido. Al guardar la configuración del estilo como un preset - se llega a reutilizar la misma configuración para los elementos de la tabla. FusionCharts para Dreamweaver almacena de forma permanente sus presets por lo que también se puede utilizar para los gráficos en el futuro, se puede definir como valores predeterminados que se desee y también puede eliminar los predeterminados si usted siente que ya no son necesarios.

Estilo Estilo> Parámetros

Los estilos se pueden aplicar a la mayoría de los elementos gráficos. Sin embargo, algunos elementos no son compatibles con todo tipo de estilos. Por ejemplo, estilo de fuente no es aplicable a la tela y estilo de animación no se puede aplicar a las etiquetas. Por lo tanto las opciones que se muestran en el panel de estilo varía dependiendo del elemento para el que va a definir el estilo. A continuación hay una lista de parámetros que se pueden configurar para cada tipo de estilo.

Animación

Descripción de los parámetros

Propiedad Este parámetro le permite determinar la naturaleza de la animación de las opciones incluyen _x, _y, _xscale y _yscale

Valor inicial Con este parámetro se puede especificar el valor inicial de, por ejemplo la animación, si se desea animar la trama de datos para efecto de fundido de entrada alfa, el valor inicial de alfa sería 0

Flexibilización animación de suavizado se refiere a la naturaleza de la animación, tú lo puedes elegir, de rebote, regular, elástica y la animación de primavera.

Animación Duración1 El uso de este parámetro, se puede especificar la duración de OT animación.

Sombra

Descripción de los parámetros

Page 58: Fusion Charts Graficos DWCS3

Distancia La distancia (en píxeles), hasta donde la sombra en la pantalla.

El ángulo de la sombra.

Color El color de la sombra.

Alpha Alpha de la sombra.

Desenfoque X Esto se refiere a la medida de la falta de definición horizontal, el valor especificado debe ser una potencia de 2 -, tal como 2, 4, 8, 16, etc

Desenfoque Y Esto se refiere a la medida de la falta de definición vertical, el valor especificado debe ser una potencia de 2 -, tal como 2, 4, 8, 16, etc

La calidad puede ser baja, media o alta.

Fuerza refiere a la intensidad de la sombra o la oscuridad de la sombra.

Brillo

Descripción de los parámetros

Desenfoque X Esto se refiere a la medida de la falta de definición vertical, el valor especificado debe ser una potencia de 2 -, tal como 2, 4, 8, 16, etc

Desenfoque Y Esto se refiere a la medida de la falta de definición vertical, el valor especificado debe ser una potencia de 2 -, tal como 2, 4, 8, 16, etc

La calidad puede ser ajustado en bajo, medio o alto.

Fuerza refiere a la intensidad de la glowr.

Color El color de resplandor.

El Alfa alfa de color de resplandor

Bisel

Descripción de los parámetros

Distancia La distancia de desplazamiento del bisel.

Ángulo Ángulo de Bisel.

shadowColor color de la sombra ..

shadowAlpha Alfa del color de la sombra.

Page 59: Fusion Charts Graficos DWCS3

Desenfoque X Esto se refiere a la medida de la falta de definición horizontal, el valor especificado debe ser una potencia de 2 -, tal como 2, 4, 8, 16, etc

Desenfoque Y Esto se refiere a la medida de la falta de definición vertical, el valor especificado debe ser una potencia de 2 -, tal como 2, 4, 8, 16, etc

La calidad puede ser ajustado en bajo, medio o alto.

Fuerza de intensidad

Resalte Colro El color de resaltado del bisel.

Seleccione Alpha Alpha del color de resaltado.

Mancha

Descripción de los parámetros

Desenfoque X Esto se refiere a la medida de la falta de definición horizontal, el valor especificado debe ser una potencia de 2 -, tal como 2, 4, 8, 16, etc

Desenfoque Y Esto se refiere a la medida de la falta de definición vertical, el valor especificado debe ser una potencia de 2 -, tal como 2, 4, 8, 16, etc

La calidad puede ser ajustado en bajo, medio o alto.

Fuente

Descripción de los parámetros

Font Puede seleccionar un tipo de fuente aquí.

Tamaño Este parámetro le permite ajustar el tamaño de la fuente.

Color

El uso de este parámetro, se puede personalizar el color de la fuente.

Efectos de fuente Seleccione si el texto debe ser negrita, cursiva o subrayado.

Antecedentes de texto Especifique el color de fondo del texto.

Frontera de texto Especifique el color del borde del texto.

Margen Izquierda del texto Establecer el ancho de los márgenes izquierdo en píxeles.

Page 60: Fusion Charts Graficos DWCS3

Espacio Carta de fuente Establecer la longitud de la brecha que separa a dos personajes.

fontisHTML Si esta casilla se selecciona el texto = se representa como HTML de lo contrario, se muestra como texto sin formato.

Estilos> Presets

Presets son configuraciones predefinidas que se pueden aplicar a los gráficos con el fin de mejorar su apariencia. En otras palabras, los presets son temas que están destinados a difundir una mirada distinta y se siente a su gráfico. FusionCharts para Dreamweaver ofrece tres tipos de presets:

Presets Gráfico: El uso de los presets de los gráficos que se pueden configurar grandes gráficos que buscan con facilidad. FusionCharts para DW ofrece muchos de los presets predefinidos de gráficos que configuran los diversos elementos de su carta para crear un aspecto temático.

El Acero Tabla de preset

Page 61: Fusion Charts Graficos DWCS3

Ajustes previos del estilo: FusionCharts para DW ofrece cinco de los presets de estilo ", que controlan los efectos y la animación de los elementos del gráfico.

Presets Esquema de color: El uso de 'Combinación de colores' predeterminado se puede configurar temas atractivos para el lienzo gráfico y los elementos contenidos en ella.

El esquema de color CandyBlue

La aplicación de ajustes preestablecidos

Aparece la pantalla 'Opciones de gráfico' contiene tres botones de preselección - una para cada tipo de preselección. Con el fin de aplicar un ajuste preestablecido todo lo que tienes que hacer es clic en el botón para el tipo de ajuste preestablecido que desea aplicar y seleccione la opción que desee de la lista desplegable. Por lo tanto, si usted desea aplicar un "estilo predefinido" - simplemente haga clic en el botón "preset Estilo 'y seleccione una opción en el menú desplegable resultante. Usted puede utilizar el botón "Vista previa abierta 'para ver el aspecto de su carta después de haber aplicado el preset.

Page 62: Fusion Charts Graficos DWCS3

Solución de problemas> Preguntas más frecuentes

En esta sección hemos dado respuesta a algunos de los problemas más comunes.

Recibí un mensaje de error cuando traté de FusionCharts se registran para DW. ¿Qué debo hacer?

El mensaje de error puede ser debido a muchas razones diferentes - elegir una solución de la lista (abajo), que se corresponde con el código de error que aparece en la pantalla.

502, 662, 663: Esto implica que el número de serie introducido por usted es incorrecto. Asegúrese de que está introduciendo la clave de licencia correcta. Si aún así no funciona, vaya a Cuenta> Página MyProducts de www.extendstudio.com y desde allí se puede obtener la clave de licencia correcta.

503, 664: Este mensaje indica problemas con la clave de licencia para varios usuarios. Póngase en contacto con el vendedor a quien le compró la licencia, en caso de que lo compró directamente desde nuestro sitio web - iniciar sesión en su cuenta de Studio Extend e ir a la mi página, haga clic Productos en el botón "Borrar" para obtener una nueva clave de licencia.

301: Este mensaje indica que la clave de licencia, que le han entrado ya está en uso. Si usted está tratando de instalar una licencia de usuario único - que tendría que restablecer la licencia de la página web de Studio Extend. Por licencia multi-usuario siga las instrucciones indicadas para solucionar el error 503664.

¿Puedo dibujar las columnas y las líneas en una sola carta? En caso afirmativo, ¿dónde puedo encontrar la opción para configurar un cuadro?

Page 63: Fusion Charts Graficos DWCS3

Listas que contienen más de un tipo de diagramas de datos se denominan cuadros de combinación. Listas de fusión para DW ofrece varios tipos de cartas de combinación, con el fin de configurar un gráfico de combinación - que tendrá que llamar a la interfaz mediante "Insertar gráficos compuso 'botón. Va a encontrar todas las cartas combinadas disponibles que figuran en la pestaña "Cuadro de selección '.

¿Puedo prefijo símbolos de moneda a valores numéricos?

Sí - FusionCharts para Dreamweaver es compatible con prefijos el número y el sufijo numérico. Puede especificar este desde el panel de la "formato de número" en la pestaña 'General Options'. Usted no encontrará el prefijo del número o la opción de sufijo de número en el panel del "formato de número", a menos que haya comprobado la casilla 'Mostrar opciones avanzadas de verificación que se encuentra en la parte superior de la pantalla' Opitons General de Accionistas.

El gráfico muestra las bandas de colores, incluso después de que han cambiado el color del lienzo, ¿cómo puedo solucionar esto?

Las bandas de colores son en realidad redes de colores alternativamente, usted puede desactivar el color alternativo de las redes de las 'Líneas y Redes Dic de un grupo especial que se encuentra en la pestaña "Cuadro de selección'. Las líneas de Dividendos y rejillas de un grupo especial sólo se mostrará si la casilla 'Mostrar opciones avanzadas de verificación ha sido seleccionada. Con el fin de desactivar la coloración alternativa de redes acaba de apagar el 'showAlternateGridColor' parámetro.

¿Cómo puedo eliminar un color que ha sido accidentalmente añadido a la 'gradientEditor'?

En caso de que accidentalmente ha añadido un extra en el CLOR 'gradientEditor', puede eliminar el gradiente extra por seleccionar el icono de la barra deslizante correspondiente al color que desea eliminar. Sólo tienes que arrastrar el cursor más allá del borde del editor de gradiente y serán eliminados.

Solución de problemas> Apoyo a la Información

Page 64: Fusion Charts Graficos DWCS3

En caso de que se enfrentan algún problema al utilizar FusionCharts para DW - se puede buscar la ayuda de nuestro servicio de soporte en línea. Ofrecemos tres modalidades de apoyo.

Cliente: Nuestro soporte de correo electrónico está disponible de forma gratuita, usted puede enviar todas sus consultas a nuestro equipo de soporte en [email protected].

Soporte de pago: Para adquirir información sobre el soporte de pago - visite el siguiente enlace.

http://www.extendstudio.com/paid-support.html

Ayuda Foros Información: Para obtener asistencia rápida puede visita nuestro foro de mesa de ayuda donde encontrará preguntas enviadas por algunos de nuestros usuarios y las respuestas a estas preguntas - que son enviados por nuestro equipo de soporte. Haga clic aquí para visitar el foro de soporte técnico.